/* ----------------------------------------------------------------------------------------
* Author        : Awaiken
* Template Name : Artistic - Creative Digital Agency HTML Template
* File          : CSS File
* Version       : 1.0
* ---------------------------------------------------------------------------------------- */
/* INDEX
----------------------------------------------------------------------------------------
01. Global Variables
02. General css
03. Header css
04. Hero css
05. Scrolling Ticker css
06. About Agency css
07. Our Services css
08. Digital Success css
09. Why Choose Us css
10. Join Agency css
11. How It Work css
12. Our Features css
13. Our Portfolio css
14. Our Testimonial css
15. Agency Benefits Css
16. Our Blog Css
17. Footer css
18. About Us Page css
19. Services Page css
20. Services Single css
21. Blog Archive css
22. Blog Single css
23. Project Page css
24. Project Single css
25. Team Page css
26. Team Single css
27. Pricing Page css
28. Testimonial Page css
39. Image Gallery css
30. Video Gallery css
31. FAQs Page css
32. Contact Us Page css
33. 404 Page css
34. Responsive css
-------------------------------------------------------------------------------------- */

/************************************/
/*** 	 01. Global Variables	  ***/
/************************************/

:root {
  --primary-color: #ffffff;
  --secondary-color: #1b1b1b;
  --text-color: #f5f5f4;
  --accent-color: #f15a22;
  --dark-color: #000000;
  --divider-color: #ffffff1a;
  --dark-divider-color: #f7fbfa1a;
  --error-color: rgb(230, 87, 87);
  --default-font: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/************************************/
/*** 	   02. General css		  ***/
/************************************/

body {
  position: relative;
  font-family: var(--default-font);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.6em;
  color: var(--text-color);
  background: url("../images/section-bg-shape.png") var(--dark-color);
  background-repeat: repeat-y;
  background-position: top 900px center;
  background-size: 100% auto;
  cursor: default !important;
}

p {
  line-height: 1.7em;
  margin-bottom: 1.6em;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  font-weight: 500;
  line-height: 1.2em;
  color: var(--primary-color);
}

figure {
  margin: 0;
}

img {
  max-width: 100%;
}

a {
  text-decoration: none;
}

a:hover {
  text-decoration: none;
  outline: 0;
}

a:focus {
  text-decoration: none;
  outline: 0;
}

html {
  scroll-behavior: smooth;
  cursor: default !important;
}

html,
body {
  width: 100%;
  overflow-x: clip;
  
}

.container {
  max-width: 1300px;
}

.container,
.container-fluid,
.container-lg,
.container-md,
.container-sm,
.container-xl,
.container-xxl {
  padding-right: 15px;
  padding-left: 15px;
}

.image-anime {
  position: relative;
  overflow: hidden;
}

.image-anime:after {
  content: "";
  position: absolute;
  width: 200%;
  height: 0%;
  left: 50%;
  top: 50%;
  background-color: rgba(255, 255, 255, 0.3);
  transform: translate(-50%, -50%) rotate(-45deg);
  z-index: 1;
}

.image-anime:hover:after {
  height: 250%;
  transition: all 600ms linear;
  background-color: transparent;
}

.reveal {
  position: relative;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  visibility: hidden;
  overflow: hidden;
}

.reveal img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -webkit-transform-origin: left;
  transform-origin: left;
}

.row {
  margin-right: -15px;
  margin-left: -15px;
}

.row > * {
  padding-right: 15px;
  padding-left: 15px;
}

.row.no-gutters {
  margin-right: 0px;
  margin-left: 0px;
}

.row.no-gutters > * {
  padding-right: 0px;
  padding-left: 0px;
}
.btn-default {
  display: inline-block;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.4em;
  text-transform: capitalize;
  background: #000;
  color: #fff;
  border: 2px solid #f15a22;
  border-radius: 100px;
  padding: 14px 50px 14px 25px;
  margin-right: 50px;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  transition: all 0.5s ease-in-out;
  position: relative;
  z-index: 1;
  overflow: hidden;
}

.btn-default::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  border-radius: 100px;
  opacity: 0.2;
  width: 100%;
  height: 100%;
  z-index: -1;
}

.btn-default::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background-color: #f15a22;
  background-image: url("../images/arrow-dark.svg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 20px auto;
  transition: all 0.4s ease-in-out;
}

.btn-default:hover::before {
  background-color: #fff;
  transform: translate(0px, -18px) rotate(45deg);
}

.btn-default:hover {
  background-color: #f15a22;
  color: #000;
  border: none;
}

.btn-highlighted {
  position: relative;
  display: inline-block;
  line-height: 1.3em;
  font-size: 16px;
  font-weight: 700;
  background: var(--accent-color);
  color: var(--dark-color);
  text-transform: capitalize;
  border-radius: 10px;
  padding: 15px 30px;
  border: none;
  overflow: hidden;
  transition: all 0.4s ease-in-out;
  z-index: 1;
}

.btn-highlighted:hover {
  background-color: var(--primary-color);
}

.preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1000;
  background-color: var(--dark-color);
  display: flex;
  align-items: center;
  justify-content: center;
}

.loading-container,
.loading {
  height: 100px;
  position: relative;
  width: 100px;
  border-radius: 100%;
}

.loading-container {
  margin: 40px auto;
}

.loading {
  border: 1px solid transparent;
  border-color: transparent var(--accent-color) transparent var(--accent-color);
  animation: rotate-loading 1.5s linear 0s infinite normal;
  transform-origin: 50% 50%;
}

.loading-container:hover .loading,
.loading-container .loading {
  transition: all 0.5s ease-in-out;
}

#loading-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  max-width: 66px;
  transform: translate(-50%, -50%);
}

@keyframes rotate-loading {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

.section-row {
  margin-bottom: 80px;
}

.section-row .section-title {
  width: 100%;
  /* max-width: 605px; */
  max-width: 100%;
  margin-bottom: 0;
}

.section-title {
  margin-bottom: 40px;
}

.section-title h3 {
  display: inline-block;
  position: relative;
  font-size: 20px;
  font-weight: 500;
  line-height: normal;
  /* letter-spacing: 0.2em; */
  /* text-transform: uppercase; */
  color: var(--primary-color);
  padding-left: 24px;
  margin-bottom: 20px;
}

.section-title h3::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  background: url(../images/dots.png) no-repeat;
  background-position: left center;
  background-size: cover;
  width: 16px;
  height: 16px;
}

.section-title h1 {
  font-size: 1.5rem;
  font-weight: 500;
  line-height: 1.2em;
  color: var(--primary-color);
  margin-bottom: 0;
  cursor: none;
}

.section-title h1 span {
  font-weight: 600;
  color: var(--accent-color);
}

.section-title h2 {
  font-size: 56px;
  font-weight: 500;
  line-height: 1.2em;
  color: var(--primary-color);
  margin-bottom: 0;
  cursor: none;
}

.section-title h2 span {
  font-weight: 600;
  color: var(--accent-color);
}

.section-title p {
  margin-top: 25px;
  margin-bottom: 0;
}

.section-content-btn .section-title-content {
  margin-bottom: 30px;
}

.section-title-content p {
  margin: 0;
}

.help-block.with-errors ul {
  margin: 0;
  text-align: left;
}

.help-block.with-errors ul li {
  color: var(--error-color);
  font-weight: 500;
  font-size: 14px;
}

/************************************/
/**** 	   03. Header css		 ****/
/************************************/

header.main-header {
  position: absolute;
  top: 0;
  width: 100%;
  border-bottom: 1px solid var(--divider-color);
  z-index: 100;
}

header.main-header .header-sticky {
  position: relative;
  top: 0;
  z-index: 100;
}

header.main-header .header-sticky.hide {
  transform: translateY(-100%);
  transition: transform 0.3s ease-in-out;
  border-radius: 0;
}

header.main-header .header-sticky.active {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  border-radius: 0;
  transform: translateY(0);
  background: var(--dark-color);
  border-bottom: 1px solid var(--divider-color);
  backdrop-filter: blur(30px);
  -webkit-backdrop-filter: blur(30px);
}

.navbar {
  padding: 25px 0;
  align-items: center;
}

.navbar-brand {
  padding: 0;
  margin: 0;
}

.main-menu .nav-menu-wrapper {
  flex: 1;
  text-align: left;
  margin-left: 40px;
}

.main-menu .nav-menu-wrapper > ul {
  align-items: center;
  display: inline-flex;
}

.main-menu ul li {
  margin: 0;
  position: relative;
}

.main-menu ul li.nav-item a {
  font-size: 16px;
  font-weight: 600;
  padding: 15px !important;
  color: var(--primary-color);
  text-transform: capitalize;
  transition: all 0.3s ease-in-out;
}

.main-menu ul li.submenu > a:after {
  content: "\f107";
  font-family: "FontAwesome";
  font-weight: 900;
  font-size: 14px;
  margin-left: 8px;
}

.main-menu ul li a:hover,
.main-menu ul li a:focus {
  color: var(--accent-color);
}

.main-menu ul ul {
  visibility: hidden;
  opacity: 0;
  transform: scaleY(0.8);
  transform-origin: top;
  padding: 0;
  margin: 0;
  list-style: none;
  width: 230px;
  border-radius: 20px;
  position: absolute;
  left: 0;
  top: 100%;
  background: var(--accent-color);
  text-align: left;
  transition: all 0.3s ease-in-out;
}

.main-menu ul li.submenu:first-child ul {
  width: 230px;
}

.main-menu ul ul ul {
  left: 100%;
  top: 0;
  text-align: left;
}
.main-menu ul li:hover > ul {
  visibility: visible;
  opacity: 1;
  transform: scaleY(1);
  padding: 5px 0;
}

.main-menu ul li.submenu ul li.submenu > a:after {
  content: "\f105";
  float: right;
}

.main-menu ul ul li {
  margin: 0;
  padding: 0;
}

.main-menu ul ul li.nav-item a {
  color: var(--dark-color);
  padding: 6px 20px !important;
  transition: all 0.3s ease-in-out;
}

.main-menu ul li:hover > ul {
  visibility: visible;
  opacity: 1;
  transform: scaleY(1);
  padding: 5px 0;
}

.main-menu ul ul li a:hover,
.main-menu ul ul li a:focus {
  color: var(--primary-color);
  background-color: transparent;
  padding: 6px 20px 6px 23px !important;
}

.header-social-box {
  align-items: center;
}

.header-social-links {
  margin-right: 20px;
}

.header-social-links ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  align-items: center;
}

.header-social-links ul li {
  line-height: normal;
  margin-right: 15px;
  padding: 0;
}

.header-social-links ul li a {
  color: inherit;
}

.header-social-links ul li:last-child {
  margin: 0;
}

.header-social-links ul li i {
  font-size: 20px;
  color: var(--accent-color);
  transition: all 0.4s ease-in-out;
}

.header-social-links ul li:hover i {
  color: var(--primary-color);
}

.header-btn .btn-popup {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  z-index: 100;
}

.header-btn .offcanvas-backdrop {
  z-index: 100;
}

.header-btn .btn-popup {
  background: var(--divider-color);
  border-radius: 50%;
  border: none;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.header-btn .btn-popup img {
  max-width: 14px;
}

body:has(:not(.offcanvas)) {
  padding-right: initial !important;
}

body:has(.offcanvas) {
  padding-right: 0 !important;
}

.header-btn .offcanvas {
  position: fixed;
  top: 0;
  bottom: 0;
  left: auto;
  right: -15px;
  background: var(--secondary-color) !important;
  border-radius: 0;
  opacity: 100%;
  width: 100% !important;
  height: 100% !important;
  max-width: 375px;
  border: none;
  padding: 150px 37px 150px 30px;
  transform: translateX(100%) !important;
  z-index: 101;
  transition: all 0.3s ease-in-out !important;
}

.offcanvas.show:not(.hiding),
.offcanvas.showing {
  transform: translateX(0) !important;
}

.navbar-expand-lg .offcanvas .offcanvas-body {
  display: block;
}

.header-btn .offcanvas .btn-close {
  position: absolute;
  top: 30px;
  right: 37px;
  background-color: transparent;
  border: 1px solid var(--primary-color);
  border-radius: 50%;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  filter: brightness(0) invert(1);
  opacity: 100%;
  box-shadow: none;
  padding: 0;
}

.header-contact-box {
  text-align: center;
  border-bottom: 1px solid var(--divider-color);
  padding-bottom: 30px;
  margin-bottom: 30px;
}

.header-contact-box .icon-box {
  margin-bottom: 20px;
}

.header-contact-box .icon-box img {
  max-width: 40px;
}

.header-contact-box-content h3 {
  font-size: 22px;
  text-transform: capitalize;
  margin-bottom: 10px;
}

.header-contact-box-content p {
  color: var(--text-color);
  margin: 0;
}

.header-social-links.sidebar-social-links {
  text-align: center;
  margin-right: 0;
}

.header-social-links.sidebar-social-links h3 {
  font-size: 22px;
  text-transform: capitalize;
  margin-bottom: 20px;
}

.header-social-links.sidebar-social-links ul {
  justify-content: center;
}

.header-social-links.sidebar-social-links ul li a {
  background-color: transparent;
  border: 1px solid var(--accent-color);
  border-radius: 50%;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease-in-out;
}

.header-social-links.sidebar-social-links ul li a:hover {
  border-color: var(--primary-color);
}

.responsive-menu,
.navbar-toggle {
  display: none;
}

.responsive-menu {
  top: 0;
  position: relative;
}

.slicknav_btn {
  background: var(--accent-color);
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  margin: 0;
  border-radius: 8px;
}

.slicknav_icon .slicknav_icon-bar {
  display: block;
  width: 100%;
  height: 3px;
  width: 22px;
  background-color: var(--dark-color);
  border-radius: 6px;
  margin: 4px auto !important;
  transition: all 0.1s ease-in-out;
}

.slicknav_icon .slicknav_icon-bar:first-child {
  margin-top: 0 !important;
}

.slicknav_icon .slicknav_icon-bar:last-child {
  margin-bottom: 0 !important;
}

.navbar-toggle
  a.slicknav_btn.slicknav_open
  .slicknav_icon
  span.slicknav_icon-bar:nth-child(1) {
  transform: rotate(-45deg) translate(-5px, 5px);
}

.navbar-toggle
  a.slicknav_btn.slicknav_open
  .slicknav_icon
  span.slicknav_icon-bar:nth-child(2) {
  opacity: 0;
}

.navbar-toggle
  a.slicknav_btn.slicknav_open
  .slicknav_icon
  span.slicknav_icon-bar:nth-child(3) {
  transform: rotate(45deg) translate(-5px, -5px);
}

.slicknav_menu {
  position: absolute;
  width: 100%;
  padding: 0;
  background: var(--accent-color);
}

.slicknav_menu ul {
  margin: 5px 0;
}

.slicknav_menu ul ul {
  margin: 0;
}

.slicknav_nav .slicknav_row,
.slicknav_nav li a {
  position: relative;
  font-size: 16px;
  font-weight: 600;
  text-transform: capitalize;
  padding: 8px 20px;
  color: var(--dark-color);
  line-height: normal;
  margin: 0;
  border-radius: 0 !important;
  transition: all 0.3s ease-in-out;
}

.slicknav_nav a:hover,
.slicknav_nav a:focus,
.slicknav_nav .slicknav_row:hover {
  background-color: transparent;
  color: var(--primary-color);
}

.slicknav_menu ul ul li a {
  padding: 8px 20px 8px 30px;
}

.slicknav_arrow {
  font-size: 0 !important;
}

.slicknav_arrow:after {
  content: "\f107";
  font-family: "FontAwesome";
  font-weight: 900;
  font-size: 12px;
  margin-left: 8px;
  color: var(--dark-color);
  position: absolute;
  right: 15px;
  top: 15px;
  transition: all 0.3s ease-out;
}

.slicknav_open > a .slicknav_arrow:after {
  transform: rotate(-180deg);
  color: var(--primary-color);
}

/************************************/
/***        04. Hero css	      ***/
/************************************/

.hero {
  position: relative;
  padding: 100px 0 0;
  /* min-height: 100vh; */
}
.typed-title {
  color: #fff !important;
  font-weight: 500 !important;
  font-size: 60px;
}
.hero .hero-bg-video {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
}

.hero .hero-bg-video video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hero.bg-image {
  position: relative;
  background: url("../images/hero-bg.jpg") no-repeat;
  background-position: center center;
  background-size: cover;
}

.hero.bg-image::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(
    270deg,
    rgba(0, 0, 0, 0) -73.04%,
    rgba(22, 22, 22, 0.3) 1.71%,
    var(--secondary-color) 100%
  );
  width: 100%;
  height: 100%;
  z-index: 0;
}

.hero.hero-slider-layout {
  background: none;
  padding: 0;
}

.hero.hero-slider-layout .hero-slide {
  position: relative;
  background: url("../images/hero-bg.jpg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  padding: 215px 0 120px;
  min-height: 100vh;
}

.hero.hero-slider-layout .hero-slide.slide-2 {
  background: url("../images/hero-bg-2.jpg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

.hero.hero-slider-layout .hero-slide::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(
    270deg,
    rgba(0, 0, 0, 0) -73.04%,
    rgba(22, 22, 22, 0.3) 1.71%,
    var(--secondary-color) 100%
  );
  width: 100%;
  height: 100%;
  z-index: 1;
}

.hero.hero-slider-layout .hero-slide .hero-slider-image {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
}

.hero.hero-slider-layout .hero-slide .hero-slider-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hero.hero-slider-layout .hero-pagination {
  position: absolute;
  bottom: 30px;
  text-align: center;
  z-index: 2;
}

.hero.hero-slider-layout .hero-pagination .swiper-pagination-bullet {
  width: 12px;
  height: 12px;
  background: var(--primary-color);
  opacity: 1;
  transition: all 0.3s ease-in-out;
  margin: 0 5px;
}

.hero.hero-slider-layout .hero-pagination .swiper-pagination-bullet-active {
  background-color: var(--accent-color);
}

.hero-content {
  position: relative;
  z-index: 1;
}

.hero-content .section-title {
  width: 100%;
  margin-bottom: 70px;
  /* height: 500px; */
}

.typing-title {
  display: none;
  font-size: 60px;
}

.section-title h1 span div {
  color: transparent;
}

.hero-content-body {
  display: flex;
  align-items: center;
  /* margin-left: 450px; */
  margin-bottom: 20px;
}

.hero-content-video {
  width: 0%;
  display: flex;
  align-items: center;
}

.hero-content-video .video-play-button a {
  background: var(--accent-color);
  border-radius: 50%;
  height: 100px;
  width: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: none;
  transition: all 0.3s ease-in-out;
}

.hero-content-video .video-play-button:hover a {
  background-position: right center;
}

.hero-content-video .video-play-button a i {
  font-size: 35px;
  color: var(--dark-color);
}

.learn-more-circle {
  margin-left: -20px;
}

.learn-more-circle img {
  max-width: 100px;
  animation: infiniterotate 30s infinite linear;
}

@keyframes infiniterotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

.hero-video-content {
  width: 58%;
}

.hero-video-content p {
  margin: 0;
}

.hero-btn {
  /* text-align: center; */
  margin-top: 00px;
}

/************************************/
/***   05. Scrolling Ticker css   ***/
/************************************/

.our-scrolling-ticker {
  background-color: var(--accent-color);
  padding: 26px 0;
}

.scrolling-ticker-box {
  --gap: 40px;
  position: relative;
  display: flex;
  overflow: hidden;
  user-select: none;
  gap: var(--gap);
  align-items: center;
}

.scrolling-content {
  flex-shrink: 0;
  display: flex;
  gap: var(--gap);
  min-width: 100%;
  animation: scroll 40s linear infinite;
}

.scrolling-content span {
  display: inline-block;
  font-size: 40px;
  font-weight: 700;
  line-height: 1.2em;
  color: var(--dark-color);
  vertical-align: middle;
}

.scrolling-content span img {
  width: 100%;
  max-width: 24px;
  margin-right: 40px;
}

@keyframes scroll {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(calc(-100% - var(--gap)));
  }
}

/************************************/
/***     06. About Agency css	  ***/
/************************************/

.about-agency {
  position: relative;
  padding: 80px 0 80px;
}

.about-agency::before {
  content: "";
  display: block;
  position: absolute;
  left: -120px;
  top: 50%;
  background: url(../images/section-bg-shape-3.png) no-repeat;
  background-position: left center;
  background-size: contain;
  opacity: 50%;
  width: 386px;
  height: 400px;
  animation: circlerotate 20s infinite linear;
  z-index: -1;
}

@keyframes circlerotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

.about-agency-content {
  position: sticky;
  top: 100px;
  padding-right: 35px;
}

.about-agency-list {
  border-left: 1px solid var(--divider-color);
  display: flex;
  flex-wrap: wrap;
  gap: 30px 30px;
  padding-left: 50px;
}

.about-agency-item {
  width: 100%;
}

.about-agency-item .icon-box {
  margin-bottom: 20px;
}

.about-agency-item .icon-box img {
  max-width: 40%;
}

.agency-item-content h3 {
  position: relative;
  font-size: 22px;
  text-transform: capitalize;
  margin-bottom: 10px;
}

.agency-item-content h3:after {
  content: "";
  position: absolute;
  top: 0;
  left: -60px;
  background: url("../images/dots.png") no-repeat;
  background-position: left center;
  background-size: cover;
  width: 20px;
  height: 20px;
}

.agency-item-content p:last-child {
  margin: 0;
}

/************************************/
/***     07. Our Services css     ***/
/************************************/

/************************************/
/***    09. Digital Success css   ***/
/************************************/

.digital-success {
  padding: 80px 0;
}

.digital-success-box {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 80px;
  padding: 80px;
  position: relative;
  border-radius: 30px;
  background: linear-gradient(180deg, #f15a22 0%, rgba(0, 0, 0, 0) 90.04%);
}

.digital-success-box::before {
  content: "";
  position: absolute;
  left: 20px;
  top: 20px;
  border-radius: 16px;
  background: linear-gradient(180deg, #000000 75%, rgba(0, 0, 0, 0) 99.04%);
  width: calc(100% - 40px);
  height: calc(100% - 20px);
}

.digital-success-list,
.digital-success-content {
  position: relative;
  width: calc(50% - 40px);
  z-index: 1;
}

.digital-success-content::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: -40px;
  border: 1px dashed var(--dark-divider-color);
  height: 100%;
  transition: all 0.4s ease-in-out;
}

.digital-success-content .section-title {
  margin-bottom: 80px;
}

.success-counter-box {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}

.success-counter-item {
  width: calc(50% - 15px);
}

.success-counter-item h2 {
  font-size: 50px;
  color: var(--accent-color);
  margin-bottom: 10px;
}

.success-counter-item p {
  margin: 0;
}

.success-list-item {
  background: url("../images/dots.png") no-repeat;
  background-position: left top 2px;
  background-size: 20px auto;
  padding-left: 30px;
  margin-bottom: 80px;
}

.success-list-item:last-child {
  margin-bottom: 0;
}

.success-list-item p {
  margin: 0;
}

.success-list-item p span {
  font-size: 22px;
  font-weight: 700;
  text-transform: capitalize;
}

/************************************/
/***     10. Why Choose Us css    ***/
/************************************/

.why-choose-us {
  position: relative;
  padding: 160px 0;
}

.why-choose-us::before {
  content: "";
  display: block;
  position: absolute;
  left: -20px;
  top: 80px;
  background: url(../images/work-together-bg-shape.png) no-repeat;
  background-position: left top;
  background-size: contain;
  width: 250px;
  height: 250px;
  opacity: 40%;
  animation: circlerotate 10s infinite linear;
  animation-direction: alternate;
  z-index: -1;
}

@keyframes circlerotate {
  0% {
    transform: translateY(0) rotate(0deg);
  }
  100% {
    transform: translateY(110%) rotate(360deg);
  }
}
/************************************/
/***      10. Join Agency css     ***/
/************************************/

.join-agency {
  padding: 80px 0 50px;
}

.agency-social-item {
  position: relative;
  border: 1px solid var(--divider-color);
  border-radius: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 10px 0 20px 0px;
  padding: 30px 40px 30px 70px;
  transition: all 0.3s ease-in-out;
}

.agency-social-item .icon-box {
  position: absolute;
  top: -30px;
  left: -30px;
}

.agency-social-item .icon-box a {
  position: relative;
  display: block;
  background-color: var(--accent-color);
  border-radius: 50%;
  width: 80px;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  transition: all 0.5s ease-in-out;
}

.agency-social-item:hover .icon-box a {
  background-color: transparent;
  color: #fff !important;
  z-index: 10;
}

.agency-social-item .icon-box a::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  /* background: var(--secondary-color); */
  background: #1b1b1b80;
  border-radius: 50%;
  transform: translate(100%, 100%);
  transition: all 0.4s ease-in-out;
}

.agency-social-item:hover .icon-box a::before {
  transform: translate(0);
}

.agency-social-item .icon-box i {
  position: relative;
  font-size: 40px;
  color: var(--dark-color);
  transition: all 0.4s ease-in-out;
  z-index: 1;
}

.agency-social-item:hover .icon-box a i {
  color: var(--primary-color);
}

.agency-social-content h3 {
  font-size: 22px;
  text-transform: capitalize;
  margin-bottom: 5px;
}

.agency-social-content p {
  margin: 0;
}

.agency-social-btn {
  margin-left: 10px;
}

.readmore-btn {
  border: 1px solid var(--primary-color);
  border-radius: 50%;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease-in-out;
}

.readmore-btn:hover {
  border-color: var(--accent-color);
}

.readmore-btn img {
  max-width: 24px;
  transition: all 0.3s ease-in-out;
}

.agency-social-item:hover .readmore-btn img {
  transform: rotate(45deg);
}

/************************************/
/***     11. How It Work css      ***/
/************************************/

.how-it-work {
  position: relative;
  padding: 80px 0 50px;
}

.how-it-work::before {
  content: "";
  display: block;
  position: absolute;
  left: -90px;
  top: 40%;
  background: url(../images/how-work-bg-shape.png) no-repeat;
  background-position: left center;
  background-size: contain;
  opacity: 50%;
  width: 297px;
  height: 340px;
  animation: roundrotate 8s infinite linear;
  animation-direction: alternate;
  z-index: -1;
}

@keyframes roundrotate {
  from {
    transform: translateY(0) rotate(0);
  }
  to {
    transform: translateY(100px) rotate(360deg);
  }
}

.work-process-item {
  position: relative;
  background: url(../images/service-bg.svg) no-repeat;
  background-position: top left;
  background-size: auto;
  border: 1px solid var(--divider-color);
  border-radius: 30px;
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  height: calc(100% - 30px);
  margin-bottom: 30px;
  padding: 40px;
  transition: all 0.4s ease-in-out;
  overflow: hidden;
}

.work-process-item:hover {
  transform: translateY(-5px);
}

.work-process-item::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: var(--secondary-color);
  opacity: 40%;
  z-index: -1;
}

.work-process-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 40px;
}

.work-process-title h3 {
  font-size: 22px;
  text-transform: capitalize;
}

.work-process-btn {
  margin-left: 10px;
}

.work-process-item:hover .work-process-btn .readmore-btn img {
  transform: rotate(45deg);
}

.work-process-content {
  margin-bottom: 80px;
}

.work-process-content p {
  margin: 0;
}

.work-process-body {
  display: flex;
  align-items: center;
  padding-top: 20px;
}

.work-process-no {
  width: 50%;
  padding-right: 10px;
}

.work-process-no h3 {
  font-size: 22px;
  text-transform: uppercase;
  margin-bottom: 5px;
}

.work-process-no h2 {
  font-size: 40px;
  color: var(--accent-color);
}

.work-process-icon-box {
  width: 50%;
  position: absolute;
  display: block;
  bottom: 0;
  right: 0;
  text-align: center;
  background-color: var(--accent-color);
  border-radius: 30px 0 30px 0;
  padding: 40px;
  overflow: hidden;
}

.work-process-icon-box::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--primary-color);
  border-radius: 30px 0 30px 0;
  transform: translate(100%, 100%);
  transition: all 0.4s ease-in-out;
}

.work-process-item:hover .work-process-icon-box::before {
  transform: translate(0);
}

.work-process-icon-box img {
  position: relative;
  max-width: 60px;
}

/************************************/
/***     12. Our Features css     ***/
/************************************/

.our-features {
  position: relative;
  padding: 80px 0;
}

.our-features::before {
  content: "";
  display: block;
  position: absolute;
  right: -90px;
  top: 50%;
  background: url(../images/features-bg-shape.png) no-repeat;
  background-position: left center;
  background-size: contain;
  opacity: 50%;
  width: 300px;
  height: 285px;
  animation: squrerotate 5s infinite linear;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  z-index: -1;
}

@keyframes squrerotate {
  from {
    transform: translate(0, 0) rotate(0deg);
  }
  to {
    transform: translate(-150px, 200px) rotate(180deg);
  }
}

.digital-features-box {
  height: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 60px;
}

.digital-features-item.features-item-1 {
  width: calc(60% - 30px);
}

.digital-features-item.features-item-2 {
  width: calc(40% - 30px);
}

.digital-features-item {
  position: relative;
  padding: 60px;
  border: 1px solid var(--divider-color);
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  border-radius: 30px;
  overflow: hidden;
}

.digital-features-item::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: var(--secondary-color);
  opacity: 40%;
  z-index: 0;
}

.digital-features-image {
  position: relative;
  border-radius: 30px;
  overflow: hidden;
  margin-bottom: 40px;
  z-index: 1;
}

.digital-features-image img {
  width: 100%;
  object-fit: cover;
  border-radius: 30px;
  transition: all 0.4s ease-in-out;
}

.digital-features-item.features-item-1 .digital-features-image img {
  aspect-ratio: 1 / 0.46;
}

.digital-features-item.features-item-2 .digital-features-image img {
  aspect-ratio: 1 / 0.72;
}

.digital-features-item:hover .digital-features-image img {
  transform: scale(1.1);
}

.digital-features-content {
  position: relative;
  z-index: 1;
}

.digital-features-content h3 {
  font-size: 22px;
  text-transform: capitalize;
  margin-bottom: 10px;
}

.digital-features-content p {
  margin: 0;
}

.digital-features-item.agency-supports {
  padding: 60px 0;
}

.agency-supports-header {
  position: relative;
  display: flex;
  align-items: center;
  margin-bottom: 50px;
  padding: 0 60px;
  z-index: 1;
}

.agency-supports-content {
  width: 50%;
}

.agency-supports-content h3 {
  font-size: 22px;
  text-transform: capitalize;
  margin-bottom: 10px;
}

.agency-supports-content p {
  margin: 0;
}

.agency-free-consultation {
  width: 50%;
  text-align: right;
}

.agency-free-consultation img {
  max-width: 100px;
  animation: infiniterotate 30s infinite linear;
}

.agency-supports-slider {
  position: relative;
}

.agency-supports-slider::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  background: linear-gradient(280deg, #030709 0%, rgba(3, 7, 9, 0) 60.97%);
  width: 215px;
  height: 100%;
  z-index: 2;
}

.agency-supports-slider::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  background: linear-gradient(90deg, #030709 0%, rgba(3, 7, 9, 0) 60.97%);
  width: 215px;
  height: 100%;
  z-index: 2;
}

.agency-supports-logo {
  background-color: var(--secondary-color);
  border-radius: 10px;
  text-align: center;
  padding: 25px 30px;
}

.agency-supports-logo img {
  max-height: 40px;
}

/************************************/
/***    13. Our Portfolio css     ***/
/************************************/

.our-portfolio {
  padding: 80px 0 40px;
}

.our-Project-nav {
  text-align: center;
  margin-bottom: 80px;
}

.our-Project-nav ul {
  list-style: none;
  text-align: center;
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 10px 20px;
  padding: 0;
  margin: 0;
}

.our-Project-nav ul li a {
  position: relative;
  display: inline-block;
  background-color: transparent;
  border: 1px solid var(--divider-color);
  border-radius: 10px;
  color: var(--text-color);
  font-weight: 400;
  line-height: 1.2em;
  text-transform: capitalize;
  transition: all 0.3s ease-in-out;
  padding: 10px 20px;
  overflow: hidden;
}

.our-Project-nav ul li a.active-btn,
.our-Project-nav ul li a:hover {
  background-color: var(--accent-color);
  color: var(--dark-color);
}

.project-item {
  height: calc(100% - 40px);
  margin-bottom: 40px;
  text-align: center;
  overflow: hidden;
}

.project-image {
  position: relative;
  margin-bottom: 20px;
}

.project-image figure {
  display: block;
  border-radius: 30px;
  overflow: hidden;
}

.project-image img {
  width: 100%;
  aspect-ratio: 1 / 0.8;
  object-fit: cover;
  border-radius: 30px;
  transition: all 0.4s ease-in-out;
}

.project-item:hover .project-image figure img {
  transform: scale(1.1);
}

.project-tag {
  position: absolute;
  top: 25px;
  right: 25px;
  z-index: 1;
}

.project-tag a {
  display: block;
  background-color: var(--divider-color);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  color: var(--text-color);
  border-radius: 6px;
  font-size: 14px;
  text-transform: capitalize;
  padding: 6px 15px;
}

.project-btn {
  position: absolute;
  top: 50%;
  left: 50%;
  opacity: 0;
  visibility: hidden;
  transform: translate(-50%, -30%);
  transition: all 0.3s ease-in-out;
  z-index: 1;
}

.project-item:hover .project-btn {
  transform: translate(-50%, -50%);
  opacity: 1;
  visibility: visible;
}

.project-btn a {
  border: 1px solid var(--primary-color);
  border-radius: 50%;
  width: 100px;
  height: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease-in-out;
}

.project-btn a:hover {
  background-color: var(--accent-color);
  border-color: var(--accent-color);
}

.project-btn a img {
  max-width: 42px;
  transition: all 0.3s ease-in-out;
}

.project-btn a:hover img {
  filter: brightness(1) invert(1);
  transform: rotate(45deg);
}

.project-content h3 {
  font-size: 22px;
  text-transform: capitalize;
}

/************************************/
/***    14. Our Testimonial Css   ***/
/************************************/

.our-testimonial {
  position: relative;
  padding: 80px 0;
}

.our-testimonial::before {
  content: "";
  display: block;
  position: absolute;
  left: -70px;
  top: 50%;
  background: url(../images/Graph_3dThird.png) no-repeat;
  background-position: left center;
  background-size: contain;
  opacity: 70%;
  width: 306px;
  height: 304px;
  animation: circlerotate 20s infinite linear;
  z-index: -1;
}

.our-testimonial .section-row .section-title {
  max-width: 100%;
}

.testimonial-review-box {
  position: relative;
  width: 100%;
  border: 1px solid var(--divider-color);
  border-radius: 30px;
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  text-align: center;
  overflow: hidden;
  padding: 50px;
}

.testimonial-review-box::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: var(--secondary-color);
  opacity: 40%;
  z-index: -1;
}

.testimonial-review-header {
  margin-bottom: 30px;
}

.testimonial-review-header h2 {
  font-size: 80px;
  font-weight: 600;
}

.testimonial-review-header .testimonial-rating {
  margin-bottom: 10px;
}

.testimonial-review-header p {
  margin: 0;
}

.testimonial-review-content {
  margin-bottom: 30px;
}

.testimonial-review-content h3 {
  font-size: 22px;
}

.company-client-images {
  margin-bottom: 10px;
}

.satisfy-client-image {
  display: inline-block;
  margin-left: -14px;
  border: 1px solid var(--dark-color);
  border-radius: 50%;
  overflow: hidden;
}

.satisfy-client-image:first-child {
  margin: 0;
}

.satisfy-client-image figure {
  display: block;
}

.satisfy-client-image img {
  max-width: 40px;
}

.testimonial-slider {
  margin-left: 30px;
}

.testimonial-slider .swiper-wrapper {
  cursor: none;
}

.testimonial-company-logo {
  margin-bottom: 30px;
}

.testimonial-company-logo img {
  max-width: 120px;
  max-height: 30px;
}

.testimonial-rating {
  margin-bottom: 20px;
}

.testimonial-rating i {
  font-size: 16px;
  color: var(--accent-color);
  margin-right: 2px;
}

.testimonial-rating i:last-child {
  margin-right: 0;
}

.testimonial-content {
  margin-bottom: 40px;
}

.testimonial-content p {
  font-size: 22px;
  font-weight: 600;
  color: var(--primary-color);
  margin-bottom: 0;
}

.testimonial-body {
  display: flex;
  align-items: center;
}

.author-image {
  margin-right: 15px;
}

.author-image figure {
  display: block;
  border-radius: 50%;
  overflow: hidden;
}

.author-image img {
  max-width: 60px;
  border-radius: 50%;
}

.author-content {
  width: calc(100% - 75px);
}

.author-content h3 {
  font-size: 22px;
  text-transform: capitalize;
  margin-bottom: 5px;
}

.author-content p {
  text-transform: capitalize;
  margin: 0;
}

.testimonial-btn {
  position: absolute;
  bottom: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: right;
  margin-top: 30px;
  z-index: 2;
}

.testimonial-slider .testimonial-button-next,
.testimonial-slider .testimonial-button-prev {
  position: relative;
  width: 60px;
  height: 60px;
  background: var(--secondary-color);
  border-radius: 14px;
  transition: all 0.4s ease-in-out;
}

.testimonial-slider .testimonial-button-next {
  margin-left: 30px;
}

.testimonial-slider .testimonial-button-next:hover,
.testimonial-slider .testimonial-button-prev:hover {
  background: var(--accent-color);
}

.testimonial-slider .testimonial-button-next::before,
.testimonial-slider .testimonial-button-prev::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: url("../images/arrow-white.svg") no-repeat center center;
  background-size: 30px auto;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: rotate(45deg);
  transition: all 0.4s ease-in-out;
}

.testimonial-slider .testimonial-button-prev::before {
  transform: rotate(225deg);
}

.testimonial-slider .testimonial-button-next:hover:before,
.testimonial-slider .testimonial-button-prev:hover:before {
  filter: brightness(1) invert(1);
}

.testimonial-benefits-box {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 150px;
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  border: 1px solid var(--divider-color);
  border-radius: 30px;
  overflow: hidden;
  margin-top: 100px;
  padding: 60px;
}

.testimonial-benefits-box::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: var(--secondary-color);
  opacity: 40%;
  z-index: -1;
}

.testimonial-benefits-item {
  position: relative;
  width: calc(25% - 112.5px);
}

.testimonial-benefits-item::before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  right: -75px;
  transform: translateY(-50%);
  border-right: 1px solid var(--divider-color);
  height: 80%;
  z-index: 1;
}

.testimonial-benefits-item:last-child:before {
  display: none;
}

.testimonial-benefits-item .icon-box {
  margin-bottom: 30px;
}

.testimonial-benefits-item .icon-box img {
  max-width: 40px;
}

.testimonial-benefits-content h3 {
  font-size: 22px;
  text-transform: capitalize;
  margin-bottom: 20px;
}

.testimonial-benefits-content ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.testimonial-benefits-content ul li {
  position: relative;
  padding-left: 25px;
  margin-bottom: 15px;
}

.testimonial-benefits-content ul li::before {
  content: "\2a";
  font-family: "FontAwesome";
  position: absolute;
  top: 0;
  left: 0;
  font-size: 16px;
  color: var(--primary-color);
}

.testimonial-benefits-content ul li:last-child {
  margin-bottom: 0;
}

/************************************/
/***    15. Agency Benefits Css   ***/
/************************************/

.agency-benefits {
  position: relative;
  padding: 150px 0 150px;
}

.agency-benefits::before {
  content: "";
  display: block;
  position: absolute;
  right: -90px;
  top: 10%;
  background: url(../images/agency-benefits-bg-shape.png) no-repeat;
  background-position: left center;
  background-size: contain;
  opacity: 50%;
  width: 279px;
  height: 287px;
  animation: circlerotate 12s infinite linear;
  z-index: 0;
}

.benefits-steps-item {
  position: relative;
  width: 100%;
  border: 1px solid var(--divider-color);
  border-radius: 30px;
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  overflow: hidden;
  height: calc(100% - 30px);
  margin-bottom: 30px;
  padding: 30px 25px;
}

.benefits-steps-item::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: var(--secondary-color);
  opacity: 40%;
  z-index: -1;
}

.benefits-steps-no {
  margin-bottom: 40px;
}

.benefits-steps-no h3 {
  font-size: 22px;
}

.benefits-steps-item .icon-box {
  margin-bottom: 40px;
}

.benefits-steps-item .icon-box img {
  max-width: 60px;
}

.benefits-steps-content h3 {
  font-size: 22px;
  text-transform: capitalize;
  margin-bottom: 10px;
}

.benefits-steps-content p {
  margin: 0;
}

/************************************/
/***      16. Our Blog Css        ***/
/************************************/

.our-blog {
  padding: 80px 0 40px;
}

.our-blog .section-row .section-title {
  max-width: 100%;
}

.post-item {
  height: calc(100px - 30px);
  margin-bottom: 30px;
}

.post-featured-image {
  margin-bottom: 30px;
}

.post-featured-image figure a {
  cursor: none;
  display: block;
  border-radius: 30px;
  overflow: hidden;
}

.post-featured-image img {
  aspect-ratio: 1 / 0.75;
  object-fit: cover;
  border-radius: 30px;
  transition: all 0.5s ease-in-out;
}

.post-item:hover .post-featured-image img {
  transform: scale(1.1);
}

.post-item-content {
  margin-bottom: 20px;
}

.post-item-content h3 {
  font-size: 22px;
}

.post-item-content h3 a {
  color: inherit;
}

.post-item-btn a {
  position: relative;
  display: inline-block;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.2em;
  text-transform: capitalize;
  color: var(--accent-color);
  padding-right: 30px;
  border: none;
}

.post-item-btn a:hover {
  color: var(--primary-color);
}

.post-item-btn a::before {
  content: "";
  position: absolute;
  top: -2px;
  right: 0;
  background-image: url(../images/arrow-accent.svg);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  width: 24px;
  height: 24px;
  transition: all 0.3s ease-in-out;
}

.post-item-btn a:hover::before {
  filter: brightness(0) invert(1);
  transform: rotate(45deg);
}

/************************************/
/***   	   17. Footer css         ***/
/************************************/

.footer-work-together {
  position: relative;
  padding: 80px 0;
}

.footer-work-together::before {
  content: "";
  display: block;
  position: absolute;
  left: -120px;
  top: 20%;
  background: url(../images/work-together-bg-shape.png) no-repeat;
  background-position: left center;
  background-size: contain;
  opacity: 40%;
  width: 305px;
  height: 315px;
  animation: circlmoveerotate 12s infinite linear;
  animation-direction: alternate;
  z-index: -1;
}

@keyframes circlmoveerotate {
  from {
    transform: translateY(0) rotate(0deg);
  }
  to {
    transform: translateY(160px) rotate(360deg);
  }
}

.work-together-box {
  position: relative;
}

.work-together-content {
  position: relative;
  background: url("../images/work-together-bg.png") no-repeat;
  background-position: center center;
  background-size: auto;
  text-align: center;
}

.work-together-content::before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: url(../images/work-together-bg-gradient.png) no-repeat;
  background-position: center center;
  background-size: contain;
  width: 100%;
  height: 100%;
  z-index: -1;
}

.footer-work-together {
  margin-bottom: 0;
}

.footer-work-together h3 {
  font-size: 22px;
  text-transform: uppercase;
  margin-bottom: 20px;
}

.footer-work-together h2 {
  font-size: 180px;
  font-weight: 800;
  text-transform: uppercase;
}

.work-together-btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.footer-work-together .work-together-btn a {
  background-color: var(--accent-color);
  border-radius: 50%;
  width: 150px;
  height: 150px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  align-content: center;
  text-align: center;
  transition: all 0.3s ease-in-out;
}

.footer-work-together .work-together-btn a:hover {
  background-color: var(--secondary-color);
}

.footer-work-together .work-together-btn a img {
  width: 100%;
  max-width: 24px;
  height: 24px;
  color: var(--secondary-color);
  transition: all 0.3s ease-in-out;
}

.footer-work-together .work-together-btn a:hover img {
  filter: brightness(0) invert(1);
  transform: rotate(45deg);
}

.footer-work-together .work-together-btn a span {
  width: 100%;
  font-weight: 700;
  text-transform: capitalize;
  color: var(--dark-color);
  transition: all 0.3s ease-in-out;
}

.footer-work-together .work-together-btn a:hover span {
  color: var(--primary-color);
}

.footer-main {
  border-top: 1px solid var(--divider-color);
  padding: 60px 0 0;
}

.footer-logo {
  margin-bottom: 30px;
}

.footer-contact-item {
  display: flex;
  align-items: center;
  margin-bottom: 30px;
}

.footer-contact-item:last-child {
  margin-bottom: 0;
}

.footer-contact-item .icon-box {
  border: 1px solid var(--accent-color);
  border-radius: 50%;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 20px;
  transition: all 0.3s ease-in-out;
}

.footer-contact-item:hover .icon-box {
  border-color: var(--primary-color);
}

.footer-contact-item .icon-box img {
  max-width: 18px;
  transition: all 0.3s ease-in-out;
}

.footer-contact-item:hover .icon-box img {
  filter: brightness(0) invert(1);
}

.footer-contact-content {
  width: calc(100% - 60px);
}

.footer-contact-content p {
  font-size: 16px;
  font-weight: 500;
  margin: 0;
}

.footer-links h3 {
  font-size: 18px;
  text-transform: capitalize;
  color: var(--primary-color);
  margin-bottom: 20px;
}

.footer-links ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.footer-links ul li {
  text-transform: capitalize;
  margin-bottom: 15px;
}

.footer-links ul li:last-child {
  margin-bottom: 0;
}

.footer-links ul li a {
  color: #ccc;
  transition: all 0.3s ease-in-out;
  font-size: 16px;
}

.footer-links ul li:hover a {
  color: var(--accent-color);
}

.footer-newsletter-form .form-group {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: start;
}

.footer-newsletter-form h3 {
  font-size: 22px;
  text-transform: capitalize;
  margin-bottom: 20px;
}

.footer-newsletter-form .form-group .form-control {
  width: 64%;
  padding: 12px 20px;
  border: 1px solid var(--divider-color);
  background: transparent;
  color: var(--text-color);
  border-radius: 10px;
  box-shadow: none;
}

.footer-newsletter-form .form-group .form-control::placeholder {
  color: var(--text-color);
}

.footer-newsletter-form .btn-highlighted {
  margin-left: 10px;
}

.footer-social-links {
  margin-top: 20px;
}

.footer-social-links ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer-social-links ul li {
  display: inline-block;
  border-radius: 50%;
  margin-right: 15px;
}

.footer-social-links ul li:last-child {
  margin-right: 0;
}

.footer-social-links ul li a {
  border: 1px solid var(--accent-color);
  border-radius: 50%;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease-in-out;
}

.footer-social-links ul li:hover a {
  border-color: var(--primary-color);
}

.footer-social-links ul li a i {
  color: var(--accent-color);
  font-size: 18px;
  transition: all 0.3s ease-in-out;
}

.footer-social-links ul li:hover a i {
  color: var(--primary-color);
}

@media screen and (max-width: 600px) {
  .footer-social-links ul li {
    margin-right: 8px;
  }
}

.footer-copyright {
  border-top: 1px solid var(--dark-divider-color);
  padding: 20px 0;
  margin-top: 10px;
}

.footer-copyright-text {
  text-align: center;
}

.footer-copyright-text p {
  margin: 0;
}

/************************************/
/***     18. About Us Page css    ***/
/************************************/

.page-header {
  position: relative;
  background: url("../images/page-header-bg.jpg") no-repeat center center;
  background-size: cover;
  padding: 245px 0 150px;
}

.page-header-box {
  text-align: center;
}

.page-header-box h1 {
  display: inline-block;
  font-size: 80px;
  font-weight: 300;
  line-height: 1.1em;
  color: var(--primary-color);
  margin-bottom: 10px;
  cursor: none;
}

.page-header-box h1 span {
  color: var(--accent-color);
  font-weight: 800;
}

.page-header-box ol {
  margin: 0;
  padding: 0;
  justify-content: center;
}

.page-header-box ol li.breadcrumb-item {
  font-size: 18px;
  font-weight: 600;
  text-transform: capitalize;
  color: var(--primary-color);
}

.page-header-box ol li.breadcrumb-item a {
  color: inherit;
}

.page-header-box ol li.breadcrumb-item.active {
  color: var(--accent-color);
}

.page-header-box ol .breadcrumb-item + .breadcrumb-item::before {
  content: "\2a";
  font-family: "FontAwesome";
  font-size: 10px;
  color: var(--primary-color);
}

.our-scrolling-ticker.subpages-scrolling-ticker {
  padding: 15px 0;
}

.our-scrolling-ticker.subpages-scrolling-ticker .scrolling-ticker-box {
  --gap: 20px;
}

.our-scrolling-ticker.subpages-scrolling-ticker .scrolling-content span {
  font-size: 22px;
}

.our-scrolling-ticker.subpages-scrolling-ticker .scrolling-content span img {
  max-width: 18px;
  margin-right: 20px;
}

.our-approach {
  padding: 80px 0 50px;
}

.mission-vision-item {
  position: relative;
  border: 1px solid var(--divider-color);
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  border-radius: 30px;
  height: calc(100% - 30px);
  margin-bottom: 30px;
  padding: 40px;
  overflow: hidden;
}

.mission-vision-item::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: var(--secondary-color);
  opacity: 40%;
  z-index: -1;
}

.mission-vision-image {
  position: relative;
  border-radius: 20px;
  margin-bottom: 30px;
  overflow: hidden;
}

.mission-vision-img img {
  aspect-ratio: 1 / 0.78;
  object-fit: cover;
  border-radius: 20px;
  filter: brightness(80%);
  transition: all 0.4s ease-in-out;
}

.mission-vision-item:hover .mission-vision-img img {
  transform: scale(1.1);
}

.mission-vision-image .icon-box {
  position: absolute;
  bottom: 20px;
  left: 20px;
}

.mission-vision-image .icon-box img {
  max-width: 40px;
}

.mission-vision-content h3 {
  font-size: 22px;
  text-transform: capitalize;
  margin-bottom: 20px;
}

.mission-vision-content p {
  margin: 0;
}

.who-we-are {
  position: relative;
  padding: 80px 0;
}

.who-we-are::before {
  content: "";
  display: block;
  position: absolute;
  right: -90px;
  top: -25%;
  background: url(../images/agency-benefits-bg-shape.png) no-repeat;
  background-position: left center;
  background-size: contain;
  opacity: 50%;
  width: 279px;
  height: 287px;
  animation: circlerotate 8s infinite linear;
  z-index: -1;
}

.who-we-are .who-we-are-content {
  padding-right: 90px;
}

.experts-rating-video {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.experts-rating-video-image {
  width: 50%;
  position: relative;
  border-radius: 20px;
  cursor: none;
  overflow: hidden;
  z-index: 1;
}

.experts-rating-video-image .video-image img {
  width: 100%;
  filter: brightness(80%);
  aspect-ratio: 1 / 0.71;
  object-fit: cover;
  border-radius: 20px;
  transition: all 0.5s ease-in-out;
}

.experts-rating-video-image:hover .video-image img {
  transform: scale(1.1);
}

.experts-rating-video-image .video-image a {
  cursor: none;
  position: relative;
  z-index: 1;
}

.experts-rating-video-image .video-play-button {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 2;
  transform: translate(-50%, -50%);
}

.experts-rating-video-image .video-play-button a {
  position: relative;
  background-color: var(--accent-color);
  border-radius: 100%;
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: none;
}

.experts-rating-video-image .video-play-button a:before {
  content: "";
  position: absolute;
  top: -50%;
  left: -50%;
  width: 160%;
  height: 160%;
  border: 50px solid var(--primary-color);
  opacity: 30%;
  border-radius: 50%;
  transform: scale(0.6);
  z-index: -1;
  animation: border-zooming 1.2s infinite linear;
}

.experts-rating-video-image .video-play-button a:after {
  content: "";
  position: absolute;
  top: -50%;
  left: -50%;
  width: 160%;
  height: 160%;
  border: 50px solid var(--primary-color);
  opacity: 30%;
  border-radius: 50%;
  transform: scale(0.6);
  z-index: -1;
  animation: border-zooming 1.2s infinite linear;
  animation-delay: 0.3s;
}

@keyframes border-zooming {
  100% {
    transform: scale(1);
    opacity: 0;
  }
}

.experts-rating-video-image .video-play-button a i {
  font-size: 16px;
  color: var(--dark-color);
}

.who-we-are-client {
  width: 50%;
  padding-left: 50px;
}

.comapny-client-rating {
  margin-bottom: 20px;
}

.comapny-client-rating ul {
  list-style: none;
  margin: 0;
  padding: 0;
  margin-bottom: 5px;
}

.comapny-client-rating ul li i {
  font-size: 14px;
  color: var(--accent-color);
  margin-right: 2px;
}

.comapny-client-rating p {
  margin: 0;
}

.company-client-images {
  margin-bottom: 20px;
}

.company-client-images .client-image {
  display: inline-block;
  margin-left: -18px;
  border: 1px solid var(--secondary-color);
  border-radius: 50%;
  overflow: hidden;
}

.company-client-images .client-image:first-child {
  margin: 0;
}

.company-client-images .client-image figure {
  display: block;
}

.company-client-images .client-image img {
  max-width: 40px;
}

.contact-now-btn a {
  position: relative;
  color: var(--accent-color);
  font-size: 16px;
  font-weight: 700;
  padding-right: 30px;
  text-transform: capitalize;
}

.contact-now-btn a:hover {
  color: var(--primary-color);
}

.contact-now-btn a:after {
  content: "";
  position: absolute;
  top: -2px;
  right: 0;
  background-image: url(../images/arrow-accent.svg);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  width: 24px;
  height: 24px;
  transition: all 0.3s ease-in-out;
}

.contact-now-btn a:hover:after {
  filter: brightness(0) invert(1);
  transform: rotate(45deg);
}

.experts-counters-list {
  display: flex;
  flex-wrap: wrap;
  align-items: start;
  gap: 80px;
}

.experts-counter-box {
  width: calc(50% - 40px);
  display: flex;
  flex-wrap: wrap;
  gap: 80px;
}

.experts-counter-box:nth-child(even) {
  margin-top: 60px;
}

.experts-counter-item {
  position: relative;
  width: 100%;
  background: url("../images/who-we-are-counter-bg.png");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  border: 1px solid var(--divider-color);
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  border-radius: 30px;
  padding: 30px;
  overflow: hidden;
}

.experts-counter-item:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: var(--secondary-color);
  opacity: 40%;
  z-index: -1;
}

.experts-counter-box.expert-box-1 .experts-counter-item:nth-child(even) {
  background: transparent;
}

.experts-counter-box.expert-box-2 .experts-counter-item:nth-child(odd) {
  background: transparent;
}

.experts-counter-item .icon-box {
  text-align: right;
  margin-bottom: 20px;
}

.experts-counter-item .icon-box img {
  max-width: 30px;
  transition: all 0.3s ease-in-out;
}

.experts-counter-item:hover .icon-box img {
  filter: brightness(0) invert(1);
}

.experts-counter-content h2 {
  font-size: 50px;
  font-weight: 800;
  color: var(--accent-color);
  margin-bottom: 10px;
}

.experts-counter-content p {
  margin: 0;
}

.executive-partners {
  padding: 80px 0;
}

.executive-partners-box {
  position: relative;
  border: 1px solid var(--divider-color);
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  border-radius: 30px;
  padding: 70px;
  overflow: hidden;
}

.executive-partners-box::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: var(--secondary-color);
  opacity: 40%;
  z-index: -1;
}

.executive-partners-box .section-title {
  margin-bottom: 0;
}

.our-partners-list {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}

.our-partners-list .company-logo {
  width: calc(33.33% - 20px);
  background: var(--dark-color);
  border-radius: 10px;
  text-align: center;
  padding: 25px 35px;
}

.our-partners-list .company-logo img {
  width: 100%;
  height: 30px;
}

.our-team {
  position: relative;
  padding: 80px 0 50px;
}

.our-team::before {
  content: "";
  display: block;
  position: absolute;
  left: -90px;
  top: -25%;
  background: url(../images/why-choose-bg-shape.png) no-repeat;
  background-position: left center;
  background-size: contain;
  opacity: 50%;
  width: 310px;
  height: 325px;
  animation: circlezoomrotate 10s infinite linear;
  animation-direction: alternate;
  z-index: -1;
}

.team-item {
  position: relative;
  border-radius: 30px;
  height: calc(100% - 30px);
  margin-bottom: 30px;
  overflow: hidden;
}

.team-image a {
  position: relative;
  display: block;
}

.team-image a::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(
    181.78deg,
    rgba(0, 0, 0, 0) 47.87%,
    rgba(0, 0, 0, 0.8) 81.02%
  );
  z-index: 1;
}

.team-image figure,
.team-image img {
  width: 100%;
  aspect-ratio: 1 / 1.38;
  object-fit: cover;
  display: block;
  transition: all 0.4s ease-in-out;
}

.team-item:hover .team-image img {
  transform: scale(1.1);
}

.team-body {
  position: absolute;
  bottom: 30px;
  left: 30px;
  right: 30px;
  transform: translateY(40px);
  text-align: center;
  transition: all 0.4s ease-in-out;
  z-index: 2;
}

.team-item:hover .team-body {
  transform: translateY(0);
}

.team-content h3 {
  font-size: 22px;
  margin-bottom: 5px;
  text-transform: capitalize;
}

.team-content h3 a {
  color: inherit;
}

.team-content p {
  text-transform: capitalize;
  margin-bottom: 0;
}

.team-social-list {
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease-in-out;
}

.team-item:hover .team-social-list {
  margin-top: 15px;
  opacity: 1;
  visibility: visible;
}

.team-social-list ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.team-social-list ul li {
  display: inline-block;
  margin-right: 10px;
}

.team-social-list ul li:last-child {
  margin: 0;
}

.team-social-list ul li a {
  border: 1px solid var(--accent-color);
  border-radius: 50%;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease-in-out;
}

.team-social-list ul li:hover a {
  background-color: var(--accent-color);
}

.team-social-list ul li a i {
  color: var(--accent-color);
  font-size: 18px;
  transition: all 0.3s ease-in-out;
}

.team-social-list ul li:hover a i {
  color: var(--dark-color);
}

.our-faqs {
  padding: 80px 0;
}

.faq-images {
  position: relative;
  margin-right: 30px;
  padding: 140px 80px 0 0;
}

.faq-img-1 {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
}

.faq-img-1 figure {
  display: block;
  border-radius: 30px;
}

.faq-img-1 img {
  width: 100%;
  aspect-ratio: 1 / 1.02;
  object-fit: cover;
  border-radius: 30px;
}

.faq-img-2 figure {
  display: block;
  border-radius: 30px;
}

.faq-img-2 img {
  width: 100%;
  aspect-ratio: 1 / 1.06;
  object-fit: cover;
  border-radius: 30px;
}

.faq-cta-box {
  position: absolute;
  bottom: 0;
  right: 10%;
  transform: translate(0, -100%);
  animation: FaqCtaBoxMove 4s infinite linear;
}

@keyframes FaqCtaBoxMove {
  50% {
    right: 0;
  }
}

.faq-cta-box a {
  position: relative;
  display: block;
  color: var(--text-color);
  font-weight: 700;
  padding: 10px 18px;
  border: 1px solid var(--divider-color);
  border-radius: 10px;
  backdrop-filter: blur(60px);
  -webkit-backdrop-filter: blur(60px);
  overflow: hidden;
}

.faq-cta-box a::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: var(--primary-color);
  opacity: 16%;
  z-index: -1;
}

.faq-cta-box img {
  max-width: 30px;
  margin-right: 10px;
}

.our-faq-section .accordion-item {
  border: 1px solid var(--divider-color);
  border-radius: 10px;
  margin-bottom: 30px;
  padding: 0;
  transition: all 0.3s ease-in-out;
  overflow: hidden;
}

.our-faq-section .accordion-item:last-child {
  margin-bottom: 0;
}

.our-faq-section .accordion-header .accordion-button {
  font-size: 22px;
  font-weight: 700;
  line-height: 1.2em;
  background: transparent;
  color: var(--primary-color);
  padding: 17px 55px 17px 20px;
  transition: all 0.3s ease-in-out;
}

.our-faq-section .accordion-button:not(.collapsed) {
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0.1) 50%,
    rgba(0, 0, 0, 0) 100%
  );
}

.our-faq-section .accordion-header .accordion-button.collapsed {
  color: var(--primary-color);
}

.our-faq-section .accordion-item .accordion-button::after,
.our-faq-section .accordion-item .accordion-button.collapsed::after {
  content: "\f068";
  font-family: "FontAwesome";
  position: absolute;
  right: 20px;
  top: 50%;
  bottom: auto;
  transform: translate(0px, -12px);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 400;
  line-height: normal;
  width: 24px;
  height: 24px;
  color: var(--dark-color);
  background-color: var(--primary-color);
  border-radius: 50%;
}

.our-faq-section .accordion-item .accordion-button.collapsed::after {
  content: "\2b";
  background-color: var(--accent-color);
}

.our-faq-section .accordion-item .accordion-body {
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0.1) 50%,
    rgba(0, 0, 0, 0) 100%
  );
  padding: 0 55px 18px 20px;
}

.our-faq-section .accordion-item .accordion-body p {
  color: var(--primary-color);
  margin: 0;
}

/************************************/
/***     19. Services Page css    ***/
/************************************/

.page-services {
  padding: 160px 0 50px;
}

.who-we-are.service-we-are::before {
  display: none;
}

/************************************/
/***    20. Services Single css   ***/
/************************************/

.page-service-single {
  position: relative;
  padding: 160px 0 80px;
}

.page-service-single::before {
  content: "";
  display: block;
  position: absolute;
  right: -120px;
  top: 15%;
  background: url(../images/about-agency-bg.png) no-repeat;
  background-position: right center;
  background-size: contain;
  opacity: 40%;
  width: 386px;
  height: 400px;
  animation: circlerotate 20s infinite linear;
  z-index: -1;
}

.page-service-single::after {
  content: "";
  display: block;
  position: absolute;
  left: -90px;
  top: 50%;
  background: url(../images/why-choose-bg-shape.png) no-repeat;
  background-position: left center;
  background-size: contain;
  opacity: 50%;
  width: 310px;
  height: 325px;
  animation: circlezoomrotate 10s infinite linear;
  animation-direction: alternate;
  z-index: -1;
}

.service-single-content {
  margin-right: 30px;
}

.service-feature-image {
  margin-bottom: 40px;
}

.service-feature-image figure {
  display: block;
  border-radius: 30px;
}

.service-feature-image img {
  width: 100%;
  aspect-ratio: 1 / 0.67;
  object-fit: cover;
  border-radius: 30px;
}

.service-entry {
  margin-bottom: 40px;
}

.service-entry p {
  margin-bottom: 20px;
}

.service-entry p:last-child {
  margin-bottom: 0;
}

.service-entry h2 {
  font-size: 50px;
  font-weight: 300;
  margin-bottom: 20px;
}

.service-entry h2 span {
  color: var(--accent-color);
  font-weight: 700;
}

.service-entry-list-image {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 40px;
  margin-bottom: 40px;
}

.service-entry-list {
  width: calc(55% - 20px);
}

.service-entry-list ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.service-entry-list ul li {
  position: relative;
  text-transform: capitalize;
  padding-left: 30px;
  margin-bottom: 24px;
}

.service-entry-list ul li:last-child {
  margin-bottom: 0;
}

.service-entry-list ul li::before {
  content: "\f192";
  font-family: "FontAwesome";
  position: absolute;
  top: 0;
  left: 0;
  font-size: 18px;
  color: var(--accent-color);
}

.service-entry-image {
  width: calc(45% - 20px);
}

.service-entry-image figure {
  display: block;
  border-radius: 30px;
  overflow: hidden;
}

.service-entry-image img {
  width: 100%;
  object-fit: cover;
  aspect-ratio: 1 / 0.89;
  border-radius: 30px;
}

.service-process-steps {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
  margin: 30px 0 40px;
}

.process-step-item {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}

.process-step-item:nth-of-type(even) {
  flex-direction: row-reverse;
}

.process-step-content {
  position: relative;
  background: url(../images/service-bg.svg) no-repeat;
  background-size: auto;
  background-position: top left;
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  width: calc(50% - 15px);
  padding: 40px;
  border: 1px solid var(--divider-color);
  border-radius: 30px;
}

.process-step-content::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: var(--secondary-color);
  opacity: 40%;
  border-radius: 30px;
}

.process-step-header {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 70px;
}

.process-step-header .icon-box img {
  max-width: 60px;
}

.process-step-no h3 {
  font-size: 22px;
  font-weight: 700;
  text-transform: uppercase;
  text-align: center;
}

.process-step-no h3 span {
  color: var(--accent-color);
  display: block;
}

.process-step-body {
  position: relative;
}

.process-step-body h3 {
  font-size: 22px;
  font-weight: 700;
  text-transform: capitalize;
  margin-bottom: 20px;
}

.process-step-body p {
  margin-bottom: 0;
}

.process-step-image {
  width: calc(50% - 15px);
}

.process-step-image figure {
  display: block;
  height: 100%;
  border-radius: 30px;
  overflow: hidden;
}

.process-step-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  aspect-ratio: 1 / 0.9;
  border-radius: 30px;
}

.service-sidebar {
  position: sticky;
  top: 20px;
}

.service-catagery-list {
  position: relative;
  border-radius: 30px;
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  margin-bottom: 60px;
  overflow: hidden;
}

.service-catagery-list::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: var(--secondary-color);
  opacity: 40%;
  z-index: -1;
}

.service-catagery-list h3 {
  font-size: 22px;
  text-transform: capitalize;
  padding: 40px 40px 30px;
  border-bottom: 1px solid var(--divider-color);
}

.service-catagery-list ul {
  list-style: none;
  margin: 0;
  padding: 30px 40px 40px;
}

.service-catagery-list ul li {
  border-bottom: 1px solid var(--divider-color);
  padding-bottom: 30px;
  margin-bottom: 30px;
  transition: all 0.3s ease-in-out;
}

.service-catagery-list ul li:last-child {
  margin: 0;
  padding: 0;
  border-bottom: none;
}

.service-catagery-list ul li a {
  position: relative;
  display: block;
  text-transform: capitalize;
  color: var(--text-color);
  transition: all 0.3s ease-in-out;
}

.service-catagery-list ul li:hover a {
  color: var(--accent-color);
}

.service-catagery-list ul li a::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  background: url(../images/arrow-accent.svg) no-repeat;
  background-position: right center;
  background-size: cover;
  width: 26px;
  height: 26px;
  transition: all 0.3s ease-in-out;
}

.service-catagery-list ul li:hover a::before {
  transform: rotate(45deg);
}

.sidebar-cta-box {
  position: relative;
  background: url(../images/sidebar-cta-bg.svg) no-repeat;
  background-position: center center;
  background-size: cover;
  padding: 50px;
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  border: 1px solid var(--divider-color);
  border-radius: 30px;
  text-align: center;
  overflow: hidden;
}

.sidebar-cta-box::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: var(--secondary-color);
  opacity: 40%;
  z-index: -1;
}

.sidebar-cta-box .icon-box {
  position: relative;
  margin-bottom: 40px;
}

.sidebar-cta-box .icon-box img {
  max-width: 60px;
}

.cta-contact-content {
  position: relative;
  margin-bottom: 20px;
}

.cta-contact-content h3 {
  font-size: 22px;
  font-weight: 700;
  color: var(--accent-color);
  margin-bottom: 20px;
}

.cta-contact-content p {
  margin-bottom: 0;
}

.cta-contact-btn {
  position: relative;
}

.cta-contact-btn a {
  display: inline-block;
  font-weight: 700;
  color: var(--dark-color);
  backdrop-filter: blur(60px);
  -webkit-backdrop-filter: blur(60px);
  background-color: var(--accent-color);
  border-radius: 10px;
  padding: 12px 35px;
  transition: all 0.4s ease-in-out;
}

.cta-contact-btn a:hover {
  background-color: var(--dark-divider-color);
  color: var(--primary-color);
}

.cta-contact-btn a img {
  margin-right: 12px;
  max-width: 30px;
  transition: all 0.4s ease-in-out;
}

.cta-contact-btn a:hover img {
  filter: brightness(1) invert(1);
}

/************************************/
/*** 	 21. Blog Archive Css	  ***/
/************************************/

.page-blog {
  position: relative;
  padding: 160px 0 80px;
}

.page-blog::before {
  content: "";
  display: block;
  position: absolute;
  right: -120px;
  top: 40%;
  background: url(../images/about-agency-bg.png) no-repeat;
  background-position: right center;
  background-size: contain;
  opacity: 40%;
  width: 386px;
  height: 400px;
  animation: circlerotate 20s infinite linear;
  z-index: -1;
}

.post-item {
  height: calc(100% - 40px);
  margin-bottom: 40px;
}

.page-pagination {
  margin-top: 20px;
  text-align: center;
}

.page-pagination ul {
  justify-content: center;
  padding: 0;
  margin: 0;
}

.page-pagination ul li a,
.page-pagination ul li span {
  display: flex;
  text-decoration: none;
  justify-content: center;
  align-items: center;
  background: var(--secondary-color);
  color: var(--primary-color);
  border-radius: 10px;
  width: 40px;
  height: 40px;
  margin: 0 5px;
  font-weight: 700;
  line-height: 1em;
  transition: all 0.3s ease-in-out;
}

.page-pagination ul li.active a,
.page-pagination ul li a:hover {
  background: var(--accent-color);
  color: var(--dark-color);
}

/************************************/
/***      22. Blog Single css	  ***/
/************************************/

.page-single-post {
  padding: 160px 0 80px;
}

.post-image {
  position: relative;
  margin-bottom: 30px;
}

.post-image figure {
  display: block;
}

.post-image figure,
.post-image img {
  aspect-ratio: 1 / 0.5;
  object-fit: cover;
  border-radius: 30px;
}

.post-content {
  width: 100%;
  max-width: 1100px;
  margin: 0 auto;
}

.post-entry {
  border-bottom: 1px solid var(--divider-color);
  padding-bottom: 30px;
  margin-bottom: 30px;
}

.post-entry:after {
  content: "";
  display: block;
  clear: both;
}

.post-entry a {
  color: var(--accent-color);
}

.post-entry h1,
.post-entry h2,
.post-entry h3,
.post-entry h4,
.post-entry h5,
.post-entry h6 {
  font-weight: 300;
  line-height: 1.2em;
  margin: 0 0 0.6em;
}

.post-entry h1 span,
.post-entry h2 span {
  font-weight: 800;
}

.post-entry h1 {
  font-size: 80px;
}

.post-entry h2 {
  font-size: 50px;
}

.post-entry h3 {
  font-size: 40px;
}

.post-entry h4 {
  font-size: 30px;
}

.post-entry h5 {
  font-size: 24px;
}

.post-entry h6 {
  font-size: 18px;
}

.post-entry p {
  margin-bottom: 20px;
}

.post-entry p:last-child {
  margin-bottom: 0;
}

.post-entry p strong {
  color: var(--primary-color);
  font-size: 18px;
  font-weight: 600;
}

.post-entry ol {
  margin: 0 0 30px;
}

.post-entry ol li {
  margin-bottom: 20px;
  font-size: 18px;
  font-weight: 600;
  color: var(--text-color);
}

.post-entry ul {
  padding: 0;
  margin: 20px 0 20px;
  padding-left: 20px;
}

.post-entry ul li {
  font-size: 18px;
  font-weight: 500;
  color: var(--primary-color);
  position: relative;
  margin-bottom: 15px;
}

.post-entry ul li:last-child {
  margin-bottom: 0;
}

.post-entry ul ul,
.post-entry ul ol,
.post-entry ol ol,
.post-entry ol ul {
  margin-top: 20px;
  margin-bottom: 0;
}

.post-entry ul ul li:last-child,
.post-entry ul ol li:last-child,
.post-entry ol ol li:last-child,
.post-entry ol ul li:last-child {
  margin-bottom: 0;
}

.post-entry blockquote {
  position: relative;
  background: url(../images/icon-blockquote.svg) no-repeat;
  border: 1px solid var(--divider-color);
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  background-position: 35px 30px;
  background-size: 58px;
  border-radius: 20px;
  padding: 30px 30px 30px 100px;
  margin-bottom: 30px;
  overflow: hidden;
}

.post-entry blockquote::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: var(--secondary-color);
  opacity: 40%;
  z-index: -1;
}

.post-entry blockquote p {
  font-size: 20px;
  font-weight: 600;
  line-height: 1.4em;
  color: var(--primary-color);
}

.post-entry blockquote p:last-child {
  margin-bottom: 0;
}

.tag-links {
  font-size: 24px;
  font-weight: 600;
  color: var(--primary-color);
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

.post-tags .tag-links a {
  display: inline-block;
  font-size: 16px;
  font-weight: 600;
  text-transform: capitalize;
  background: var(--accent-color);
  background-size: 200% auto;
  color: var(--dark-color);
  border-radius: 100px;
  padding: 8px 20px;
  transition: all 0.3s ease-in-out;
}

.post-tags .tag-links a:hover {
  background: var(--primary-color);
}

.post-social-sharing {
  text-align: right;
}

.post-social-sharing ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.post-social-sharing ul li {
  display: inline-block;
  margin-right: 10px;
}

.post-social-sharing ul li:last-child {
  margin-right: 0;
}

.post-social-sharing ul li a {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  background: var(--accent-color);
  background-size: 200% auto;
  color: var(--dark-color);
  border-radius: 50%;
  width: 36px;
  height: 36px;
  transition: all 0.3s ease-in-out;
}

.post-social-sharing ul li:hover a {
  background: var(--primary-color);
}

.post-social-sharing ul li a i {
  font-size: 18px;
  color: inherit;
}

/************************************/
/***      23. Project Page css	  ***/
/************************************/

.page-project {
  position: relative;
  padding: 160px 0 40px;
}

.page-project::before {
  content: "";
  display: block;
  position: absolute;
  right: -120px;
  top: 40%;
  background: url(../images/about-agency-bg.png) no-repeat;
  background-position: right center;
  background-size: contain;
  opacity: 40%;
  width: 386px;
  height: 400px;
  animation: circlerotate 20s infinite linear;
  z-index: -1;
}

/************************************/
/***     24. Project Single css	  ***/
/************************************/

.page-project-single {
  position: relative;
  padding: 160px 0 80px;
}

.page-project-single::before {
  content: "";
  display: block;
  position: absolute;
  left: -90px;
  top: 10%;
  background: url(../images/agency-benefits-bg-shape.png) no-repeat;
  background-position: left center;
  background-size: contain;
  opacity: 50%;
  width: 279px;
  height: 287px;
  animation: circlerotate 8s infinite linear;
  z-index: -1;
}

.page-project-single::after {
  content: "";
  display: block;
  position: absolute;
  right: -90px;
  top: 60%;
  background: url(../images/why-choose-bg-shape.png) no-repeat;
  background-position: left center;
  background-size: contain;
  opacity: 50%;
  width: 310px;
  height: 325px;
  animation: circlezoomrotate 10s infinite linear;
  animation-direction: alternate;
  z-index: -1;
}

.project-single-content {
  margin-right: 30px;
}

.project-single-image {
  margin-bottom: 40px;
}

.project-single-image figure {
  display: block;
  border-radius: 30px;
}

.project-single-image img {
  width: 100%;
  aspect-ratio: 1 / 0.67;
  object-fit: cover;
  border-radius: 30px;
}

.project-challenges,
.project-info,
.project-entry {
  margin-bottom: 60px;
}

.project-entry p {
  margin-bottom: 20px;
}

.project-entry p:last-child {
  margin-bottom: 0;
}

.project-entry h2 {
  font-size: 50px;
  font-weight: 300;
  color: var(--primary-color);
  margin-bottom: 30px;
}

.project-entry h2 span {
  color: var(--accent-color);
  font-weight: 700;
}

.project-entry ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.project-entry ul li {
  position: relative;
  text-transform: capitalize;
  padding-left: 30px;
  margin-bottom: 24px;
}

.project-entry ul li:last-child {
  margin-bottom: 0;
}

.project-entry ul li::before {
  content: "\f192";
  font-family: "FontAwesome";
  position: absolute;
  top: 0;
  left: 0;
  font-size: 18px;
  color: var(--accent-color);
}

.project-solution-rating {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 60px;
  margin-top: 30px;
}

.project-rating-content {
  width: calc(70% - 30px);
}

.project-rating-counter {
  width: calc(30% - 30px);
  display: flex;
  align-items: center;
}

.project-rating-counter .icon-box {
  margin-right: 20px;
}

.project-rating-counter .icon-box i {
  font-size: 48px;
  color: var(--accent-color);
}

.project-counter-content {
  width: calc(100% - 68px);
}

.project-counter-content h3 {
  font-size: 40px;
}

.project-sidebar {
  position: sticky;
  top: 20px;
}

.project-catagery-list {
  position: relative;
  border: 1px solid var(--divider-color);
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  border-radius: 30px;
  margin-bottom: 60px;
  overflow: hidden;
}

.project-catagery-list::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: var(--secondary-color);
  opacity: 40%;
  z-index: -1;
}

.category-item-list {
  padding: 40px 40px 30px;
}

.category-list-item {
  border-bottom: 1px solid var(--divider-color);
  padding-bottom: 20px;
  margin-bottom: 20px;
}

.category-list-item:last-child {
  margin: 0;
  padding: 0;
  border-bottom: none;
}

.category-list-item h3 {
  font-size: 22px;
  text-transform: capitalize;
  margin-bottom: 10px;
}

.category-list-item p {
  text-transform: capitalize;
  margin-bottom: 0;
}

.category-social-link {
  border-top: 1px solid var(--divider-color);
  display: flex;
  align-items: center;
  padding: 30px 40px 40px;
}

.category-social-link span {
  font-size: 22px;
  font-weight: 700;
  margin-right: 15px;
}

.category-social-link ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.category-social-link ul li {
  display: inline-block;
  margin-right: 5px;
}

.category-social-link ul li:last-child {
  margin-right: 0;
}

.category-social-link ul li a {
  border: 1px solid var(--accent-color);
  border-radius: 50%;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease-in-out;
}

.category-social-link ul li a:hover {
  border-color: var(--primary-color);
}

.category-social-link ul li a i {
  color: var(--accent-color);
  font-size: 18px;
  transition: all 0.3s ease-in-out;
}

.category-social-link ul li a:hover i {
  color: var(--primary-color);
}

/************************************/
/***      25. Team Page css	      ***/
/************************************/

.page-team {
  position: relative;
  padding: 160px 0 50px;
}

.page-team::before {
  content: "";
  display: block;
  position: absolute;
  right: -120px;
  top: 50%;
  background: url(../images/work-together-bg-shape.png) no-repeat;
  background-position: right center;
  background-size: contain;
  opacity: 40%;
  width: 305px;
  height: 315px;
  animation: circlmoveerotate 10s infinite linear;
  animation-direction: alternate;
  z-index: -1;
}

/************************************/
/***      26. Team Single css	  ***/
/************************************/

.page-team-single {
  position: relative;
  padding: 160px 0 80px;
}

.page-team-single::before {
  content: "";
  display: block;
  position: absolute;
  right: -90px;
  top: 60%;
  background: url(../images/why-choose-bg-shape.png) no-repeat;
  background-position: left center;
  background-size: contain;
  opacity: 50%;
  width: 310px;
  height: 325px;
  animation: circlezoomrotate 10s infinite linear;
  animation-direction: alternate;
  z-index: -1;
}

.team-single-content {
  margin-right: 30px;
}

.team-single-content h2 {
  font-size: 50px;
  font-weight: 300;
  margin-bottom: 20px;
}

.team-single-content h2 span {
  color: var(--accent-color);
  font-weight: 700;
}

.team-single-content p {
  margin-bottom: 20px;
}

.team-single-content p:last-child {
  margin-bottom: 0;
}

.team-info-box {
  margin-bottom: 60px;
}

.team-info-header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 30px;
  margin-bottom: 40px;
}

.team-info-title {
  width: calc(75% - 15px);
}

.team-info-title p {
  color: var(--accent-color);
  text-transform: capitalize;
  margin-bottom: 5px;
}

.team-info-title h2 {
  font-weight: 700;
  text-transform: capitalize;
  margin: 0;
}

.team-info-social-list {
  width: calc(25% - 15px);
}

.team-info-social-list ul {
  margin: 0;
  padding: 0;
  list-style: none;
  text-align: end;
}

.team-info-social-list ul li {
  display: inline-block;
  margin-right: 10px;
}

.team-info-social-list ul li:last-child {
  margin: 0;
}

.team-info-social-list ul li a {
  border: 1px solid var(--accent-color);
  border-radius: 50%;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease-in-out;
}

.team-info-social-list ul li:hover a {
  background-color: var(--accent-color);
}

.team-info-social-list ul li a i {
  font-size: 18px;
  color: var(--accent-color);
  transition: all 0.3s ease-in-out;
}

.team-info-social-list ul li:hover a i {
  color: var(--dark-color);
}

.team-contact-box {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  border-bottom: 1px solid var(--divider-color);
  padding-bottom: 30px;
  margin-bottom: 30px;
}

.team-contact-box:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
}

.team-contact-box .icon-box {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 80px;
  height: 80px;
  margin-right: 30px;
  border: 1px solid var(--dark-divider-color);
  border-radius: 50%;
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  overflow: hidden;
}

.team-contact-box .icon-box::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: var(--secondary-color);
  opacity: 30%;
  z-index: -1;
}

.team-contact-box .icon-box img {
  max-width: 36px;
}

.team-contact-content {
  width: calc(100% - 110px);
}

.team-contact-content h3 {
  font-size: 22px;
  font-weight: 600;
  text-transform: capitalize;
  margin-bottom: 10px;
}

.team-contact-content p {
  margin: 0;
}

.team-personal-info {
  margin-bottom: 60px;
}

.team-career-list ul {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.team-career-list ul li {
  position: relative;
  width: calc(50% - 15px);
  text-transform: capitalize;
  padding-left: 30px;
}

.team-career-list ul li::before {
  content: "\f192";
  font-family: "FontAwesome";
  position: absolute;
  top: 0;
  left: 0;
  font-size: 18px;
  color: var(--accent-color);
}

.team-single-sidebar {
  position: sticky;
  top: 30px;
}

.team-single-image {
  margin-bottom: 60px;
}

.team-single-image figure {
  display: block;
  border-radius: 30px;
  overflow: hidden;
  visibility: visible;
}

.team-single-image img {
  width: 100%;
  aspect-ratio: 1 / 1.22;
  object-fit: cover;
  border-radius: 30px;
}

.team-single-contact-form {
  position: relative;
  border-radius: 30px;
  border: 1px solid var(--divider-color);
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  overflow: hidden;
}

.team-single-contact-form::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: var(--secondary-color);
  opacity: 40%;
  z-index: -1;
}

.team-single-contact-form h3 {
  position: relative;
  font-size: 34px;
  font-weight: 300;
  padding: 40px 40px 30px;
  border-bottom: 1px solid var(--divider-color);
}

.team-single-contact-form h3 span {
  font-weight: 700;
  color: var(--accent-color);
}

.team-single-contact-form form {
  position: relative;
  padding: 40px;
}

.team-single-contact-form form .form-control {
  font-size: 16px;
  font-weight: 400;
  color: var(--text-color);
  padding: 16px 20px;
  background-color: transparent;
  border: 1px solid var(--divider-color);
  border-radius: 10px;
  outline: none;
  box-shadow: none;
}

.team-single-contact-form form .form-control::placeholder {
  color: var(--text-color);
}

.contact-form-btn .btn-highlighted {
  width: 100%;
  text-align: center;
}

/************************************/
/***      27. Pricing Page css	  ***/
/************************************/

.page-pricing {
  padding: 160px 0 80px;
}

.pricing-box-list {
  display: flex;
  flex-wrap: wrap;
  gap: 40px 60px;
}

.pricing-box {
  position: relative;
  background: url(../images/service-bg.svg) no-repeat;
  background-position: top left;
  background-size: auto;
  width: calc(50% - 30px);
  border: 1px solid var(--divider-color);
  border-radius: 30px;
  padding: 50px;
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  overflow: hidden;
}

.pricing-box::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: var(--secondary-color);
  opacity: 40%;
  z-index: -1;
}

.pricing-box-content {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 30px;
  border-bottom: 1px solid var(--divider-color);
  margin-bottom: 40px;
  padding-bottom: 40px;
}

.pricing-title {
  width: calc(60% - 15px);
}

.pricing-title h3 {
  font-size: 30px;
  text-transform: capitalize;
  margin-bottom: 10px;
}

.pricing-title p {
  margin-bottom: 0;
}

.pricing-price {
  width: calc(40% - 15px);
  text-align: end;
}

.pricing-price h2 {
  font-size: 50px;
  color: var(--accent-color);
}

.pricing-price h2 sup {
  font-size: 22px;
  color: var(--primary-color);
}

.pricing-price h2 sub {
  bottom: 0;
  font-size: 16px;
  font-weight: 400;
  color: var(--primary-color);
}

.pricing-list {
  margin-bottom: 40px;
}

.pricing-list ul {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.pricing-list ul li {
  position: relative;
  width: calc(50% - 15px);
  text-transform: capitalize;
  padding-left: 30px;
}

.pricing-list ul li::before {
  content: "\f192";
  font-family: "FontAwesome";
  position: absolute;
  top: 0;
  left: 0;
  font-size: 18px;
  color: var(--accent-color);
}

.pricing-btn .btn-highlighted {
  width: 100%;
  text-align: center;
}

/************************************/
/***    28. Testimonial Page css  ***/
/************************************/

.page-testimonial {
  padding: 160px 0 80px;
}

.testimonial-box-list {
  display: flex;
  flex-wrap: wrap;
  gap: 60px;
}

.testimonial-box-item {
  position: relative;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 50px;
  width: 100%;
  border: 1px solid var(--divider-color);
  border-radius: 30px;
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  padding: 80px;
  overflow: hidden;
}

.testimonial-box-item::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: var(--secondary-color);
  opacity: 40%;
  z-index: -1;
}

.client-author-image {
  width: calc(27% - 25px);
}

.client-author-image figure {
  display: block;
  border-radius: 50%;
  overflow: hidden;
}

.client-author-image img {
  width: 100%;
  object-fit: cover;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
}

.client-testimonial-content {
  width: calc(73% - 25px);
}

.client-testimonial-rating {
  margin-bottom: 20px;
}

.client-testimonial-rating ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.client-testimonial-rating ul li {
  display: inline-block;
}

.client-testimonial-rating ul li i {
  font-size: 12px;
  color: var(--accent-color);
  margin-right: 2px;
}

.client-testimonial-rating ul li:last-child i {
  margin: 0;
}

.client-testimonial-info {
  margin-bottom: 20px;
}

.client-testimonial-info p {
  font-size: 20px;
}

.client-testimonial-info p:last-child {
  margin: 0;
}

.client-author-content {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
  align-items: center;
}

.client-author-title {
  width: calc(65% - 15px);
}

.client-author-title h3 {
  font-size: 22px;
  text-transform: capitalize;
  margin-bottom: 5px;
}

.client-author-title p {
  text-transform: capitalize;
  margin-bottom: 0;
}

.client-author-logo {
  width: calc(35% - 15px);
  text-align: end;
}

.client-author-logo img {
  max-width: 125px;
  max-height: 30px;
}

/************************************/
/***     27. Image Gallery css    ***/
/************************************/

.page-gallery {
  padding: 160px 0 50px;
}

.page-gallery-box .photo-gallery {
  height: calc(100% - 30px);
  margin-bottom: 30px;
}

.page-gallery-box .photo-gallery a {
  cursor: none;
}

.page-gallery-box .photo-gallery figure {
  border-radius: 20px;
}

.page-gallery-box .photo-gallery img {
  aspect-ratio: 1 / 0.8;
  object-fit: cover;
  border-radius: 20px;
}

/************************************/
/***     30. Video Gallery css    ***/
/************************************/

.page-video-gallery {
  padding: 160px 0 50px;
}

.video-gallery-image {
  border-radius: 20px;
  overflow: hidden;
  height: calc(100% - 30px);
  margin-bottom: 30px;
}

.video-gallery-image a {
  position: relative;
  display: block;
  cursor: none;
}

.video-gallery-image a::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: var(--secondary-color);
  border-radius: 20px;
  opacity: 0%;
  visibility: hidden;
  width: 100%;
  height: 100%;
  z-index: 1;
  transform: scale(0);
  transition: all 0.4s ease-in-out;
}

.video-gallery-image:hover a::before {
  opacity: 50%;
  visibility: visible;
  transform: scale(1);
}

.video-gallery-image a::after {
  content: "\f04b";
  font-family: "FontAwesome";
  position: absolute;
  top: 50%;
  left: 50%;
  right: 0;
  transform: translate(-50%, -50%);
  font-size: 20px;
  background: var(--accent-color);
  color: var(--dark-color);
  border-radius: 50%;
  height: 60px;
  width: 60px;
  cursor: none;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transition: all 0.5s ease-in-out;
  z-index: 1;
}

.video-gallery-image:hover a::after {
  opacity: 1;
  visibility: visible;
}

.video-gallery-image img {
  aspect-ratio: 1 / 0.8;
  object-fit: cover;
  border-radius: 20px;
}

/************************************/
/***       31. FAQs Page css      ***/
/************************************/

.page-faqs {
  padding: 160px 0 80px;
}

.page-faqs-catagery {
  margin-right: 30px;
}

.page-faq-accordion {
  margin-bottom: 80px;
}

.page-faq-accordion:last-child {
  margin-bottom: 0;
}

.faq-sidebar {
  position: sticky;
  top: 20px;
}

.faq-catagery-list {
  position: relative;
  border-radius: 30px;
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  margin-bottom: 60px;
  overflow: hidden;
}

.faq-catagery-list::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: var(--secondary-color);
  opacity: 40%;
  z-index: -1;
}

.faq-catagery-list ul {
  list-style: none;
  margin: 0;
  padding: 40px;
}

.faq-catagery-list ul li {
  border-bottom: 1px solid var(--divider-color);
  padding-bottom: 30px;
  margin-bottom: 30px;
  transition: all 0.3s ease-in-out;
}

.faq-catagery-list ul li:last-child {
  margin: 0;
  padding: 0;
  border-bottom: none;
}

.faq-catagery-list ul li a {
  position: relative;
  display: block;
  text-transform: capitalize;
  color: var(--text-color);
  transition: all 0.3s ease-in-out;
}

.faq-catagery-list ul li:hover a {
  color: var(--accent-color);
}

.faq-catagery-list ul li a::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  background: url(../images/arrow-accent.svg) no-repeat;
  background-position: right center;
  background-size: cover;
  width: 26px;
  height: 26px;
  transition: all 0.3s ease-in-out;
}

.faq-catagery-list ul li:hover a::before {
  transform: rotate(45deg);
}

/************************************/
/***    32. Contact Us Page css   ***/
/************************************/

.page-contact-us {
  padding: 160px 0 80px;
}

.contact-info-box {
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
}

.contact-info-box .info-box-1 {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}

.contact-info-box .info-box-1,
.contact-info-box .info-box-2 {
  position: relative;
  width: 100%;
  border: 1px solid var(--divider-color);
  border-radius: 30px;
  padding: 30px 40px;
  overflow: hidden;
}

.contact-info-box .info-box-1::before,
.contact-info-box .info-box-2::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: var(--secondary-color);
  opacity: 30%;
  z-index: -1;
}

.contact-info-item {
  text-align: center;
  width: 100%;
}

.contact-info-box .info-box-1 .contact-info-item {
  position: relative;
  width: calc(50% - 15px);
}

.contact-info-box .info-box-1 .contact-info-item::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  transform: translate(15px, -50%);
  height: 80%;
  width: 1px;
  background-color: var(--divider-color);
}

.contact-info-box .info-box-1 .contact-info-item:nth-child(2n + 2):before {
  display: none;
}

.contact-info-box .info-box-2 .contact-info-item {
  display: flex;
  text-align: left;
}

.contact-info-item .icon-box {
  margin-bottom: 30px;
}

.contact-info-box .info-box-2 .icon-box {
  margin: 0 30px 0 0;
}

.contact-info-item .icon-box img {
  max-width: 50px;
}

.contact-info-box .info-box-2 .contact-item-content {
  width: calc(100% - 80px);
}

.contact-item-content h3 {
  font-size: 22px;
  font-weight: 600;
  text-transform: capitalize;
  margin-bottom: 10px;
}

.contact-item-content p {
  margin: 0;
}

.contact-us-form {
  position: relative;
  padding: 50px;
  border: 1px solid var(--divider-color);
  border-radius: 30px;
  margin-left: 30px;
}

.contact-us-form::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: var(--secondary-color);
  opacity: 40%;
  border-radius: 30px;
  z-index: -1;
}

.contact-us-form form .form-control {
  font-size: 16px;
  font-weight: 400;
  color: var(--text-color);
  padding: 16px 20px;
  background-color: transparent;
  border: 1px solid var(--divider-color);
  border-radius: 10px;
  outline: none;
  box-shadow: none;
}

.contact-us-form form .form-control::placeholder {
  color: var(--text-color);
}

.google-map {
  padding: 80px 0;
}

.google-map-iframe,
.google-map-iframe iframe {
  width: 100%;
  height: 600px;
  border-radius: 30px;
}

.google-map-iframe iframe {
  filter: grayscale(1);
  transition: all 0.4s ease-in-out;
}

.google-map-iframe iframe:hover {
  filter: grayscale(0);
}

/************************************/
/*** 	   33. 404 Page css       ***/
/************************************/

.error-page {
  padding: 160px 0 80px;
}

.error-page-image {
  text-align: center;
  margin-bottom: 30px;
}

.error-page-image img {
  width: 100%;
  max-width: 50%;
}

.error-page .error-page-content {
  text-align: center;
}

.error-page-content-heading {
  margin-bottom: 30px;
}

.error-page-content-body p {
  margin-bottom: 30px;
}

/************************************/
/***      34. Responsive css      ***/
/************************************/

@media only screen and (max-width: 991px) {
  .navbar {
    padding: 20px 0;
  }

  .slicknav_nav li,
  .slicknav_nav ul {
    display: block;
  }

  .responsive-menu,
  .navbar-toggle {
    display: block;
  }

  .header-social-links {
    display: none;
  }

  .section-row {
    margin-bottom: 40px;
  }

  .section-row .section-title {
    max-width: 100%;
  }

  .section-title {
    margin-bottom: 30px;
  }

  .section-title h3 {
    margin-bottom: 15px;
  }

  .section-title h3::before {
    width: 14px;
    height: 14px;
  }

  .section-title h1 {
    font-size: 70px;
  }

  .section-title h2 {
    font-size: 40px;
  }

  .section-title p {
    margin-top: 15px;
  }

  .section-content-btn .section-title-content {
    margin-bottom: 20px;
  }

  .section-title-content {
    margin-top: 15px;
  }

  .hero {
    padding: 180px 0 90px;
    min-height: auto;
  }

  .hero.hero-slider-layout .hero-slide {
    padding: 180px 0 90px;
    min-height: auto;
  }

  .hero-content .section-title {
    margin-bottom: 40px;
  }

  .hero-content-body {
    margin-left: 0px;
  }

  .hero-content-video {
    width: 37%;
  }

  .hero-video-content {
    width: 63%;
  }

  .hero-btn {
    margin-top: 30px;
  }

  .our-scrolling-ticker {
    padding: 22px 0;
  }

  .scrolling-content span {
    font-size: 34px;
  }

  .about-agency {
    padding: 80px 0 40px;
  }

  .about-agency::before {
    width: 300px;
    height: 330px;
  }

  .about-agency-content {
    position: initial;
    padding-right: 0px;
    margin-bottom: 30px;
  }

  .about-agency-list {
    gap: 30px;
    padding-left: 30px;
    margin-left: 10px;
  }

  .agency-item-content h3:after {
    left: -40px;
  }

  .agency-item-content h3 {
    font-size: 20px;
  }

  .our-services {
    padding: 40px 0;
  }

  .service-item {
    padding: 30px;
  }

  .service-item-header {
    margin-bottom: 50px;
  }

  .service-item-header .icon-box img {
    max-width: 50px;
  }

  .service-item-body h3 {
    font-size: 20px;
    margin-bottom: 15px;
  }

  .service-footer {
    margin-top: 10px;
  }

  .digital-success {
    padding: 40px 0;
  }

  .digital-success-box {
    gap: 40px;
    padding: 50px;
  }

  .digital-success-list,
  .digital-success-content {
    width: 100%;
  }

  .digital-success-content::before {
    display: none;
  }

  .digital-success-content .section-title {
    margin-bottom: 40px;
  }

  .success-counter-item h2 {
    font-size: 40px;
  }

  .success-list-item {
    margin-bottom: 40px;
  }

  .success-list-item p span {
    font-size: 20px;
  }

  .why-choose-us {
    padding: 40px 0;
  }

  .why-choose-us::before {
    top: 20%;
    width: 250px;
    height: 280px;
  }

  .why-choose-content {
    margin-right: 0;
    margin-bottom: 30px;
  }

  .why-choose-item {
    padding: 15px 20px;
  }

  .why-choose-item h3 {
    font-size: 20px;
  }

  .why-choose-image img {
    aspect-ratio: 1 / 0.73;
  }

  .join-agency {
    padding: 40px 0 10px;
  }

  .agency-social-item {
    padding: 20px 30px 20px 50px;
    margin: 20px 0 30px 20px;
  }

  .agency-social-item .icon-box {
    top: -20px;
    left: -20px;
  }

  .agency-social-item .icon-box a {
    width: 60px;
    height: 60px;
  }

  .agency-social-item .icon-box i {
    font-size: 30px;
  }

  .agency-social-content h3 {
    font-size: 20px;
  }

  .how-it-work {
    padding: 40px 0 10px;
  }

  .how-it-work::before {
    top: 0;
    width: 240px;
    height: 280px;
  }

  .work-process-item {
    padding: 30px;
  }

  .work-process-header {
    margin-bottom: 30px;
  }

  .work-process-title h3 {
    font-size: 20px;
  }

  .work-process-content {
    margin-bottom: 40px;
  }

  .work-process-body {
    padding-top: 10px;
  }

  .work-process-no h3 {
    font-size: 20px;
  }

  .work-process-no h2 {
    font-size: 34px;
  }

  .work-process-icon-box {
    padding: 30px;
  }

  .work-process-icon-box img {
    max-width: 50px;
  }

  .our-features {
    padding: 40px 0;
  }

  .our-features::before {
    top: 15%;
    width: 250px;
    height: 225px;
  }

  .digital-features-box {
    gap: 30px;
  }

  .digital-features-item.features-item-1 {
    width: calc(55% - 15px);
  }

  .digital-features-item.features-item-2 {
    width: calc(45% - 15px);
  }

  .digital-features-item {
    padding: 30px;
  }

  .digital-features-content h3 {
    font-size: 20px;
  }

  .digital-features-image {
    margin-bottom: 30px;
  }

  .digital-features-item.features-item-1 .digital-features-image img {
    aspect-ratio: 1 / 0.62;
  }

  .digital-features-item.agency-supports {
    padding: 30px 0;
  }

  .agency-supports-header {
    margin-bottom: 30px;
    padding: 0 30px;
  }

  .agency-supports-content {
    width: 70%;
  }

  .agency-supports-content h3 {
    font-size: 20px;
  }

  .agency-free-consultation {
    width: 30%;
  }

  .agency-free-consultation img {
    max-width: 80px;
  }

  .agency-supports-logo {
    padding: 20px 25px;
  }

  .agency-supports-logo img {
    max-height: 25px;
  }

  .our-portfolio {
    padding: 40px 0 10px;
  }

  .our-Project-nav {
    margin-bottom: 40px;
  }

  .our-Project-nav ul {
    gap: 10px 20px;
  }

  .our-Project-nav ul li a {
    font-size: 14px;
    padding: 10px 15px;
  }

  .project-item {
    height: calc(100% - 30px);
    margin-bottom: 30px;
  }

  .project-btn a {
    width: 80px;
    height: 80px;
  }

  .project-btn a img {
    max-width: 34px;
  }

  .project-content h3 {
    font-size: 20px;
  }

  .our-testimonial {
    padding: 40px 0;
  }

  .our-testimonial::before {
    width: 250px;
    height: 245px;
  }

  .testimonial-review-box {
    padding: 30px;
    margin-bottom: 30px;
  }

  .testimonial-review-content,
  .testimonial-review-header {
    margin-bottom: 20px;
  }

  .testimonial-review-header h2 {
    font-size: 60px;
  }

  .testimonial-review-content h3 {
    font-size: 20px;
  }

  .testimonial-slider {
    margin-left: 0px;
  }

  .testimonial-company-logo {
    margin-bottom: 20px;
  }

  .testimonial-content {
    margin-bottom: 30px;
  }

  .testimonial-content p {
    font-size: 20px;
  }

  .author-content h3 {
    font-size: 20px;
  }

  .testimonial-slider .testimonial-button-next,
  .testimonial-slider .testimonial-button-prev {
    width: 50px;
    height: 50px;
  }

  .testimonial-slider .testimonial-button-next::before,
  .testimonial-slider .testimonial-button-prev::before {
    background-size: 24px auto;
  }

  .testimonial-benefits-box {
    gap: 20px;
    margin-top: 50px;
    padding: 30px 15px;
  }

  .testimonial-benefits-item {
    width: calc(25% - 15px);
  }

  .testimonial-benefits-item::before {
    right: -10px;
  }

  .testimonial-benefits-item .icon-box {
    margin-bottom: 20px;
  }

  .testimonial-benefits-content h3 {
    font-size: 20px;
    margin-bottom: 15px;
  }

  .testimonial-benefits-content ul li {
    font-size: 14px;
    padding-left: 18px;
    margin-bottom: 10px;
  }

  .testimonial-benefits-content ul li::before {
    font-size: 14px;
  }

  .agency-benefits {
    padding: 40px 0 10px;
  }

  .agency-benefits::before {
    width: 210px;
    height: 220px;
  }

  .benefits-steps-item {
    padding: 20px;
  }

  .benefits-steps-item .icon-box,
  .benefits-steps-no {
    margin-bottom: 30px;
  }

  .benefits-steps-item .icon-box img {
    max-width: 50px;
  }

  .benefits-steps-content h3 {
    font-size: 20px;
  }

  .our-blog {
    padding: 40px 0 10px;
  }

  .post-featured-image {
    margin-bottom: 20px;
  }

  .post-item-content {
    margin-bottom: 15px;
  }

  .post-item-content h3 {
    font-size: 20px;
  }

  .footer-work-together {
    padding: 40px 0;
  }

  .footer-work-together::before {
    top: 0;
    width: 245px;
    height: 355px;
  }

  @keyframes circlmoveerotate {
    from {
      transform: translateY(0) rotate(0deg);
    }
    to {
      transform: translateY(100px) rotate(360deg);
    }
  }

  .work-together-content {
    background-size: cover;
  }

  .footer-work-together h3 {
    font-size: 20px;
    margin-bottom: 10px;
  }

  .footer-work-together h2 {
    font-size: 120px;
  }

  .footer-work-together .work-together-btn a {
    width: 120px;
    height: 120px;
  }

  .footer-main {
    padding: 40px 0 0;
  }

  .footer-logo {
    margin-bottom: 40px;
  }

  .footer-contact-item {
    margin-bottom: 20px;
  }

  .footer-contact-content p {
    font-size: 20px;
  }

  .footer-newsletter-form h3,
  .footer-links h3 {
    font-size: 20px;
    margin-bottom: 20px;
  }

  .footer-links ul li {
    margin-bottom: 10px;
  }

  .footer-newsletter-form {
    margin-top: 30px;
  }

  .footer-newsletter-form .form-group .form-control {
    width: 80%;
  }

  .footer-social-links {
    margin-top: 30px;
  }

  .footer-copyright {
    padding: 30px 0;
    margin-top: 40px;
  }

  .page-header {
    padding: 182px 0 80px;
  }

  .page-header-box h1 {
    font-size: 70px;
  }

  .page-header-box ol li.breadcrumb-item {
    font-size: 16px;
  }

  .our-scrolling-ticker.subpages-scrolling-ticker .scrolling-content span {
    font-size: 20px;
  }

  .our-approach {
    padding: 40px 0 10px;
  }

  .mission-vision-item {
    padding: 30px;
  }

  .mission-vision-image {
    margin-bottom: 15px;
  }

  .mission-vision-item .mission-vision-content h3 {
    font-size: 20px;
    margin-bottom: 15px;
  }

  .who-we-are {
    padding: 40px 0;
  }

  .who-we-are::before {
    top: -13%;
    width: 210px;
    height: 220px;
  }

  .who-we-are .who-we-are-content {
    padding-right: 0px;
    margin-bottom: 30px;
  }

  .experts-counters-list {
    gap: 40px;
  }

  .experts-counter-box {
    width: calc(50% - 20px);
    gap: 40px;
  }

  .experts-counter-box:nth-child(even) {
    margin-top: 40px;
  }

  .experts-counter-content h2 {
    font-size: 40px;
  }

  .executive-partners {
    padding: 40px 0;
  }

  .executive-partners-box {
    padding: 50px;
  }

  .executive-partners-box .section-title {
    margin-bottom: 30px;
  }

  .our-team {
    padding: 40px 0 10px;
  }

  .our-team::before {
    top: -5%;
    width: 250px;
    height: 280px;
  }

  .team-image figure,
  .team-image img {
    aspect-ratio: 1 / 1.3;
  }

  .team-content h3 {
    font-size: 20px;
  }

  .our-faqs {
    padding: 40px 0;
  }

  .faq-images {
    max-width: 80%;
    margin: 0 auto 30px;
    padding: 100px 80px 0 0;
  }

  .faq-img-1 img {
    max-width: 285px;
  }

  .faq-img-2 img {
    aspect-ratio: 1 / 0.9;
  }

  .our-faq-section .accordion-header .accordion-button {
    font-size: 20px;
  }

  .page-services {
    padding: 80px 0 10px;
  }

  .page-service-single {
    padding: 80px 0 40px;
  }

  .page-service-single::before {
    width: 300px;
    height: 330px;
  }

  .page-service-single::after {
    width: 250px;
    height: 280px;
  }

  .service-single-content {
    margin: 0 0 40px 0;
  }

  .service-feature-image {
    margin-bottom: 30px;
  }

  .service-feature-image img {
    aspect-ratio: 1 / 0.59;
  }

  .service-entry {
    margin-bottom: 30px;
  }

  .service-entry h2 {
    font-size: 40px;
  }

  .service-entry-list-image {
    margin: 30px 0;
    gap: 20px;
  }

  .service-entry-list {
    width: calc(55% - 10px);
  }

  .service-entry-list ul li {
    margin-bottom: 15px;
    padding-left: 25px;
  }

  .service-entry-list ul li::before {
    font-size: 16px;
  }

  .service-entry-image {
    width: calc(45% - 10px);
  }

  .process-step-content {
    padding: 30px;
  }

  .process-step-header {
    margin-bottom: 50px;
  }

  .process-step-header .icon-box img {
    max-width: 48px;
  }

  .process-step-no h3 {
    font-size: 20px;
  }

  .process-step-body h3 {
    font-size: 20px;
  }

  .process-step-image img {
    aspect-ratio: 1 / 0.8;
  }

  .service-sidebar {
    position: initial;
  }

  .service-catagery-list {
    margin-bottom: 40px;
  }

  .service-catagery-list h3 {
    font-size: 20px;
    padding: 30px 30px 20px;
  }

  .service-catagery-list ul {
    padding: 20px 30px 30px;
  }

  .service-catagery-list ul li {
    padding-bottom: 20px;
    margin-bottom: 20px;
  }

  .sidebar-cta-box {
    padding: 30px;
  }

  .sidebar-cta-box .icon-box {
    margin-bottom: 30px;
  }

  .sidebar-cta-box .icon-box img {
    max-width: 50px;
  }

  .cta-contact-content h3 {
    font-size: 20px;
    margin-bottom: 10px;
  }

  .page-blog {
    padding: 80px 0 40px;
  }

  .page-blog::before {
    width: 300px;
    height: 330px;
  }

  .post-item {
    height: calc(100% - 30px);
    margin-bottom: 30px;
  }

  .page-pagination {
    margin-top: 10px;
  }

  .page-single-post {
    padding: 80px 0 40px;
  }

  .post-image {
    margin-bottom: 20px;
  }

  .post-entry blockquote {
    background-position: 25px 25px;
    background-size: 50px;
    padding: 25px 25px 25px 90px;
    margin-bottom: 20px;
  }

  .post-entry blockquote p {
    font-size: 18px;
  }

  .post-entry h2 {
    font-size: 40px;
  }

  .post-entry ul li {
    font-size: 16px;
  }

  .post-tags {
    margin-bottom: 20px;
  }

  .post-social-sharing ul {
    text-align: left;
  }

  .tag-links {
    font-size: 22px;
  }

  .post-tags .tag-links a {
    font-size: 16px;
    padding: 6px 15px;
  }

  .page-project {
    padding: 80px 0 10px;
  }

  .page-project::before {
    width: 300px;
    height: 330px;
  }

  .page-project-single {
    padding: 80px 0 40px;
  }

  .page-project-single::before {
    top: 20%;
    width: 210px;
    height: 220px;
  }

  .page-project-single::after {
    width: 250px;
    height: 280px;
  }

  .project-single-content {
    margin-right: 0;
    margin-bottom: 30px;
  }

  .project-single-image {
    margin-bottom: 30px;
  }

  .project-single-content img {
    aspect-ratio: 1 / 0.57;
  }

  .project-challenges,
  .project-info,
  .project-entry {
    margin-bottom: 30px;
  }

  .project-entry p {
    margin-bottom: 20px;
  }

  .project-entry h2 {
    font-size: 40px;
    margin-bottom: 20px;
  }

  .project-entry ul li {
    margin-bottom: 15px;
    padding-left: 25px;
  }

  .project-entry ul li::before {
    font-size: 16px;
  }

  .project-solution-rating {
    margin-top: 0;
  }

  .project-counter-content h3 {
    font-size: 34px;
  }

  .project-sidebar {
    position: initial;
  }

  .project-catagery-list {
    margin-bottom: 40px;
  }

  .category-item-list {
    padding: 30px 30px 20px;
  }

  .category-list-item h3 {
    font-size: 20px;
    margin-bottom: 5px;
  }

  .category-social-link {
    padding: 30px;
  }

  .category-social-link .social-links {
    font-size: 20px;
  }

  .page-team {
    padding: 80px 0 10px;
  }

  .page-team::before {
    width: 245px;
    height: 355px;
  }

  .page-team-single {
    padding: 80px 0 40px;
  }

  .page-team-single::before {
    top: 40%;
    width: 250px;
    height: 280px;
  }

  .team-single-content {
    margin-right: 0;
  }

  .team-info-box {
    margin-bottom: 40px;
  }

  .team-info-header {
    align-items: center;
    margin-bottom: 30px;
  }

  .team-single-content h2 {
    font-size: 40px;
  }

  .team-contact-box {
    padding-bottom: 20px;
    margin-bottom: 20px;
  }

  .team-contact-box .icon-box {
    width: 65px;
    height: 65px;
  }

  .team-contact-box .icon-box img {
    max-width: 30px;
  }

  .team-contact-content {
    width: calc(100% - 95px);
  }

  .team-contact-content h3 {
    font-size: 20px;
    margin-bottom: 5px;
  }

  .team-personal-info {
    margin-bottom: 40px;
  }

  .team-career-list {
    margin-top: 20px;
  }

  .team-career-list ul {
    row-gap: 15px;
  }

  .team-single-sidebar {
    position: initial;
    margin-bottom: 30px;
  }

  .team-single-image {
    margin-bottom: 40px;
  }

  .team-single-image img {
    aspect-ratio: 1 / 0.8;
    object-position: top center;
  }

  .team-single-contact-form h3 {
    font-size: 28px;
    padding: 30px;
  }

  .team-single-contact-form form {
    padding: 30px;
  }

  .page-pricing {
    padding: 80px 0 40px;
  }

  .pricing-box-list {
    gap: 30px;
  }

  .pricing-box {
    width: calc(50% - 15px);
    padding: 30px;
  }

  .pricing-box-content {
    gap: 15px;
    margin-bottom: 30px;
    padding-bottom: 30px;
  }

  .pricing-title {
    width: calc(52% - 7.5px);
  }

  .pricing-title h3 {
    font-size: 26px;
    margin-bottom: 5px;
  }

  .pricing-price {
    width: calc(48% - 7.5px);
  }

  .pricing-price h2 {
    font-size: 40px;
  }

  .pricing-price h2 sup {
    font-size: 20px;
  }

  .pricing-price h2 sub {
    font-size: 14px;
  }

  .pricing-list ul {
    gap: 15px;
  }

  .pricing-list ul li {
    width: 100%;
  }

  .pricing-list {
    margin-bottom: 30px;
  }

  .page-testimonial {
    padding: 80px 0 40px;
  }

  .testimonial-box-list {
    gap: 40px;
  }

  .testimonial-box-item {
    padding: 40px 30px;
    gap: 30px;
  }

  .client-author-image {
    width: calc(32% - 15px);
  }

  .client-testimonial-content {
    width: calc(68% - 15px);
  }

  .client-testimonial-rating {
    margin-bottom: 10px;
  }

  .client-testimonial-info p {
    font-size: 18px;
  }

  .client-author-title h3 {
    font-size: 20px;
  }

  .page-gallery {
    padding: 80px 0 10px;
  }

  .page-video-gallery {
    padding: 80px 0 10px;
  }

  .page-faqs {
    padding: 80px 0 40px;
  }

  .page-faqs-catagery {
    margin-right: 0px;
  }

  .page-faq-accordion {
    margin-bottom: 40px;
  }

  .faq-sidebar {
    position: initial;
    margin-bottom: 30px;
  }

  .faq-catagery-list {
    margin-bottom: 40px;
  }

  .faq-catagery-list ul {
    padding: 30px;
  }

  .faq-catagery-list ul li {
    padding-bottom: 20px;
    margin-bottom: 20px;
  }

  .page-contact-us {
    padding: 80px 0 40px;
  }

  .contact-information {
    margin-bottom: 30px;
  }

  .contact-info-box {
    gap: 20px;
  }

  .contact-info-box .info-box-1,
  .contact-info-box .info-box-2 {
    padding: 20px 30px;
  }

  .contact-info-item .icon-box {
    margin-bottom: 20px;
  }

  .contact-info-item .icon-box img {
    max-width: 40px;
  }

  .contact-info-box .info-box-2 .contact-item-content {
    width: calc(100% - 70px);
  }

  .contact-item-content h3 {
    font-size: 20px;
  }

  .contact-us-form {
    margin: 0;
    padding: 30px;
  }

  .google-map {
    padding: 40px 0;
  }

  .google-map-iframe,
  .google-map-iframe iframe {
    height: 450px;
  }

  .error-page {
    padding: 80px 0 40px;
  }

  .error-page-image {
    margin-bottom: 20px;
  }

  .error-page-image img {
    max-width: 80%;
  }

  .error-page-content-heading {
    margin-bottom: 15px;
  }

  .error-page-content-body p {
    margin-bottom: 20px;
  }
}

@media only screen and (max-width: 767px) {
  body {
    background-size: 200% auto;
  }

  .section-title h1 {
    font-size: 34px;
  }

  .section-title h2 {
    font-size: 30px;
  }

  .hero-content {
    text-align: center;
  }

  .hero-content .section-title {
    margin-bottom: 30px;
  }

  .hero-content-body {
    display: block;
  }

  .hero-content-video {
    width: 100%;
    justify-content: center;
    margin-bottom: 30px;
  }

  .hero-content-video .video-play-button a {
    height: 80px;
    width: 80px;
  }

  .hero-content-video .video-play-button a i {
    font-size: 25px;
  }

  .learn-more-circle img {
    max-width: 80px;
  }

  .hero-video-content {
    width: 100%;
  }

  .scrolling-ticker-box {
    --gap: 20px;
  }

  .scrolling-content span {
    font-size: 28px;
  }

  .scrolling-content span img {
    max-width: 20px;
    margin-right: 20px;
  }

  .about-agency::before {
    width: 250px;
    height: 280px;
  }

  .about-agency-list {
    padding-left: 20px;
  }

  .agency-item-content h3:after {
    left: -30px;
  }

  .agency-item-content h3 {
    font-size: 18px;
  }

  .service-item {
    padding: 20px;
  }

  .service-item-body h3 {
    font-size: 18px;
  }

  .service-footer p {
    font-size: 12px;
  }

  .digital-success-box {
    gap: 30px;
    padding: 40px 30px;
  }

  .digital-success-box::before {
    left: 10px;
    top: 10px;
    border-radius: 20px;
    width: calc(100% - 20px);
    height: calc(100% - 10px);
  }

  .success-counter-box {
    gap: 20px;
  }

  .success-counter-item {
    width: 100%;
  }

  .success-counter-item h2 {
    font-size: 30px;
  }

  .success-list-item {
    background-size: 18px auto;
    margin-bottom: 30px;
  }

  .success-list-item p span {
    font-size: 18px;
  }

  .why-choose-us::before {
    top: 30%;
    width: 200px;
    height: 230px;
  }

  .why-choose-item h3 {
    font-size: 18px;
  }

  .agency-social-item {
    margin: 15px 0 30px 15px;
  }

  .agency-social-item .icon-box {
    top: -15px;
    left: -15px;
  }

  .agency-social-item .icon-box a {
    width: 50px;
    height: 50px;
  }

  .agency-social-item .icon-box i {
    font-size: 20px;
  }

  .agency-social-content h3 {
    font-size: 18px;
  }

  .how-it-work::before {
    width: 180px;
    height: 220px;
  }

  .work-process-header {
    margin-bottom: 20px;
  }

  .work-process-title h3 {
    font-size: 18px;
  }

  .work-process-content {
    margin-bottom: 30px;
  }

  .work-process-body {
    padding-top: 20px;
  }

  .work-process-no h3 {
    font-size: 18px;
  }

  .work-process-no h2 {
    font-size: 28px;
  }

  .our-features::before {
    right: -70px;
    top: 13%;
    width: 150px;
    height: 135px;
  }

  .digital-features-item.features-item-2,
  .digital-features-item.features-item-1 {
    width: 100%;
  }

  .digital-features-item.features-item-1 .digital-features-image img {
    aspect-ratio: 1 / 0.72;
  }

  .digital-features-item {
    padding: 20px;
  }

  .digital-features-image {
    margin-bottom: 20px;
  }

  .digital-features-content h3 {
    font-size: 18px;
  }

  .agency-supports-header {
    display: block;
  }

  .agency-supports-content,
  .agency-free-consultation {
    width: 100%;
  }

  .agency-supports-content h3 {
    font-size: 18px;
  }

  .agency-free-consultation {
    text-align: left;
    margin-top: 20px;
  }

  .agency-supports-slider::before {
    background: linear-gradient(280deg, #030709 0%, rgba(3, 7, 9, 0) 60.97%);
    width: 150px;
  }

  .agency-supports-slider::after {
    background: linear-gradient(90deg, #030709 0%, rgba(3, 7, 9, 0) 60.97%);
    width: 150px;
  }

  .project-btn a {
    width: 60px;
    height: 60px;
  }

  .project-btn a img {
    max-width: 26px;
  }

  .project-content h3 {
    font-size: 18px;
  }

  .testimonial-review-box {
    padding: 20px;
  }

  .testimonial-review-header h2 {
    font-size: 40px;
  }

  .testimonial-review-content h3 {
    font-size: 18px;
  }

  .testimonial-company-logo,
  .testimonial-rating {
    margin-bottom: 15px;
  }

  .testimonial-content p {
    font-size: 18px;
  }

  .author-content h3 {
    font-size: 18px;
  }

  .testimonial-btn {
    position: relative;
    justify-content: center;
    margin-top: 30px;
  }

  .testimonial-slider .testimonial-button-next,
  .testimonial-slider .testimonial-button-prev {
    width: 45px;
    height: 45px;
  }

  .testimonial-benefits-box {
    gap: 30px;
    padding: 30px 20px;
  }

  .testimonial-benefits-item {
    width: 100%;
  }

  .testimonial-benefits-item::before {
    top: auto;
    bottom: -15px;
    right: 0;
    border-right: none;
    border-bottom: 1px solid var(--divider-color);
    width: 100%;
    height: 1px;
    z-index: 1;
  }

  .testimonial-benefits-item:last-child:before {
    display: none;
  }

  .testimonial-benefits-content h3 {
    font-size: 18px;
    margin-bottom: 10px;
  }

  .benefits-steps-item .icon-box,
  .benefits-steps-no {
    margin-bottom: 20px;
  }

  .benefits-steps-no h3 {
    font-size: 18px;
  }

  .benefits-steps-content h3 {
    font-size: 18px;
  }

  .post-item-content h3 {
    font-size: 18px;
  }

  .footer-work-together::before {
    left: -90px;
    width: 180px;
    height: 190px;
  }

  .footer-work-together h3 {
    font-size: 18px;
  }

  .footer-work-together h2 {
    font-size: 55px;
  }

  .work-together-btn {
    top: 56%;
  }

  .footer-work-together .work-together-btn a {
    width: 85px;
    height: 85px;
  }

  .footer-work-together .work-together-btn a span {
    font-size: 12px;
  }

  .about-footer {
    margin-bottom: 30px;
  }

  .footer-contact-content p {
    font-size: 18px;
  }

  .footer-logo {
    margin-bottom: 30px;
  }

  .footer-newsletter-form h3,
  .footer-links h3 {
    font-size: 18px;
    margin-bottom: 15px;
  }

  .footer-newsletter-form .form-group .form-control {
    width: 57%;
  }

  .footer-copyright {
    padding: 20px 0;
    margin-top: 30px;
  }

  .page-header-box h1 {
    font-size: 34px;
  }

  .our-scrolling-ticker.subpages-scrolling-ticker .scrolling-content span {
    font-size: 18px;
  }

  .our-scrolling-ticker.subpages-scrolling-ticker .scrolling-content span img {
    max-width: 16px;
  }

  .mission-vision-item {
    padding: 20px;
  }

  .mission-vision-item .mission-vision-content h3 {
    font-size: 18px;
  }

  .experts-rating-video-image {
    width: 100%;
    margin-bottom: 20px;
  }

  .who-we-are-client {
    width: 100%;
    padding-left: 0px;
  }

  .experts-counter-box {
    width: 100%;
    gap: 30px;
  }

  .experts-counter-box:nth-child(even) {
    margin-top: 0px;
  }

  .experts-counter-item {
    padding: 20px;
  }

  .experts-counter-box.expert-box-2 .experts-counter-item:nth-child(odd) {
    background: url(../images/who-we-are-counter-bg.png);
  }

  .experts-counter-box.expert-box-2 .experts-counter-item:nth-child(even) {
    background: transparent;
  }

  .experts-counter-content h2 {
    font-size: 30px;
  }

  .executive-partners-box {
    padding: 30px;
  }

  .our-partners-list {
    gap: 20px;
  }

  .our-partners-list .company-logo {
    width: calc(50% - 10px);
    padding: 15px;
  }

  .faq-images {
    max-width: 100%;
    padding: 80px 50px 0 0;
  }

  .faq-img-1 img {
    max-width: 185px;
  }

  .faq-cta-box a {
    font-size: 14px;
    padding: 8px 15px;
  }

  .our-faq-section .accordion-item {
    margin-bottom: 20px;
  }

  .our-faq-section .accordion-header .accordion-button {
    font-size: 18px;
    padding: 12px 40px 12px 12px;
  }

  .our-faq-section .accordion-item .accordion-button::after,
  .our-faq-section .accordion-item .accordion-button.collapsed::after {
    right: 12px;
    font-size: 12px;
    width: 20px;
    height: 20px;
  }

  .our-faq-section .accordion-item .accordion-body {
    padding: 0 12px 12px 12px;
  }

  .page-service-single::before {
    width: 250px;
    height: 280px;
  }

  .page-service-single::after {
    width: 250px;
    height: 280px;
  }

  .service-feature-image img {
    aspect-ratio: 1 / 0.78;
  }

  .service-entry h2 {
    font-size: 30px;
  }

  .service-entry-list-image {
    gap: 30px;
  }

  .service-entry-list,
  .service-entry-image {
    width: 100%;
  }

  .service-entry-list ul li {
    font-size: 14px;
    padding-left: 20px;
  }

  .service-entry-list ul li::before {
    font-size: 14px;
  }

  .service-entry-image img {
    aspect-ratio: 1 / 0.68;
    object-position: top center;
  }

  .service-process-steps {
    gap: 20px;
    margin: 0;
  }

  .process-step-item {
    gap: 20px;
  }

  .process-step-content,
  .process-step-image {
    width: 100%;
  }

  .process-step-content {
    padding: 20px;
  }

  .process-step-header {
    margin-bottom: 50px;
  }

  .process-step-header .icon-box img {
    max-width: 36px;
  }

  .process-step-no h3 {
    font-size: 18px;
  }

  .process-step-body h3 {
    font-size: 18px;
    margin-bottom: 15px;
  }

  .process-step-image img {
    aspect-ratio: 1 / 0.72;
  }

  .service-catagery-list {
    margin-bottom: 30px;
  }

  .service-catagery-list h3 {
    font-size: 18px;
    padding: 20px;
  }

  .service-catagery-list ul {
    padding: 20px;
  }

  .service-catagery-list ul li {
    padding-bottom: 15px;
    margin-bottom: 15px;
  }

  .service-catagery-list ul li a::before {
    width: 22px;
    height: 22px;
  }

  .sidebar-cta-box {
    padding: 20px;
  }

  .sidebar-cta-box .icon-box {
    margin-bottom: 25px;
  }

  .sidebar-cta-box .icon-box img {
    max-width: 40px;
  }

  .cta-contact-content h3 {
    font-size: 18px;
  }

  .cta-contact-btn a {
    padding: 10px 25px;
  }

  .cta-contact-btn a img {
    max-width: 22px;
    margin-right: 10px;
  }

  .page-blog::before {
    width: 250px;
    height: 280px;
  }

  .post-image figure,
  .post-image img {
    aspect-ratio: 1 / 0.7;
  }

  .post-entry blockquote {
    background-position: 20px 20px;
    padding: 70px 20px 20px 20px;
  }

  .post-entry h2 {
    font-size: 28px;
  }

  .tag-links {
    font-size: 20px;
  }

  .page-project::before {
    width: 250px;
    height: 280px;
  }

  .page-project-single::before {
    width: 210px;
    height: 220px;
  }

  .page-project-single::after {
    top: 53%;
    width: 200px;
    height: 230px;
  }

  .project-single-content {
    margin-bottom: 20px;
  }

  .project-single-content img {
    aspect-ratio: 1 / 0.67;
  }

  .project-entry h2 {
    font-size: 30px;
  }

  .project-entry ul li {
    font-size: 14px;
    margin-bottom: 10px;
  }

  .project-solution-rating {
    gap: 15px;
  }

  .project-rating-counter .icon-box i {
    font-size: 36px;
  }

  .project-counter-content {
    width: calc(100% - 56px);
  }

  .project-counter-content h3 {
    font-size: 28px;
  }

  .project-rating-content,
  .project-rating-counter {
    width: 100%;
  }

  .category-item-list {
    padding: 20px;
  }

  .category-list-item {
    padding-bottom: 15px;
    margin-bottom: 15px;
  }

  .category-list-item h3 {
    font-size: 18px;
  }

  .category-social-link {
    padding: 20px;
  }

  .category-social-link span {
    font-size: 20px;
  }

  .page-team::before {
    width: 180px;
    height: 190px;
  }

  .page-team-single::before {
    width: 200px;
    height: 230px;
  }

  .team-info-box {
    margin-bottom: 30px;
  }

  .team-info-header {
    margin-bottom: 30px;
    gap: 10px;
  }

  .team-info-title,
  .team-info-social-list {
    width: 100%;
  }

  .team-info-social-list ul {
    text-align: left;
  }

  .team-single-content p {
    margin-bottom: 15px;
  }

  .team-single-content h2 {
    font-size: 30px;
  }

  .team-contact-box {
    padding-bottom: 15px;
    margin-bottom: 15px;
  }

  .team-contact-box .icon-box {
    margin-right: 20px;
  }

  .team-contact-content {
    width: calc(100% - 85px);
  }

  .team-contact-content h3 {
    font-size: 18px;
  }

  .team-personal-info {
    margin-bottom: 30px;
  }

  .team-career-list ul {
    gap: 10px;
  }

  .team-career-list ul li {
    width: 100%;
    padding-left: 25px;
  }

  .team-career-list ul li::before {
    font-size: 16px;
  }

  .team-single-image {
    margin-bottom: 25px;
  }

  .team-single-image img {
    aspect-ratio: 1 / 1.08;
  }

  .team-single-contact-form h3 {
    font-size: 30px;
    padding: 20px;
  }

  .team-single-contact-form form {
    padding: 20px;
  }

  .pricing-box {
    width: 100%;
    padding: 20px;
  }

  .pricing-box-content {
    margin-bottom: 20px;
    padding-bottom: 20px;
  }

  .pricing-title h3 {
    font-size: 22px;
  }

  .pricing-price h2 {
    font-size: 30px;
  }

  .pricing-price h2 sup {
    font-size: 16px;
  }

  .pricing-list ul li {
    padding-left: 25px;
  }

  .pricing-list ul li::before {
    font-size: 16px;
  }

  .testimonial-box-item {
    padding: 20px 15px;
    gap: 20px;
    text-align: center;
  }

  .client-author-image {
    width: 100%;
    max-width: 120px;
    margin: 0 auto;
  }

  .client-testimonial-content {
    width: 100%;
  }

  .client-testimonial-info p {
    font-size: 16px;
  }

  .client-author-content {
    gap: 15px;
  }

  .client-author-title,
  .client-author-logo {
    width: 100%;
    text-align: center;
  }

  .client-author-title h3 {
    font-size: 18px;
  }

  .page-faq-accordion {
    margin-bottom: 30px;
  }

  .faq-catagery-list {
    margin-bottom: 30px;
  }

  .faq-catagery-list ul {
    padding: 20px;
  }

  .contact-info-box .info-box-1,
  .contact-info-box .info-box-2 {
    padding: 20px;
    gap: 40px;
  }

  .contact-info-box .info-box-1 .contact-info-item::before {
    top: auto;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, 20px);
    height: 1px;
    width: 100%;
  }

  .contact-info-box .info-box-1 .contact-info-item:nth-child(2n + 2):before {
    display: block;
  }

  .contact-info-box .info-box-1 .contact-info-item:last-child:before {
    display: none;
  }

  .contact-info-box .info-box-1 .contact-info-item {
    display: flex;
    width: 100%;
  }

  .contact-info-item .icon-box img {
    max-width: 32px;
  }

  .contact-info-box .info-box-1 .icon-box,
  .contact-info-box .info-box-2 .icon-box {
    margin: 0 25px 0 0;
  }

  .contact-info-box .info-box-1 .contact-item-content,
  .contact-info-box .info-box-2 .contact-item-content {
    width: calc(100% - 57px);
    text-align: left;
  }

  .contact-item-content h3 {
    font-size: 18px;
  }

  .contact-us-form {
    padding: 20px;
  }

  .google-map-iframe,
  .google-map-iframe iframe {
    height: 350px;
  }

  .footer-newsletter-form .form-group {
    flex-direction: column;
    gap: 20px;
  }
}

.dark-navbar {
  background-color: #121212;
  border-bottom: 1px solid #222;
}

.navbar-brand-dark {
  font-weight: bold;
  font-size: 1.5rem;
}

.navbar-links-dark li {
  margin-left: 25px;
  /* position: relative; */
}
#menu-container {
  position: relative;
  max-width: 100%;
}
.sub-sub-links-dark {
  margin-top: 8px;
  padding-left: 0px;
}

.sub-sub-links-dark li {
  margin-bottom: 6px;
  margin-left: 0;
  font-size: 16px !important;
  color: #eee;
}

.sub-sub-links-dark a {
  font-size: 0.85rem;
  color: #ccc !important;
  transition: color 0.3s ease;
}

.sub-sub-links-dark a:hover {
  color: #e6ff4c;
}

.navbar-links-dark li a {
  color: #fff;
  text-decoration: none;
  font-weight: 500;
  transition: color 0.3s ease;
  font-size: 16px;
}

.navbar-links-dark li a:hover {
  color: #fff;
}

.mega-menu-dark {
  display: none;
  position: absolute;
  top: 50%;
  left: 0;
  margin-left: calc(-50vw + 50%);
  /* background-color: #1c1c1c; */
  padding: 50px 20px;
  width: 100vw;
  z-index: 10;
}

#mega-menu-row {
  padding: 20px 0;
  background-color: #000;
}

#navTitle {
  font-size: 20px;
}

.services-item-dark:hover .mega-menu-dark {
  display: block;
}
.mega-menu-dark .col {
  padding-left: 75px;
}
.mega-menu-dark a {
  color: #fff;
  display: block;
  margin-bottom: 10px;
  font-size: 0.95rem;
  transition: color 0.3s ease;
}

.mega-menu-dark a:hover {
  color: #e6ff4c;
}

.navbar-toggle-dark {
  background: none;
  border: none;
  flex-direction: column;
  gap: 5px;
  display: flex;
}

.navbar-toggle-dark span {
  display: block;
  width: 25px;
  height: 2px;
  background: #fff;
}

/* Mobile menu */
.mobile-menu-dark {
  display: none;
  background-color: #1a1a1a;
  padding: 20px;
}

.mobile-menu-dark.active {
  display: block;
}

.mobile-menu-dark li {
  margin-bottom: 15px;
}

.mobile-menu-dark a {
  color: #fff;
  text-decoration: none;
  font-size: 1rem;
}

.mobile-services-dark .sub-links-dark {
  display: none;
  margin-top: 10px;
  margin-left: 15px;
}

.mobile-services-dark .sub-links-dark.active {
  display: block;
}

.sub-links-dark li {
  margin-bottom: 8px;
}

.dreams-block {
  padding: 40px 15px;
}

.dreams-columns {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 30px;
  text-align: center;
}

.dreams-column {
  flex: 1 1 150px;
}

.dreams-heading {
  font-size: 1.6rem;
  font-weight: 600;
  margin-bottom: 15px;
  text-align: left;
  padding-left: 10px;
  line-height: 1.4;
}

.dreams-highlight {
  font-weight: 700;
  font-size: 1.8rem;
  margin-right: 4px;
}

.dreams-d {
  color: #e4572e;
}
.dreams-r {
  color: #facc15;
}
.dreams-e {
  color: #22c55e;
}
.dreams-a {
  color: #3b82f6;
}
.dreams-m {
  color: #ec4899;
}
.dreams-s {
  color: #ffffff;
}

.dreams-sublist {
  list-style: none;
  padding: 0;
  margin: 0 auto;
  max-width: 200px;
}

.dreams-sublist li {
  position: relative;
  color: #ffffff;
  font-size: 1rem;
  font-weight: 500;
  margin: 10px 0;
  padding-left: 16px;
  text-align: left;
  transition: all 0.3s ease;
  cursor: pointer;
  opacity: 0.85;
}

.dreams-sublist li::before {
  content: "▸";
  position: absolute;
  left: 0;
  top: 0;
  color: #ffffff;
  font-size: 0.9rem;
  transition: transform 0.3s ease;
}

.dreams-sublist li:hover {
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0.05),
    rgba(255, 255, 255, 0)
  );
  box-shadow: inset 2px 0 0 #f15a22;
  color: #ffffff;
}

.dreams-sublist li:hover::before {
  transform: translateX(4px);
  color: #d12023; /* highlight color on hover */
}
/* Responsive */
@media (max-width: 768px) {
  .dreams-columns {
    justify-content: center;
  }
  .dreams-column {
    flex: 1 1 45%;
  }
}

@media (max-width: 480px) {
  .dreams-column {
    flex: 1 1 100%;
  }
}

.our-expertise {
  position: relative;
  padding: 80px 0;
}

.our-expertise::before {
  content: "";
  display: block;
  position: absolute;
  left: -20px;
  top: 80px;
  background: url(../images/section-bg-shape-4.png) no-repeat;
  background-position: left top;
  background-size: contain;
  width: 250px;
  height: 250px;
  opacity: 50%;
  animation: circlerotate 10s infinite linear;
  animation-direction: alternate;
  z-index: -1;
}

.our-expertise-boxes {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}

.expertise-item {
  position: relative;
  width: calc(50% - 15px);
  background: url("../images/expertise-item-bg-shape.svg");
  background-repeat: no-repeat;
  background-position: top left;
  background-size: auto;
  border: 1px solid var(--divider-color);
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  border-radius: 30px;
  padding: 30px 25px;
  overflow: hidden;
}

.expertise-item::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--secondary-color);
  opacity: 40%;
  height: 100%;
  width: 100%;
  z-index: -1;
}

.expertise-item .icon-box {
  margin-bottom: 30px;
}

.expertise-item .icon-box img {
  max-width: 40px;
  transition: all 0.4s ease-in-out;
}

.expertise-item:hover .icon-box img {
  filter: brightness(0) invert(1);
  transform: rotateY(180deg);
}

.expertise-item-content h3 {
  font-size: 22px;
  text-transform: capitalize;
  margin-bottom: 15px;
}

.expertise-item-content p {
  margin: 0;
}

.expertise-btn {
  margin-top: 40px;
}

.our-expertise-image {
  margin-left: 30px;
}

.our-expertise-image img {
  width: 100%;
  aspect-ratio: 1 / 1.085;
  object-fit: contain;
}

.service-item-box {
  position: relative;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 60px;
  background: url(../images/service-item-box-shape.svg) no-repeat;
  background-position: top left;
  background-size: auto;
  border: 1px solid var(--divider-color);
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  border-radius: 30px;
  padding: 50px;
  overflow: hidden;
}

.service-item-box::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: var(--secondary-color);
  opacity: 40%;
  z-index: -1;
}

.services-content-list {
  width: calc(55% - 30px);
}

.services-content-item {
  border-bottom: 1px solid var(--divider-color);
  margin-bottom: 30px;
  padding-bottom: 30px;
}

.services-content-item:last-child {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}

.services-content-item h3 {
  position: relative;
  font-size: 22px;
  padding-left: 30px;
  margin-bottom: 15px;
}

.services-content-item h3::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  background: url(../images/dots.png) no-repeat;
  background-position: left center;
  background-size: cover;
  width: 20px;
  height: 20px;
}

.services-content-item p:last-child {
  margin-bottom: 0;
}

.service-tab-image {
  width: calc(45% - 30px);
  border: 10px solid var(--divider-color);
  border-radius: 30px;
  padding: 35px 0 0 35px;
  overflow: hidden;
}

.service-tab-image img {
  width: 100%;
  object-fit: cover;
  aspect-ratio: 1 / 0.964;
  border-radius: 30px 0 0 0;
}

#aif-heading {
  margin-bottom: 50px;
}

.btn-flex {
  display: flex;
  gap: 20px;
}

.btn-flex-mf {
  display: flex;
  gap: 10px;
  margin-top: 20px;
}

#pms-p-div {
  margin-bottom: 60px;
}

#mf-item {
  width: 80%;
}

.chart-container {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  gap: 20px;
  padding: 20px;
  position: relative;
}

.chart-container img {
  width: 500px;
  height: 300px !important;
  object-fit: cover;
}

.chart-container p {
  position: absolute;
  bottom: -30px;
  line-height: 1.5;
  font-size: 16px !important;
  /* left: 30px%; */
}

.chart-container .highlight-percentage {
  display: inline; /* force it to behave like text */
  background-color: #f15a22;
  color: #fff;
  font-weight: 600;
  padding: 2px 6px;
  border-radius: 6px;
  line-height: 1; /* reduce vertical shifting */
}

.chart-box {
  width: 450px;
  height: 400px;
  /* background: #000; */
  border-radius: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 10px;
}

#chart1,
#chart2 {
  background-color: black;
  padding: 20px;
  border-radius: 10px;
}

/* Lowering the middle chart */
.lower-chart {
  margin-bottom: -80px;
}

.chart-card {
  background-color: #080808;
  border-radius: 12px;
  padding: 20px;
  width: 100%;
  /* margin-bottom: 20px; */
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

.chart-card h2 {
  font-size: 32px;
}

.source,
.disclaimer {
  margin-top: 10px;
  font-size: 12px;
  color: #6c6c6c;
  cursor: pointer;
}

.price-label {
  display: flex;
  justify-content: space-between;
  margin-top: 20px;
}

#quicklinks-footer {
  margin-top: 50px;
}

.pl-section {
  background: #0e0e0e;
  padding: 10px 0;
  width: 100%;
  color: #f1f1f1;
}

#closeCustomPopup {
  color: #fff;
}
.pl-container {
  display: flex;
  flex: 1;
  flex-direction: row;
  align-items: center;
  height: 100%;
  gap: 2rem;
}
/* Each side takes half */
.pl-left,
.pl-right {
  flex: 1;
}

.pl-heading {
  color: #ffffff;
  margin-bottom: 1rem;
  font-size: 1.75rem;
}

.pl-label {
  display: block;
  margin-top: 1.25rem;
  margin-bottom: 0.5rem;
  font-weight: 500;
  color: #ffffff;
  font-size: 24px;
}

.pl-input {
  width: 100%;
  padding: 0.6rem;
  border: 1px solid #333;
  border-radius: 6px;
  font-size: 1rem;
  background-color: #2a2a2a;
  color: #f1f1f1;
}

.pl-buttons {
  margin-top: 0.5rem;
}

.pl-buttons button {
  margin: 0.25rem;
  padding: 0.5rem 1rem;
  border: 2px solid #f15a22;
  background: transparent;
  color: #f15a22;
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.3s ease;
}

.pl-buttons button.active,
.pl-buttons button:hover {
  background: #f15a22;
  color: #000;
}

.pl-right {
  background: #161616;
  padding: 2rem;
  border-radius: 10px;
  border-left: 1px solid #f15a22;
  border-bottom: 1px solid #f15a22;
}

.pl-output h3 {
  color: #ffffff;
  font-size: 1.5rem;
  margin-bottom: 1rem;
}

.pl-amount {
  font-size: 2rem;
  font-weight: bold;
  color: #f15a22;
}

.pl-output ul {
  list-style: none;
  padding: 0;
  margin: 1rem 0;
}

.pl-output li {
  margin: 0.5rem 0;
  font-size: 1rem;
  color: #e0e0e0;
}

.pl-output li span {
  float: right;
  font-weight: bold;
  color: #fff;
}

.pl-apply-btn {
  background-color: #f15a22;
  color: #fff;
  border: 2px solid #f15a22;
  padding: 0.75rem 1.5rem;
  font-size: 1rem;
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.3s ease;
}

.pl-apply-btn:hover {
  background-color: transparent;
  color: #f15a22;
}

input[type="range"] {
  -webkit-appearance: none;
  width: 100%;
  height: 6px;
  margin-top: 0.5rem;
  background: #333;
  border-radius: 3px;
  outline: none;
  box-shadow: 0 0 5px #f15a22;
}

/* WebKit thumb */
input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  height: 20px;
  width: 20px;
  border-radius: 50%;
  background: #f15a22;
  box-shadow: 0 0 10px #f15a22;
  border: 2px solid white;
  cursor: pointer;
  transition: box-shadow 0.2s ease-in-out;
}

input[type="range"]:hover::-webkit-slider-thumb {
  box-shadow:
    0 0 15px #ff6600,
    0 0 20px #ff6600;
}

/* Firefox */
input[type="range"]::-moz-range-track {
  height: 6px;
  background: #333;
  border-radius: 3px;
  box-shadow: 0 0 5px #f15a22;
}

input[type="range"]::-moz-range-thumb {
  height: 20px;
  width: 20px;
  border-radius: 50%;
  background: #f15a22;
  border: 2px solid white;
  box-shadow: 0 0 10px #f15a22;
  cursor: pointer;
  transition: box-shadow 0.2s ease-in-out;
}

input[type="range"]:hover::-moz-range-thumb {
  box-shadow:
    0 0 15px #ff6600,
    0 0 20px #ff6600;
}

.pl-label span {
  color: #f15a22;
  font-weight: bold;
}

.why-choose-box {
  display: flex;
  flex-wrap: wrap;
  /* align-items: center; */
  gap: 0px 15px;
}

.why-choose-us-content {
  width: calc(33% - 30px);
}

.why-choose-body {
  margin-bottom: 40px;
}

.why-choose-body ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.why-choose-body ul li {
  position: relative;
  line-height: normal;
  padding-left: 30px;
  margin-bottom: 20px;
}

.why-choose-body ul li:after {
  content: "\f192";
  font-family: "Font Awesome 6 Free";
  position: absolute;
  font-size: 18px;
  color: var(--accent-color);
  top: 2px;
  left: 0;
}

.why-choose-body ul li:last-child {
  margin-bottom: 0;
}

.why-choose-image {
  width: calc(70% - 30px);
  display: flex;
  flex-wrap: wrap;
  /* align-items: center; */
}

.why-choose-img {
  width: 49%;
}

.why-choose-img figure {
  display: block;
  border-radius: 20px;
}

.why-choose-img img {
  width: 100%;
  aspect-ratio: 1 / 1.4;
  object-fit: cover;
  border: 6px solid var(--accent-color);
  border-radius: 20px;
}

.why-choose-list {
  width: 51%;
  background-color: var(--accent-color);
  padding: 30px;
  border-radius: 0 20px 20px 0;
}

.why-choose-list-item {
  border-bottom: 1px solid var(--dark-color);
  margin-bottom: 20px;
  padding-bottom: 20px;
}

.why-choose-list-item:last-child {
  margin-bottom: 0px;
  padding-bottom: 0px;
  border-bottom: none;
}

.why-choose-list-item h3 {
  color: var(--dark-color);
  font-size: 22px;
  text-transform: capitalize;
  margin-bottom: 10px;
}

.why-choose-list-item p {
  color: var(--dark-color);
  margin: 0;
}

/* risks popup */

/* Popup Overlay */
.custom-popup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(17, 51, 89, 0.75);
  display: flex;
  justify-content: center;
  align-items: stretch;
  visibility: hidden;
  opacity: 0;
  transition:
    visibility 0s linear 0.3s,
    opacity 0.3s ease;
  z-index: 99999;
}

/* Popup Content Panel */
.custom-popup-content {
  width: 100%;
  max-width: 100%; /* full width */
  height: 100%;
  background: #121212;
  overflow-y: auto;
  transform: translateX(-100%);
  transition: transform 0.4s ease;
  position: relative;
  padding: 2rem 1rem;
  display: flex;
  flex-direction: row;
  gap: 2rem;
}

/* Show Popup */
.custom-popup-overlay.active {
  visibility: visible;
  opacity: 1;
  transition-delay: 0s;
}

.custom-popup-overlay.active .custom-popup-content {
  transform: translateX(0);
}

/* Close Button */
.custom-popup-close {
  position: absolute;
  top: 12px;
  right: 12px;
  font-size: 1.5rem;
  background: transparent;
  border: none;
  color: #113359;
  cursor: pointer;
  z-index: 10000;
}

/* Responsive */
/* Mobile Responsiveness */
@media (max-width: 768px) {
  .custom-popup-content {
    flex-direction: column;
    padding: 1rem;
  }

  .pl-container {
    flex-direction: column;
    gap: 1rem;
  }
}

.custom-popup-content::-webkit-scrollbar {
  width: 10px;
}

.custom-popup-content::-webkit-scrollbar-track {
  background: #000; /* Black background for the track */
}

.custom-popup-content::-webkit-scrollbar-thumb {
  background-color: #666; /* Dark grey thumb */
  border-radius: 5px;
}

.custom-popup-content::-webkit-scrollbar-thumb:hover {
  background-color: #888;
}

.product-boxes {
  /* display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-top: 1rem; */
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 20px;
  margin-top: 20px;
}

.product-box {
  background: linear-gradient(135deg, #242424, #0f0f0f);
  color: white;
  padding: 20px 20px;
  text-align: center;
  font-size: 18px;
  font-weight: 600;
  border-radius: 15px;
  justify-content: center;
  border: 2px solid transparent;
  /* box-shadow: 0 0 15px rgba(255, 140, 0, 0.4); */
  transition: all 0.3s ease;
  position: relative;
  cursor: pointer;
  overflow: hidden;
}
.pl-right-icon-div {
  display: flex;
  flex-direction: column;
  gap: 20px;
  justify-content: center;
  align-items: center;
  color: #fff;
}

.pl-right-icon-div img {
  width: 45px;
}

.product-box:hover {
  transform: scale(1.02);
  border-color: #ff7a00;
  /* box-shadow: 0 0 25px rgba(255, 140, 0, 0.8); */
  background: linear-gradient(135deg, #1e1e1e, #101010);
}

/* Optional: Animate glow pulse */
@keyframes glowPulse {
  0% {
    box-shadow: 0 0 15px rgba(255, 140, 0, 0.4);
  }
  50% {
    box-shadow: 0 0 25px rgba(255, 140, 0, 0.8);
  }
  100% {
    box-shadow: 0 0 15px rgba(255, 140, 0, 0.4);
  }
}

.product-box:hover {
  /* animation: glowPulse 1.5s infinite; */
}

/* Pagination styles */
.custom-pagination {
  text-align: center;
  margin-top: 20px;
}

.custom-page-btn {
  display: inline-block;
  margin: 0 5px;
  padding: 8px 14px;
  background-color: #111;
  color: white;
  border: 2px solid #ff7a00;
  border-radius: 6px;
  cursor: pointer;
  font-weight: 600;
  transition: background 0.3s ease;
}

.custom-page-btn.active,
.custom-page-btn:hover {
  background-color: #ff7a00;
  color: black;
}

/* Fade effect */
#productBoxes {
  transition: opacity 0.4s ease-in-out !important;
}

#wealthManagement .why-choose-us {
  padding: 80px 0;
}
#wealthManagement::before {
  background: url(../images/section-bg-shape-4.png) no-repeat;
}
#wealthManagement .why-choose-box {
  position: relative;
  background: none;
  background-position: top left;
  background-size: auto;
  /* border: 1px solid var(--divider-color); */
  /* backdrop-filter: blur(100px); */
  /* -webkit-backdrop-filter: blur(100px); */
  border-radius: 30px;
  padding: 20px;
  margin-bottom: 60px;
  overflow: hidden;
}

#wealthManagement .why-choose-box::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  /* background: var(--secondary-color); */
  opacity: 40%;
  height: 100%;
  width: 100%;
  z-index: -1;
}

#wealthManagement .why-choose-box:last-child {
  margin-bottom: 0;
}

#wealthManagement .why-choose-box .icon-box {
  margin-bottom: 20px;
}

#wealthManagement .why-choose-box .icon-box img {
  max-width: 40px;
  transition: all 0.4s ease-in-out;
}

#wealthManagement .why-choose-box:hover .icon-box img {
  filter: brightness(0) invert(1);
  transform: rotateY(180deg);
}

#wealthManagement .why-choose-box-content h3 {
  font-size: 22px;
  text-transform: capitalize;
  margin-bottom: 15px;
}

#wealthManagement .why-choose-box-content p {
  margin: 0;
}

#wealthManagement .why-choose-images {
  position: relative;
  margin: 0 10px;
}

#wealthManagement .why-choose-circle {
  position: relative;
  z-index: 1;
}

#wealthManagement .why-choose-circle img {
  animation: infiniterotate 30s infinite linear;
}

@keyframes infiniterotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

#wealthManagement .why-choose-img {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  max-width: 365px;
  transform: translate(-50%, -50%);
}

#wealthManagement .why-choose-img img {
  width: 100%;
  aspect-ratio: 1 / 1.1;
  object-fit: cover;
}

/* our brand cards popup */

.our-brand-contant {
  width: calc(30% - 15px);
}

.our-brand-list {
  width: calc(70% - 15px);
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}

.brand-list-item {
  position: relative;
  width: calc(33.33% - 20px);
  text-align: center;
  padding: 80px 15px 40px;
}

.brand-list-item::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(
    360deg,
    var(--accent-color) -20.74%,
    var(--dark-color) 106.06%
  );
  height: 0;
  width: 100%;
  transition: all 0.4s ease-in-out;
  z-index: -1;
}

.brand-list-item.active:before,
.brand-list-item:hover::before {
  height: 100%;
  border-radius: 0 0 30px 30px;
}

.brand-list-item .icon-box {
  position: relative;
  background-color: var(--accent-color);
  height: 100px;
  width: 100px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  border-radius: 100%;
  margin-bottom: 30px;
  overflow: hidden;
}

.brand-list-item .icon-box img {
  position: relative;
  max-width: 50px;
  z-index: 1;
}

.brand-item-content h3 {
  font-size: 22px;
  margin-bottom: 20px;
}

.brand-item-content p {
  margin: 0;
}

.our-brands {
  padding: 80px 0;
}

.our-brands-box {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 30px;
  border: 1px solid var(--divider-color);
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  border-radius: 30px;
  padding: 0 80px 80px;
  overflow: hidden;
}

.our-brands-box::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--secondary-color);
  opacity: 40%;
  height: 100%;
  width: 100%;
  z-index: -1;
}

.our-brand-contant {
  width: calc(30% - 15px);
}

.our-brand-list {
  width: calc(70% - 15px);
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}

.brand-list-item {
  position: relative;
  width: calc(33.33% - 20px);
  text-align: center;
  padding: 80px 15px 40px;
}

.brand-list-item::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(
    360deg,
    var(--accent-color) -20.74%,
    var(--dark-color) 106.06%
  );
  height: 0;
  width: 100%;
  transition: all 0.4s ease-in-out;
  z-index: -1;
}

.brand-list-item.active:before,
.brand-list-item:hover::before {
  height: 100%;
  border-radius: 0 0 30px 30px;
}

.brand-list-item .icon-box {
  position: relative;
  background-color: var(--accent-color);
  height: 100px;
  width: 100px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  border-radius: 100%;
  margin-bottom: 30px;
  overflow: hidden;
}

.brand-list-item .icon-box img {
  position: relative;
  max-width: 50px;
  z-index: 1;
}

.brand-item-content h3 {
  font-size: 22px;
  margin-bottom: 20px;
}

.brand-item-content p {
  margin: 0;
}

/* first section */

#firstSection .hero {
  position: relative;
  padding: 210px 0 120px;
}

#firstSection .hero::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background:
    linear-gradient(
      180.07deg,
      rgba(0, 0, 0, 0) 0.06%,
      var(--dark-color) 115.64%
    ),
    linear-gradient(
      359.91deg,
      rgba(0, 0, 0, 0.5) 75.34%,
      var(--dark-color) 99.95%
    );
  height: 100%;
  width: 100%;
  z-index: 1;
}

#firstSection .hero .hero-bg-video {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
}

#firstSection .hero .hero-bg-video video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#firstSection .hero.bg-image {
  background: url("../images/hero-bg.jpg") no-repeat;
  background-position: center center;
  background-size: cover;
  padding: 235px 0 140px;
}

#firstSection .hero.hero-slider-layout {
  background: none;
  padding: 0;
}

#firstSection .hero.hero-slider-layout .hero-slide {
  position: relative;
  background: url("../images/hero-bg.jpg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  padding: 235px 0 140px;
}

#firstSection .hero.hero-slider-layout .hero-slide.slide-2 {
  background: url("../images/hero-bg-2.jpg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

#firstSection .hero.hero-slider-layout .hero-slide::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background:
    linear-gradient(
      180.07deg,
      rgba(0, 0, 0, 0) 0.06%,
      var(--dark-color) 115.64%
    ),
    linear-gradient(
      359.91deg,
      rgba(0, 0, 0, 0.5) 75.34%,
      var(--dark-color) 99.95%
    );
  width: 100%;
  height: 100%;
  z-index: 1;
}

#firstSection .hero.hero-slider-layout .hero-slide .hero-slider-image {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
}

#firstSection .hero.hero-slider-layout .hero-slide .hero-slider-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#firstSection .hero.hero-slider-layout .hero-pagination {
  position: absolute;
  bottom: 30px;
  text-align: center;
  z-index: 2;
}

#firstSection
  .hero.hero-slider-layout
  .hero-pagination
  .swiper-pagination-bullet {
  width: 12px;
  height: 12px;
  background: var(--primary-color);
  opacity: 1;
  transition: all 0.3s ease-in-out;
  margin: 0 5px;
}

#firstSection
  .hero.hero-slider-layout
  .hero-pagination
  .swiper-pagination-bullet-active {
  background-color: var(--accent-color);
}

#firstSection .hero-content,
#firstSection .hero-images {
  position: relative;
  z-index: 2;
}

#firstSection .hero-content-body {
  display: flex !important;
  margin-left: 0;
  align-items: start;
  flex-wrap: wrap !important;
  gap: 70px !important;
}

#firstSection .hero-review-box {
  position: relative;
  width: calc(45% - 35px);
}

#firstSection .hero-review-box::before {
  content: "";
  position: absolute;
  top: 50%;
  bottom: 0;
  right: 0;
  height: 100%;
  width: 1px;
  transform: translate(35px, -50%);
  background: var(--divider-color);
}

#firstSection .hero-review-box h2 {
  font-size: 16px;
  font-weight: 400;
  line-height: normal;
  display: flex;
  align-items: center;
  margin-bottom: 20px;
}

#firstSection .hero-review-box h2 span {
  width: 100px;
  font-size: 50px;
  font-weight: 700;
}

#firstSection .hero-get-started-content {
  width: calc(55% - 35px);
}

#firstSection .hero-review-star {
  margin-bottom: 20px;
}

#firstSection .hero-review-star i {
  font-size: 20px;
  color: var(--accent-color);
}

#firstSection .hero-review-box p {
  font-size: 30px;
  margin: 0;
}

#firstSection .hero-get-started-content p {
  font-size: 30px;
  margin-bottom: 30px;
}

#firstSection .hero-get-started-content a {
  display: inline-block;
}

#firstSection .hero-get-started-content a img {
  width: 100%;
  max-width: 120px;
  animation: infiniterotate 30s infinite linear;
}

@keyframes infiniterotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

#firstSection .hero-images {
  position: relative;
  display: flex;
  gap: 30px;
  margin-left: 30px;
}

#firstSection .hero-image-box {
  width: calc(50% - 15px);
}

#firstSection .hero-img-1 figure,
#firstSection .hero-img-2 figure,
#firstSection .hero-img-3 figure {
  display: block;
}

#firstSection .hero-img-1 img,
#firstSection .hero-img-2 img,
#firstSection .hero-img-3 img {
  width: 100%;
  object-fit: cover;
}

#firstSection .hero-img-1 figure {
  border-radius: 40px 0 0 40px;
}

#firstSection .hero-img-1 img {
  aspect-ratio: 1 / 1.789;
  border-radius: 40px 0 0 40px;
}

#firstSection .hero-img-2 {
  margin-bottom: 30px;
}

#firstSection .hero-img-2 figure,
#firstSection .hero-img-2 img {
  border-radius: 0 40px 0 0;
}

#firstSection .hero-img-3 figure,
#firstSection .hero-img-3 img {
  border-radius: 0 0 40px 0;
}

#firstSection .hero-img-2 img,
#firstSection .hero-img-3 img {
  aspect-ratio: 1 / 0.84;
}

#firstSection .hero-circle {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

#firstSection .hero-circle a {
  display: inline-block;
}

#firstSection .hero-circle img {
  width: 100%;
  max-width: 160px;
  animation: infiniterotate 30s infinite linear;
}

#sliderSection .our-testimonial {
  position: relative;
  padding: 80px 0;
}

#sliderSection .our-testimonial::before {
  content: "";
  display: block;
  position: absolute;
  right: -60px;
  bottom: 10%;
  background: url(../images/section-bg-shape-6.png) no-repeat;
  background-position: right bottom;
  background-size: contain;
  opacity: 70%;
  width: 306px;
  height: 304px;
  animation: roundrotate 10s infinite linear alternate;
  z-index: -1;
}

#sliderSection .mf-slider .swiper-wrapper {
  cursor: none;
}

#sliderSection .testimonial-item {
  position: relative;
  background: url("../images/testimonial-item-bg-shape.svg");
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
  border: 1px solid var(--divider-color);
  border-radius: 30px;
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  border-radius: 30px;
  overflow: hidden;
}

#sliderSection .testimonial-item::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--secondary-color);
  opacity: 40%;
  width: 100%;
  height: 100%;
  z-index: -1;
}

#sliderSection .testimonial-header {
  border-bottom: 1px solid var(--divider-color);
  padding: 35px;
}

#sliderSection .testimonial-content {
  margin-bottom: 30px;
}

#sliderSection .testimonial-content p {
  margin: 0;
}

#sliderSection .testimonial-author {
  display: flex;
  align-items: center;
}

#sliderSection .author-image {
  margin-right: 20px;
}

#sliderSection .author-image figure {
  border-radius: 50%;
}

#sliderSection .author-image img {
  max-width: 50px;
  border-radius: 50%;
}

#sliderSection .author-content {
  width: calc(100% - 70px);
}

#sliderSection .author-content h3 {
  font-size: 22px;
  text-transform: capitalize;
  margin-bottom: 5px;
}

#sliderSection .author-content p {
  text-transform: capitalize;
  margin: 0;
}

#sliderSection .testimonial-body {
  display: flex;
  align-items: center;
  padding: 35px;
}

#sliderSection .testimonial-counter {
  width: calc(100% - 50px);
}

#sliderSection .testimonial-counter h2 {
  font-size: 40px;
  margin-bottom: 5px;
}

#sliderSection .testimonial-counter p {
  text-transform: capitalize;
  margin: 0;
}

#sliderSection .testimonial-quote {
  margin-left: 20px;
}

#sliderSection .testimonial-quote img {
  max-width: 30px;
}

#sliderSection .mf-slider .testimonial-pagination {
  position: relative;
  margin-top: 50px;
  text-align: center;
}

#sliderSection .mf-slider .testimonial-pagination .swiper-pagination-bullet {
  position: relative;
  height: 8px;
  width: 8px;
  background: var(--accent-color);
  opacity: 1;
  margin: 0 8px;
  transition: all 0.3s ease-in-out;
}

#sliderSection
  .mf-slider
  .testimonial-pagination
  .swiper-pagination-bullet:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: 0;
  width: 0;
  border-radius: 50%;
  transition: all 0.3s ease-in-out;
}

#sliderSection
  .mf-slider
  .testimonial-pagination
  .swiper-pagination-bullet-active {
  background: var(--accent-color);
}

#sliderSection
  .mf-slider
  .testimonial-pagination
  .swiper-pagination-bullet-active:before {
  border: 1px solid var(--accent-color);
  height: 20px;
  width: 20px;
}

#sliderSection .section-row {
  position: relative;
  padding-bottom: 60px;
  margin-bottom: 60px;
}

#sliderSection .section-row::before {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: 15px;
  right: 0;
  background: var(--primary-color);
  opacity: 20%;
  height: 1px;
  width: calc(100% - 30px);
}

#sliderSection .section-row .section-title {
  width: 100%;
  max-width: 605px;
  margin-bottom: 0;
}

.section-btn {
  text-align: right;
}

.mf-card-p {
  font-size: 18px !important;
  font-weight: 500 !important;
}

/* mf scroll */

.swiper-whychoose {
  height: 500px; /* Adjust as needed to show ~6 cards */
  overflow: hidden;
}

.swiper-whychoose .swiper-slide {
  padding: 15px;
  /* background-color: #fff; */
  border: 1px solid #eee;
  margin-bottom: 10px;
}

#mfSection .why-choose-us {
  position: relative;
  padding: 80px 0;
}

#mfSection .why-choose-image {
  width: 100%;
}

#mfSection .section-title {
  max-width: 100%;
}

#mfSection .why-choose-us::before {
  content: "";
  display: block;
  position: absolute;
  right: -90px;
  top: 50%;
  background: url(../images/why-choose-bg-shape.png) no-repeat;
  background-position: left center;
  background-size: contain;
  opacity: 50%;
  width: 310px;
  height: 325px;
  animation: circlezoomrotate 10s infinite linear;
  animation-direction: alternate;
  z-index: -1;
}

@keyframes circlezoomrotate {
  from {
    transform: rotate(0deg) scale(0.5);
  }
  to {
    transform: rotate(360deg) scale(1);
  }
}

#mfSection .why-choose-content {
  margin-right: 30px;
}

#mfSection .why-choose-item {
  position: relative;
  border: 1px solid var(--divider-color);
  border-radius: 20px;
  overflow: hidden;
  margin-bottom: 30px;
  padding: 25px 30px;
}

#mfSection .why-choose-item:last-child {
  margin-bottom: 0;
}

#mfSection .why-choose-item::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0.1) 50%,
    rgba(0, 0, 0, 0) 100%
  );
  width: 0;
  height: 100%;
  transition: all 0.4s ease-in-out;
}

#mfSection .why-choose-item.active:before,
#mfSection .why-choose-item:hover:before {
  width: 100%;
}

#mfSection .why-choose-item h3 {
  font-size: 22px;
  text-transform: capitalize;
  margin-bottom: 10px;
}

#mfSection .why-choose-item p {
  margin: 0;
}

#mfSection .why-choose-image figure {
  display: block;
  border-radius: 30px;
  overflow: hidden;
}

#mfSection .why-choose-image img {
  width: 100%;
  aspect-ratio: 1 / 0.93;
  object-fit: cover;
  border-radius: 30px;
}

/* pms */

#pmsSection {
  position: relative;
  padding: 100px 0 30px;
}
#pmsSection::before {
  background: url(../images/rupee3d.png) no-repeat;
}

#pmsSection .why-choose-us::before {
  content: "";
  display: block;
  position: absolute;
  right: -70px;
  top: 200px;
  background: url(../images/section-bg-shape-3.png) no-repeat;
  background-position: right center;
  background-size: contain;
  opacity: 50%;
  width: 307px;
  height: 307px;
  animation: roundrotate 10s infinite linear;
  animation-direction: alternate;
  z-index: -1;
}

#pmsSection .why-choose-boxes {
  display: flex;
  /* flex-wrap: wrap; */
  /* gap: 20px; */
  /* justify-content: center; */
  align-items: center;
}

#pmsSection .why-choose-counter {
  position: relative;
  width: calc(50% - 15px);
  height: auto;
  background: url(../images/why-choose-counter-bg.svg) no-repeat;
  background-position: top left;
  background-size: auto;
  border: 1px solid var(--divider-color);
  border-radius: 30px;
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  padding: 40px;
  transition: all 0.4s ease-in-out;
  overflow: hidden;
}

#pmsSection .why-choose-counter::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  /* background: var(--secondary-color); */
  background: #363636;
  opacity: 40%;
  z-index: -1;
}

#pmsSection .why-choose-counter.why-choose-counter-img {
  background: transparent;
  padding: 0;
  overflow: hidden;
  display: block;
}

#pmsSection .why-choose-counter.why-choose-counter-img img {
  width: 100%;
  height: 100%;
  aspect-ratio: 1 / 0.9886;
  object-fit: cover;
  border-radius: 30px;
}

#pmsSection .why-choose-counter-title {
  margin-bottom: 45px;
}

#pmsSection .why-choose-counter-title h3 {
  display: inline-block;
  position: relative;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--primary-color);
  padding-left: 24px;
}

#pmsSection .why-choose-counter-title h3::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  background: url(../images/dots.png) no-repeat;
  background-position: left center;
  background-size: cover;
  width: 16px;
  height: 16px;
}

#pmsSection .why-choose-counter-content h2 {
  font-size: 60px;
  color: var(--accent-color);
  margin-bottom: 20px;
}

#pmsSection .why-choose-counter-content p {
  margin: 0;
}

#pmsSection .why-choose-image figure {
  display: block;
  border-radius: 30px;
  overflow: hidden;
}

#pmsSection .why-choose-image img {
  border-radius: 30px;
  aspect-ratio: 1 / 2.033;
  object-fit: cover;
}
#pmsSection .why-choose-image {
  width: 100%;
}

#viewmore {
  padding: 10px 10px;
}

@media (max-width: 768px) {
  .why-choose-box {
    flex-direction: column;
  }
  .why-choose-us-content {
    width: 100%;
  }
  .why-choose-image {
    width: 100%;
    flex-direction: column;
  }
  .why-choose-img {
    width: 100%;
  }
  .why-choose-list {
    width: 100%;
  }
  #pmsSection .why-choose-boxes {
    flex-direction: column;
  }
  #pmsSection .why-choose-counter {
    width: 100%;
  }
  .service-item-box {
    flex-direction: column;
    padding: 10px;
  }
  .services-content-list {
    width: 100%;
  }
}

/* news */

#news::before {
  background: url(../images/graph_3dFirst.png);
  content: "";
  display: block;
  position: absolute;
  left: -70px;
  top: 50%;

  background-position: left center;
  background-size: contain;
  opacity: 70%;
  width: 306px;
  height: 304px;
  animation: circlerotate 20s infinite linear;
  z-index: -1;
}

#news .our-testimonial {
  position: relative;
  padding: 80px 0;
}

#news .our-testimonial::before {
  content: "";
  display: block;
  position: absolute;
  left: -50px;
  top: 100px;
  background: url(../images/section-bg-shape-6.png) no-repeat;
  background-position: left center;
  background-size: contain;
  opacity: 50%;
  width: 286px;
  height: 286px;
  animation: ringrotate 15s infinite linear;
  animation-direction: alternate;
  z-index: -1;
}

#news .testimonial-review-box {
  position: relative;
  width: 100%;
  border: 1px solid var(--divider-color);
  border-radius: 30px;
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  text-align: center;
  overflow: hidden;
  padding: 50px;
}

#news .testimonial-review-box::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: var(--secondary-color);
  opacity: 40%;
  z-index: -1;
}

#news .testimonial-review-header {
  margin-bottom: 30px;
}

#news .testimonial-review-counter-title {
  margin-bottom: 20px;
}

#news .testimonial-review-header h2 {
  font-size: 80px;
}

#news .testimonial-review-image {
  display: flex;
  align-items: center;
  justify-content: center;
}

#news .satisfy-client-images {
  margin-right: 20px;
}

#news .satisfy-client-image {
  display: inline-block;
  margin-left: -14px;
  border: 1px solid var(--dark-color);
  border-radius: 50%;
  overflow: hidden;
}

#news .satisfy-client-image:first-child {
  margin: 0;
}

#news .satisfy-client-image figure {
  display: block;
}

#news .satisfy-client-image img {
  max-width: 40px;
}

#news .satisfy-client-content p {
  text-align: left;
  margin: 0;
}

#news .testimonial-review-content {
  margin-bottom: 30px;
}

#news .testimonial-review-content h3 {
  font-size: 22px;
}

#news .news {
  position: relative;
  border: 1px solid var(--divider-color);
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  border-radius: 30px;
  padding: 50px;
  overflow: hidden;
}

#news .news::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: var(--secondary-color);
  opacity: 40%;
  z-index: -1;
}

#news .news .swiper-wrapper {
  cursor: none;
}

#news .testimonial-item {
  position: relative;
}

#news .testimonial-item::before {
  content: "";
  position: absolute;
  width: 1px;
  height: 100%;
  top: 0;
  right: -30px;
  bottom: 0;
  left: auto;
  background: var(--divider-color);
}

#news .testimonial-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 30px;
}

#news .testimonial-company-logo img {
  max-width: 130px;
  max-height: 30px;
}

#news .testimonial-quote {
  text-align: end;
}

#news .testimonial-quote img {
  max-width: 30px;
}

#news .testimonial-content {
  margin-bottom: 30px;
}

#news .testimonial-content p {
  opacity: 80%;
  margin-bottom: 0;
}

#news .testimonial-content img {
  margin-bottom: 15px;
  width: 100%;
  height: 200px;
  border-radius: 20px;
}

#news .testimonial-body {
  display: flex;
  align-items: center;
  gap: 20px;
}

#news .author-content {
  width: calc(60% - 10px);
}

#news .author-content h3 {
  font-size: 22px;
  text-transform: capitalize;
  margin-bottom: 5px;
}

#news .author-content p {
  text-transform: capitalize;
  margin: 0;
}

#news .testimonial-rating {
  width: calc(40% - 10px);
  text-align: end;
}

#news .testimonial-rating i {
  font-size: 14px;
  color: var(--accent-color);
  margin-right: 2px;
}

#news .testimonial-rating i:last-child {
  margin-right: 0;
}

#news .news .testimonial-pagination {
  position: relative;
  margin-top: 30px;
  text-align: center;
}

#news .news .testimonial-pagination .swiper-pagination-bullet {
  position: relative;
  height: 6px;
  width: 6px;
  background: var(--accent-color);
  opacity: 1;
  margin: 0 6px;
  transition: all 0.3s ease-in-out;
}

#news .news .testimonial-pagination .swiper-pagination-bullet:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: 0;
  width: 0;
  border-radius: 50%;
  transition: all 0.3s ease-in-out;
}

#news .news .testimonial-pagination .swiper-pagination-bullet-active {
  background: var(--accent-color);
}

#news .news .testimonial-pagination .swiper-pagination-bullet-active:before {
  border: 1px solid var(--accent-color);
  height: 14px;
  width: 14px;
}

#news .agency-supports-slider {
  margin-top: 60px;
}

#news .agency-supports-logo {
  position: relative;
  border: 1px solid var(--divider-color);
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  border-radius: 10px;
  text-align: center;
  padding: 25px 30px;
}

#news .agency-supports-logo::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  background: var(--secondary-color);
  opacity: 40%;
  width: 100%;
  height: 100%;
  z-index: 0;
}

#news .agency-supports-logo img {
  position: relative;
  max-height: 30px;
  z-index: 1;
}

/* research */

#research::before {
  background: url(../images/graph_3dSecond.png);
  content: "";
  display: block;
  position: absolute;
  left: -70px;
  top: 50%;
  /* background: url(../images/Graph_3dThird.png) no-repeat; */
  background-position: left center;
  background-size: contain;
  opacity: 70%;
  width: 306px;
  height: 304px;
  animation: circlerotate 20s infinite linear;
  z-index: -1;
}

#research .our-testimonial {
  position: relative;
  padding: 80px 0;
}

#research .our-testimonial::before {
  content: "";
  display: block;
  position: absolute;
  left: -50px;
  top: 100px;
  background: url(../images/section-bg-shape-6.png) no-repeat;
  background-position: left center;
  background-size: contain;
  opacity: 50%;
  width: 286px;
  height: 286px;
  animation: ringrotate 15s infinite linear;
  animation-direction: alternate;
  z-index: -1;
}

#research .testimonial-review-box {
  position: relative;
  width: 100%;
  border: 1px solid var(--divider-color);
  border-radius: 30px;
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  text-align: center;
  overflow: hidden;
  padding: 50px;
}

#research .testimonial-review-box::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: var(--secondary-color);
  opacity: 40%;
  z-index: -1;
}

#research .testimonial-review-header {
  margin-bottom: 30px;
}

#research .testimonial-review-counter-title {
  margin-bottom: 20px;
}

#research .testimonial-review-header h2 {
  font-size: 80px;
}

#research .testimonial-review-image {
  display: flex;
  align-items: center;
  justify-content: center;
}

#research .satisfy-client-images {
  margin-right: 20px;
}

#research .satisfy-client-image {
  display: inline-block;
  margin-left: -14px;
  border: 1px solid var(--dark-color);
  border-radius: 50%;
  overflow: hidden;
}

#research .satisfy-client-image:first-child {
  margin: 0;
}

#research .satisfy-client-image figure {
  display: block;
}

#research .satisfy-client-image img {
  max-width: 40px;
}

#research .satisfy-client-content p {
  text-align: left;
  margin: 0;
}

#research .testimonial-review-content {
  margin-bottom: 30px;
}

#research .testimonial-review-content h3 {
  font-size: 22px;
}

#research .news {
  position: relative;
  border: 1px solid var(--divider-color);
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  border-radius: 30px;
  padding: 50px;
  overflow: hidden;
}

#research .news::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: var(--secondary-color);
  opacity: 40%;
  z-index: -1;
}

#research .news .swiper-wrapper {
  cursor: none;
}

#research .testimonial-item {
  position: relative;
}

#research .testimonial-item::before {
  content: "";
  position: absolute;
  width: 1px;
  height: 100%;
  top: 0;
  right: -30px;
  bottom: 0;
  left: auto;
  background: var(--divider-color);
}

#research .testimonial-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 30px;
}

#research .testimonial-company-logo img {
  max-width: 130px;
  max-height: 30px;
}

#research .testimonial-quote {
  text-align: end;
}

#research .testimonial-quote img {
  max-width: 30px;
}

#research .testimonial-content {
  margin-bottom: 30px;
}

#news .testimonial-content p {
  opacity: 80%;
  margin-bottom: 0;
}

#research .testimonial-content img {
  margin-bottom: 15px;
  width: 100%;
  height: 250px;
  border-radius: 20px;
}

#research .testimonial-body {
  display: flex;
  align-items: center;
  gap: 20px;
}

#research .author-content {
  /* width: calc(60% - 10px); */
  width: 90%;
}

#research .testimonial-content p {
  font-size: 20px;
  font-weight: 500;
}

#news .author-content h3 {
  font-size: 22px;
  text-transform: capitalize;
  margin-bottom: 5px;
}

#research .author-content p {
  text-transform: capitalize;
  margin: 0;
}

#news .testimonial-rating {
  width: calc(40% - 10px);
  text-align: end;
}

#research .testimonial-rating i {
  font-size: 14px;
  color: var(--accent-color);
  margin-right: 2px;
}

#research .testimonial-rating i:last-child {
  margin-right: 0;
}

#research .news .testimonial-pagination {
  position: relative;
  margin-top: 30px;
  text-align: center;
}

#research .news .testimonial-pagination .swiper-pagination-bullet {
  position: relative;
  height: 6px;
  width: 6px;
  background: var(--accent-color);
  opacity: 1;
  margin: 0 6px;
  transition: all 0.3s ease-in-out;
}

#research .news .testimonial-pagination .swiper-pagination-bullet:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: 0;
  width: 0;
  border-radius: 50%;
  transition: all 0.3s ease-in-out;
}

#research .news .testimonial-pagination .swiper-pagination-bullet-active {
  background: var(--accent-color);
}

#research
  .news
  .testimonial-pagination
  .swiper-pagination-bullet-active:before {
  border: 1px solid var(--accent-color);
  height: 14px;
  width: 14px;
}

#research .agency-supports-slider {
  margin-top: 60px;
}

#research .agency-supports-logo {
  position: relative;
  border: 1px solid var(--divider-color);
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  border-radius: 10px;
  text-align: center;
  padding: 25px 30px;
}

#research .agency-supports-logo::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  background: var(--secondary-color);
  opacity: 40%;
  width: 100%;
  height: 100%;
  z-index: 0;
}

#research .agency-supports-logo img {
  position: relative;
  max-height: 30px;
  z-index: 1;
}

#firstHeading h1 {
  font-size: 56px;
}

#firstHeading {
  margin-bottom: 20px;
}
/* cards api */

.our-services {
  position: relative;
  padding: 80px 0 0;
}

.our-services::before {
  content: "";
  display: block;
  position: absolute;
  right: -80px;
  bottom: 10%;
  background: url(../images/section-bg-shape-2.png) no-repeat;
  background-position: right bottom;
  background-size: contain;
  opacity: 50%;
  width: 264px;
  height: 274px;
  animation: circlezoomrotate 10s infinite linear;
  animation-direction: alternate;
  z-index: -1;
}

@keyframes circlezoomrotate {
  from {
    transform: translateY(0) rotate(0deg) scale(0.7);
  }
  to {
    transform: translateY(-100%) rotate(360deg) scale(1);
  }
}

.our-service-image figure {
  display: block;
  border-radius: 30px;
}

.our-service-image img {
  width: 100%;
  aspect-ratio: 1 / 1.5;
  object-fit: cover;
  border-radius: 30px;
}

.service-boxes {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}

.service-item {
  position: relative;
  width: calc(50% - 15px);
  background: url(../images/service-item-bg-shape.svg) no-repeat;
  background-position: top center;
  background-size: auto;
  border: 1px solid var(--divider-color);
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  border-radius: 30px;
  display: flex;
  padding: 40px;
  overflow: hidden;
  transition: all 0.3s ease-in-out;
}

.service-item:hover {
  transform: translateY(-3px);
}

.service-item::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--secondary-color);
  opacity: 40%;
  height: 100%;
  width: 100%;
  z-index: -1;
}

.service-item .icon-box {
  margin-right: 30px;
}

.service-item .icon-box img {
  max-width: 40px;
  transition: all 0.4s ease-in-out;
}

.service-item:hover .icon-box img {
  transform: rotateY(180deg);
}

.service-item-content {
  width: calc(100% - 70px);
}

.service-item-content h3 {
  font-size: 22px;
  text-transform: capitalize;
  margin-bottom: 25px;
}

.service-item-content p {
  margin-bottom: 25px;
}

.service-footer {
  text-align: center;
  margin-top: 60px;
}

.service-footer p {
  color: var(--white-color);
  margin: 0;
}

.service-footer p span {
  background-color: var(--accent-color);
  font-weight: 500;
  color: var(--dark-color);
  border-radius: 100px;
  padding: 1px 10px;
  margin-right: 10px;
}

.service-footer a {
  font-weight: 700;
  text-decoration: underline;
  color: var(--accent-color);
  transition: all 0.3s ease-in-out;
}

.service-footer a:hover {
  color: var(--primary-color);
}

.readmore-btn {
  position: relative;
  display: inline-block;
  font-size: 16px;
  font-weight: 700;
  line-height: normal;
  text-transform: capitalize;
  color: var(--accent-color);
  padding-right: 30px;
  border: none;
}

.readmore-btn:hover {
  color: var(--primary-color);
}

.readmore-btn::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  background-image: url(../images/arrow-accent.svg);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  width: 25px;
  height: 25px;
  transform: translateY(-50%);
  transition: all 0.3s ease-in-out;
}

.readmore-btn:hover::before {
  filter: brightness(0) invert(1);
  transform: translateY(-50%) rotate(45deg);
}

#cardApi {
  margin-right: 0;
  float: left;
}

#chaturAI-p {
  font-size: 20px;
}

/* Floating Bar */
.talk_analysts {
  position: fixed;
  top: 50%;
  left: -75px;
  transform: translateY(-50%);

  height: auto;
  /* background: #333; */
  color: white;
  display: flex;
  align-items: center;
  padding: 15px;
  border-radius: 10px 0 0 10px;
  cursor: pointer;
  transition: width 0.3s ease-in-out;
  overflow: hidden;
  white-space: nowrap;
  z-index: 100;

  transform: rotateZ(-90deg);
  gap: 20px;
}

/* Floating Bar */
.floating-bar {
  position: fixed;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  width: 50px;
  height: auto;
  /* background: #333; */
  color: white;
  display: flex;
  align-items: center;
  padding: 15px;
  border-radius: 10px 0 0 10px;
  cursor: pointer;
  transition: width 0.3s ease-in-out;
  overflow: hidden;
  white-space: nowrap;
  z-index: 10;
  gap: 20px;
}

.floating-bar.expanded {
  width: 325px;
  justify-content: space-between;
  padding: 15px;
}

.floating-bar img {
  width: 20px;
  height: auto;
}

.floating-bar .bar-content {
  flex-grow: 1;
  text-align: center;
  display: none;
}

.floating-bar.expanded .bar-content {
  display: block;
}

@media screen and (max-width: 600px) {
  .floating-bar {
    display: none;
  }
}

.expanded-links {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 10px;
  font-size: 24px;
  text-transform: uppercase;
}

.expanded-links a {
  color: white;
  text-decoration: none;
  background: #e95b25;
  padding: 10px;
  border-radius: 5px;
  text-align: center;
}

.expanded-links a:hover {
  background: #d14820;
}

/* Popups */
.expanded-popup {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

.expanded-popup-content {
  background: #1e1e1e;
  padding: 20px;
  border-radius: 10px;
  width: 98%;
  height: max-content;
  max-width: 100%;
  text-align: center;
  position: relative;
}
.inside-popup-container {
  display: flex;
  justify-content: space-between;
  align-items: start;
}
.inside-popup {
  display: flex;
  /* flex-direction: column; */
  gap: 0px;
  margin-bottom: 20px;
}
.main-letter {
  font-size: 30px;
}
.main-letter.distribution {
  color: #f5801f;
}
.letter-content {
  /* border: 2px solid #ccc; */
  /* box-shadow: 0px 0px 5px #cc7851; */
  padding: 5px 2px;
  border-radius: 10px;
}

.letter-content.d-text {
  color: #f5801f;
}

.main-letter.research,
.letter-content.r-text {
  color: #ffcc00;
}
.main-letter.execution,
.letter-content.e-text {
  color: #8bc34a;
}
.main-letter.advisory,
.letter-content.a-text {
  color: #458de9;
}
.main-letter.management,
.letter-content.m-text {
  color: #e94560;
}
.letter-content-container {
  font-size: 16px;
  display: flex;
  justify-content: space-evenly;
  /* gap: 40px; */
  margin-top: 20px;
  flex-direction: column;
  align-items: start;
}
.inside-popup {
  color: #fff;
}

.expanded-close-btn {
  position: absolute;
  top: 10px;
  right: 15px;
  background: none;
  border: none;
  font-size: 40px;
  cursor: pointer;
  color: #fff;
  z-index: 10;
}

/* why choose us */

#choose .our-brands {
  padding: 80px 0;
}

#choose .our-brands-box {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 30px;
  border: 1px solid var(--divider-color);
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  border-radius: 30px;
  padding: 80px 80px 80px;
  overflow: hidden;
}

#choose .our-brands-box::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--secondary-color);
  opacity: 40%;
  height: 100%;
  width: 100%;
  z-index: -1;
}

#choose .our-brand-contant {
  width: calc(30% - 15px);
}

#choose .our-brand-list {
  width: calc(70% - 15px);
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}

#choose .brand-list-item {
  position: relative;
  width: calc(33.33% - 20px);
  text-align: center;
  padding: 80px 15px 40px;
}

#choose .brand-list-item::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(
    360deg,
    var(--accent-color) -20.74%,
    var(--dark-color) 106.06%
  );
  height: 0;
  width: 100%;
  transition: all 0.4s ease-in-out;
  z-index: -1;
}

#choose .brand-list-item.active:before,
#choose .brand-list-item:hover::before {
  height: 100%;
  border-radius: 0 0 30px 30px;
}

#choose .brand-list-item .icon-box {
  position: relative;
  background-color: var(--accent-color);
  height: 100px;
  width: 100px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  border-radius: 100%;
  margin-bottom: 30px;
  overflow: hidden;
}

#choose .brand-list-item .icon-box img {
  position: relative;
  max-width: 50px;
  z-index: 1;
}

#choose .brand-item-content h3 {
  font-size: 22px;
  margin-bottom: 20px;
}

#choose .brand-item-content p {
  margin: 0;
}

#choose-container {
  max-width: 100%;
}

/* market movers */

.iconbox {
  position: relative;
  display: flex;
}

.iconbox-icon-wrap p {
  position: absolute;
  top: 5px;
  right: 10px;
  background-color: #ccc;
  color: #000;
  padding: 10px;
  border-radius: 10px;
}

.iconbox-icon-wrap .aum {
  position: absolute;
  bottom: 5px;
  right: 10px;
  background-color: #ccc;
  color: #000;
  padding: 10px;
  border-radius: 10px;
}

.iconbox-icon-wrap .numbers {
  background: none;
  color: greenyellow;
  position: static;
  padding: 0;
}

.numbers2 {
  background: none;
  color: rgb(11 196 11);
}

#iconbox2 {
  align-items: center;
  gap: 112px;
}
#iconbox3 {
  justify-content: end;
}
.iconbox-container {
  border: 1px solid #484848;
  padding: 10px 20px 0;
  border-radius: 20px;
  margin: 10px 10px;
  display: flex;
  height: 250px;
  flex-direction: column;
  justify-content: space-evenly;
  align-items: center;
}

#tradeNow {
  margin-right: 0;
}

.mf-btns-div {
  display: flex;
  margin-top: 20px;
  justify-content: space-between;
  align-items: center;
}

#mf-btns {
  padding-left: 15px;
  margin-right: 0;
}

/* our feature serve */

#serve .our-feature {
  position: relative;
  padding-bottom: 80px;
}

#serve .our-feature::before {
  content: "";
  display: block;
  position: absolute;
  right: -20px;
  top: 10%;
  background: url(../images/section-bg-shape-3.png) no-repeat;
  background-position: right center;
  background-size: cover;
  width: 250px;
  height: 250px;
  transform: translateY(-50%);
  opacity: 50%;
  animation: cuberotate 10s infinite linear;
  animation-direction: alternate;
  z-index: -1;
}

@keyframes cuberotate {
  from {
    transform: translateY(0) rotate(0deg);
  }
  to {
    transform: translateY(-90%) rotate(360deg);
  }
}

#serve .our-feature-box {
  position: relative;
  padding: 90px 90px 0px 90px;
  border-radius: 30px;
  background: linear-gradient(
    180deg,
    var(--accent-color) 0%,
    rgba(0, 0, 0, 0) 90.04%
  );
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

#serve .our-feature-box::before {
  content: "";
  position: absolute;
  left: 20px;
  top: 20px;
  border-radius: 16px;
  background: linear-gradient(
    180deg,
    var(--dark-color) 75%,
    rgba(0, 0, 0, 0) 99.04%
  );
  width: calc(100% - 40px);
  height: calc(100% - 20px);
}

#serve .feature-title-box,
.feature-content {
  position: relative;
  z-index: 1;
}

#serve .feature-title-box {
  display: flex;
  align-items: center;
  gap: 0 30px;
  flex-wrap: wrap;
}

#serve .feature-title-box .section-title {
  width: calc(75% - 15px);
}

#serve .feature-title-box .section-btn {
  width: calc(25% - 15px);
}

#serve .feature-list {
  display: flex;
  gap: 30px 100px;
  flex-wrap: wrap;
}

#serve .feature-list-item {
  position: relative;
  width: calc(24% - 66.67px);
}

#serve .feature-list-item::before {
  content: "";
  position: absolute;
  top: 0;
  right: -50px;
  bottom: 0;
  background-color: var(--divider-color);
  width: 1px;
  height: 100%;
}

#serve .feature-list-item:last-child:before,
.feature-list-item:nth-of-type(3n + 3):before {
  display: none;
}

#serve .feature-list-item .icon-box {
  margin-bottom: 20px;
}

#serve .feature-list-item .icon-box img {
  max-width: 100%;
  transition: all 0.4s ease-in-out;
}

#serve .feature-list-item:hover .icon-box img {
  transform: rotateY(180deg);
  /* filter: brightness(0) invert(1); */
}

#serve .feature-item-content h3 {
  font-size: 22px;
  text-transform: capitalize;
  margin-bottom: 15px;
  
}

#serve .feature-item-content p {
  margin-bottom: 0;
}

#serve .feature-content-footer {
  text-align: center;
  margin-top: 60px;
}

#serve .feature-content-footer p {
  margin: 0;
}

#serve .feature-content-footer p span {
  background-color: var(--accent-color);
  color: var(--dark-color);
  font-weight: 700;
  border-radius: 100px;
  padding: 2px 10px;
  margin-right: 10px;
}

#serve .feature-content-footer p a {
  color: var(--accent-color);
  font-weight: 600;
  text-transform: capitalize;
  text-decoration-line: underline;
  text-underline-position: from-font;
  transition: all 0.3s ease-in-out;
}

#serve .feature-content-footer p a:hover {
  color: var(--primary-color);
}

#serve {
  padding-bottom: 50px;
  padding-top: 40px;
}

.view-more-div {
  margin-left: 10px;
  margin-top: 10px;
}

.designed {
  margin-top: 0px !important;
}

@media screen and (max-width: 600px) {
  #serve .feature-list {
    flex-direction: column;
  }
  #serve .feature-list-item {
    width: 100%;
  }
  #serve .our-feature-box {
    padding: 90px 30px 0px 30px;
  }
}
#cagr-counter {
  margin-top: 70px;
}

/* chaturTrade */

#chaturTrade .our-services {
  padding: 80px 0;
}

#chaturTrade .our-services-content {
  position: sticky;
  top: 30px;
  margin-right: 30px;
}

#chaturTrade .service-list-item {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  border-bottom: 1px solid var(--divider-color);
  /* margin-bottom: 40px; */
  /* padding-bottom: 40px; */
}

#chaturTrade .service-list-item:last-child {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}

#chaturTrade .service-item {
  display: flex;
  width: calc(100% - 38px);
  margin-bottom: 0;
  border: none;
  border-radius: 0;
  backdrop-filter: none;
  background-color: black !important;
  background: #00000000;
}

#chaturTrade .service-item .icon-box {
  position: relative;
  height: 60px;
  width: 60px;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid var(--accent-color);
  border-radius: 50%;
  margin-right: 20px;
  transition: all 0.5s ease-in-out;
}

#chaturTrade .service-list-item:hover .service-item .icon-box {
  border-color: transparent;
}

#chaturTrade .service-item .icon-box::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--accent-color);
  border-radius: 50%;
  transform: scale(0);
  transition: all 0.4s ease-in-out;
}

#chaturTrade .service-list-item:hover .service-item .icon-box::before {
  transform: scale(1);
}

#chaturTrade .service-item .icon-box img {
  position: relative;
  max-width: 30px;
  transition: all 0.4s ease-in-out;
  z-index: 1;
}

#chaturTrade .service-list-item:hover .service-item .icon-box img {
  filter: brightness(0) invert(0);
}

#chaturTrade .service-list-content {
  width: calc(100% - 80px);
}

#chaturTrade .service-list-content h3 {
  /* font-size: 22px; */
  font-size: 24px;
  text-transform: capitalize;
  margin-bottom: 10px;
}

#chaturTrade .service-list-content p {
  margin: 0;
  font-size: 24px;
}

#chaturTrade .service-readmore-btn {
  margin-left: 20px;
}

#chaturTrade .service-readmore-btn a {
  display: inline-block;
}

#chaturTrade .service-readmore-btn a img {
  max-width: 18px;
  transition: all 0.4s ease-in-out;
}

#chaturTrade .service-readmore-btn a:hover img {
  transform: rotate(45deg);
}

#chatur-trade-h2 {
  /* font-size: 40px; */
  font-size: 24px;
  margin-left: 10px;
}

.partnericon {
  width: 60px;
}

#mtf-chatur-h2 {
  font-size: 40px;
  margin-left: 5px;
}

/* slbm */

#slbm {
  padding-bottom: 80px;
}

#slbm .our-awards {
  padding: 80px 0;
}

#slbm .our-awards-list {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}

#slbm .awards-list-item {
  width: calc(33.33% - 20px);
  position: relative;
  background: url(../images/awards-list-item-bg.svg) no-repeat;
  background-position: top left;
  background-size: auto;
  border: 1px solid var(--divider-color);
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  border-radius: 30px;
  padding: 30px 20px;
  overflow: hidden;
}

#slbm .awards-list-item::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--secondary-color);
  height: 100%;
  width: 100%;
  opacity: 40%;
  z-index: -1;
}

#slbm .award-item-content h3 {
  position: relative;
  font-size: 20px;
  text-transform: capitalize;
  margin-bottom: 20px;
  padding-left: 25px;
}

#slbm .award-item-content h3::before {
  content: "";
  position: absolute;
  top: 4px;
  left: 0;
  background: url(../images/dots.png) no-repeat;
  background-position: left center;
  background-size: cover;
  width: 18px;
  height: 18px;
}

#slbm .award-item-content h3 span {
  font-size: 16px;
  font-weight: 400;
  color: var(--accent-color);
}

#slbm .award-item-content p {
  margin-bottom: 0;
}

#slbm .award-item-btn {
  margin-top: 20px;
}

#slbm .award-item-btn a {
  display: inline-block;
}

#slbm .award-item-btn a img {
  max-width: 34px;
  transition: all 0.3s ease-in-out;
}

#slbm .award-item-btn a:hover img {
  filter: brightness(0) invert(1);
  transform: rotate(45deg);
}

.why-choose-us {
  position: relative;
  padding: 100px 0;
}

.why-choose-us::before {
  content: "";
  display: block;
  position: absolute;
  left: -20px;
  top: 80px;
  background: url(../images/section-bg-shape-2.png) no-repeat;
  background-position: left top;
  background-size: cover;
  width: 250px;
  height: 250px;
  opacity: 40%;
  animation: roundrotate 10s infinite linear;
  animation-direction: alternate;
  z-index: -1;
}

@keyframes roundrotate {
  0% {
    transform: translateY(0) rotate(0);
  }
  100% {
    transform: translateY(100%) rotate(360deg);
  }
}
#btst {
  padding: 180px 0 80px;
}
#btst .why-choose-content {
  /* margin-right: 30px; */
}

#btst .why-choose-body {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 30px;
}

#btst .why-choose-list {
  width: calc(54% - 15px);
  background: none;
}

#btst .why-choose-item {
  display: flex;
  border-bottom: 1px solid var(--divider-color);
  margin-bottom: 30px;
  padding-bottom: 30px;
}

#btst .why-choose-item:last-child {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}

#btst .why-choose-item .icon-box {
  margin-right: 20px;
}

#btst .why-choose-item .icon-box img {
  max-width: 40px;
  transition: all 0.3s ease-in-out;
}

#btst .why-choose-item:hover .icon-box img {
  transform: rotateY(180deg);
  filter: brightness(0) invert(1);
}

#btst .why-choose-item-content {
  width: calc(100% - 60px);
}

#btst .why-choose-item-content h3 {
  font-size: 22px;
  margin-bottom: 12px;
}

#btst .why-choose-item-content p {
  margin-bottom: 0;
}

#btst .why-choose-content-box {
  width: calc(46% - 15px);
  background-color: var(--accent-color);
  border-radius: 30px;
  padding: 30px;
}

#btst .why-choose-content-box p {
  color: var(--dark-color);
  margin-bottom: 30px;
}

#btst .why-choose-content-box ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

#btst .why-choose-content-box ul li {
  position: relative;
  color: var(--dark-color);
  text-transform: capitalize;
  line-height: normal;
  padding-left: 30px;
  margin-bottom: 20px;
}

#btst .why-choose-content-box ul li:last-child {
  margin-bottom: 0;
}

#btst .why-choose-content-box ul li::before {
  content: "\f192";
  font-family: "Font Awesome 6 Free";
  position: absolute;
  font-size: 18px;
  color: var(--dark-color);
  top: 2px;
  left: 0;
}

#btst .why-choose-image figure {
  display: block;
  border-radius: 30px;
}

#btst .why-choose-image img {
  width: 100%;
  aspect-ratio: 1 / 1.405;
  object-fit: cover;
  border-radius: 30px;
}

#btst .why-choose-image {
  width: 100%;
}

/* research reports */

#researchReports .our-services {
  padding: 80px 0;
}

#researchReports .our-services-nav {
  margin-bottom: 0px;
}

#researchReports .our-services-nav ul {
  list-style: none;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px 0;
  border-bottom: 2px solid var(--dark-divider-color);
  padding: 0 0 40px 0;
  margin: 0;
}

#researchReports .our-services-nav ul li {
  display: inline-block;
  width: 20%;
}

#researchReports .our-services-nav ul li .nav-link {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  background: transparent;
  border: none;
  color: var(--primary-color);
  font-size: 22px;
  font-weight: 700;
  line-height: 1.2em;
  padding: 0 5px;
  text-transform: capitalize;
  transition: all 0.3s ease-in-out;
}

#researchReports .our-services-nav ul li:last-child .nav-link {
  padding: 0;
}

#researchReports .our-services-nav ul li .nav-link .icon-box {
  position: relative;
  height: 60px;
  width: 60px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 10px;
  margin-bottom: 20px;
  overflow: hidden;
}

#researchReports .our-services-nav ul li .nav-link .icon-box::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: var(--primary-color);
  opacity: 20%;
  height: 100%;
  width: 100%;
  transition: all 0.3s ease-in-out;
}

#researchReports .our-services-nav ul li .nav-link.active .icon-box::before,
#researchReports .our-services-nav ul li .nav-link:hover .icon-box::before {
  background: var(--accent-color);
  opacity: 1;
}

#researchReports .our-services-nav ul li .nav-link.active,
#researchReports .our-services-nav ul li .nav-link:hover {
  background: transparent;
  color: var(--accent-color);
}

#researchReports .our-services-nav ul li .nav-link::before {
  content: "";
  display: block;
  position: absolute;
  bottom: -41px;
  left: auto;
  right: 0;
  background: var(--accent-color);
  width: 0;
  height: 2px;
  transition: all 0.4s ease-in-out;
}

#researchReports .our-services-nav ul li .nav-link.active:before,
#researchReports .our-services-nav ul li .nav-link:hover:before {
  width: 100%;
  left: 0;
  right: auto;
}

#researchReports .our-services-nav ul li .nav-link img {
  width: 100%;
  max-width: 30px;
  transition: all 0.4s ease-in-out;
}

#researchReports .our-services-nav ul li .nav-link.active .icon-box img,
#researchReports .our-services-nav ul li .nav-link:hover .icon-box img {
  filter: brightness(0) invert(0);
}

#researchReports .service-item-box {
  position: relative;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 60px;
  background: url(../images/service-item-box-shape.svg) no-repeat;
  background-position: top left;
  background-size: auto;
  border: 1px solid var(--divider-color);
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  border-radius: 30px;
  padding: 50px;
  overflow: hidden;
}

#researchReports .service-item-box::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: var(--secondary-color);
  opacity: 40%;
  z-index: -1;
}

#researchReports .services-content-list {
  width: calc(55% - 30px);
}

#researchReports .services-content-item {
  border-bottom: 1px solid var(--divider-color);
  margin-bottom: 30px;
  padding-bottom: 30px;
}

#researchReports .services-content-item:last-child {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}

#researchReports .services-content-item h3 {
  position: relative;
  font-size: 22px;
  padding-left: 30px;
  margin-bottom: 15px;
}

#researchReports .services-content-item h3::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  background: url(../images/icon-sub-heading.svg) no-repeat;
  background-position: left center;
  background-size: cover;
  width: 20px;
  height: 20px;
}

#researchReports .services-content-item p:last-child {
  margin-bottom: 0;
}

#researchReports .service-tab-image {
  width: calc(45% - 30px);
  border: 10px solid var(--divider-color);
  border-radius: 30px;
  padding: 35px 0 0 35px;
  overflow: hidden;
}

#researchReports .service-tab-image img {
  width: 100%;
  object-fit: cover;
  aspect-ratio: 1 / 0.964;
  border-radius: 30px 0 0 0;
}

.fundamental-box {
  margin-top: 30px;
  overflow-x: auto;
  background-color: #1a1a1a;
  padding: 20px;
  border-radius: 8px;
  width: 100%;
}

.fundamental-table {
  width: 100%;
  border-collapse: collapse;
  color: #fff;
}

.fundamental-table thead {
  /* background-color: #2a2a2a; */
}

.fundamental-table th,
.fundamental-table td {
  padding: 16px 12px;
  text-align: center;
  border-bottom: 1px solid #333;
}

.fundamental-table .company-cell {
  display: flex;
  align-items: center;
  gap: 10px;
  justify-content: center;
  flex-direction: column;
}

.fundamental-table .company-cell img {
  width: 40px;
  height: auto;
}

.fundamental-table .pdf-icon {
  width: 24px;
  height: auto;
}

.trade-btn,
.subscribe-btn {
  display: inline-block;
  padding: 10px 18px;
  color: #fff;
  background-color: #e25b2c;
  border-radius: 6px;
  font-weight: bold;
  text-decoration: none;
  transition: background-color 0.3s ease;
}

.trade-btn:hover,
.subscribe-btn:hover {
  background-color: #ff7043;
}

@media screen and (max-width: 600px) {
  .fundamental-table th,
  .fundamental-table td {
    padding: 12px 8px;
  }

  .fundamental-table .company-cell {
    flex-direction: column;
    text-align: center;
  }
}

.pms-cta-box {
  background: #111;
  padding: 30px 20px;
  border-radius: 10px;
  max-width: 700px;
  margin: 0 auto;
  box-shadow: 0 0 20px rgba(255, 255, 255, 0.05);
}

.pms-cta-form {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
  justify-content: center;
}

.pms-cta-input {
  flex: 1 1 200px;
  padding: 14px 18px;
  background: #1e1e1e;
  border: 1px solid #333;
  border-radius: 6px;
  color: #fff;
  font-size: 16px;
}

.pms-cta-input::placeholder {
  color: #aaa;
}

.pms-cta-btn {
  padding: 14px 30px;
  background-color: #f15a22;
  color: #fff;
  font-size: 16px;
  border: none;
  border-radius: 6px;
  font-weight: bold;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.pms-cta-btn:hover {
  background-color: #ff7043;
}

@media (max-width: 600px) {
  .pms-cta-form {
    flex-direction: column;
    align-items: stretch;
  }

  .pms-cta-input,
  .pms-cta-btn {
    width: 100%;
  }
}

/* faqs */

#faqs .our-faqs {
  position: relative;
  padding: 80px 0;
}

#faqs .our-faqs::before {
  content: "";
  display: block;
  position: absolute;
  left: -20px;
  bottom: 80px;
  background: url(../images/section-bg-shape-6.png) no-repeat;
  background-position: left bottom;
  background-size: cover;
  width: 250px;
  height: 250px;
  opacity: 40%;
  animation: circlerotate 10s infinite linear;
  animation-direction: alternate;
  z-index: -1;
}

#faqs .faqs-image {
  position: relative;
  margin-right: 30px;
}

#faqs .faqs-img figure {
  display: block;
  border-radius: 19px;
  overflow: hidden;
}

#faqs .faqs-img figure:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0) 42.01%,
    rgba(0, 0, 0, 0.9) 100%
  );
  width: 100%;
  height: 100%;
  z-index: 1;
}

#faqs .faqs-img img {
  width: 100%;
  aspect-ratio: 1 / 1.1;
  object-fit: cover;
  border-radius: 20px;
  transition: all 0.4s ease-in-out;
}

#faqs .faqs-image:hover .faqs-img img {
  transform: scale(1.05);
}

#faqs .faqs-image-content {
  position: absolute;
  right: 100px;
  bottom: 30px;
  left: 30px;
  z-index: 1;
}

#faqs .faqs-img-content-title {
  margin-bottom: 20px;
}

#faqs .faqs-img-content-title h3 {
  font-size: 30px;
  text-transform: capitalize;
}

#faqs .faq-cta-box {
  display: flex;
  align-items: center;
}

#faqs .faq-cta-box .icon-box {
  position: relative;
  width: 40px;
  height: 40px;
  background: var(--accent-color);
  border-radius: 50%;
  display: flex;
  align-items: center;
  margin-right: 20px;
  justify-content: center;
}

#faqs .faq-cta-box .icon-box::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--primary-color);
  height: 100%;
  width: 100%;
  border-radius: 50%;
  transform: scale(0);
  transition: all 0.4s ease-in-out;
  z-index: 0;
}

#faqs .faq-cta-box:hover .icon-box::before {
  transform: scale(1);
}

#faqs .faq-cta-box .icon-box img {
  position: relative;
  width: 100%;
  max-width: 18px;
  z-index: 1;
}

#faqs .faq-cta-content {
  width: calc(100% - 60px);
}

#faqs .faq-cta-content h3 {
  color: var(--accent-color);
  font-size: 22px;
  transition: all 0.4s ease-in-out;
}

#faqs .faq-cta-content h3 a {
  color: inherit;
}

#faqs .faq-cta-content h3:hover {
  color: var(--primary-color);
}

#faqs .faq-accordion .accordion-item {
  position: relative;
  background: var(--dark-color);
  border: 1px solid var(--divider-color);
  border-radius: 10px;
  margin-bottom: 30px;
  padding: 0;
  transition: all 0.3s ease-in-out;
  overflow: hidden;
}

#faqs .faq-accordion .accordion-item::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.15) 26.48%,
    rgba(0, 0, 0, 0) 155.74%
  );
  height: 100%;
  width: 100%;
  z-index: 0;
}

#faqs .faq-accordion .accordion-item:last-child {
  margin-bottom: 0;
}

#faqs .faq-accordion .accordion-header .accordion-button {
  font-size: 22px;
  font-weight: 600;
  line-height: 1.2em;
  background: var(--accent-color);
  color: var(--dark-color);
  padding: 17px 50px 17px 20px;
  transition: all 0.3s ease-in-out;
}

#faqs .faq-accordion .accordion-header .accordion-button.collapsed {
  background: var(--dark-color);
  color: var(--primary-color);
}

#faqs .faq-accordion .accordion-item .accordion-button::after,
#faqs .faq-accordion .accordion-item .accordion-button.collapsed::after {
  content: "\f068";
  font-family: "FontAwesome";
  position: absolute;
  right: 20px;
  top: 50%;
  bottom: auto;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 400;
  line-height: normal;
  width: 24px;
  height: 24px;
  color: var(--primary-color);
  background-color: var(--dark-color);
  border-radius: 50%;
}

#faqs .faq-accordion .accordion-item .accordion-button.collapsed::after {
  content: "\2b";
  background-color: var(--accent-color);
  color: var(--dark-color);
}

#faqs .faq-accordion .accordion-item .accordion-body {
  position: relative;
  padding: 20px 50px 17px 20px;
  z-index: 1;
}

#faqs .faq-accordion .accordion-item .accordion-body p {
  color: var(--primary-color);
  margin: 0;
}

/* equity first section */

#equityFirstSection .hero {
  position: relative;
  padding: 180px 0 0;
  display: flex;
  align-items: center;
}

#equityFirstSection .hero::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background:
    linear-gradient(0deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),
    linear-gradient(180.07deg, rgba(0, 0, 0, 0) 0.06%, #000000 116.27%),
    linear-gradient(359.91deg, rgba(0, 0, 0, 0) 55.58%, #000000 105.69%);
  height: 100%;
  width: 100%;
  z-index: 1;
}

#equityFirstSection .hero .hero-bg-video {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
}

#equityFirstSection .hero .hero-bg-video video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#equityFirstSection .hero.bg-image {
  background: url("../images/hero-bg.jpg") no-repeat;
  background-position: center center;
  background-size: cover;
  padding: 270px 0 190px;
}

#equityFirstSection .hero.bg-image.hero-slider-layout {
  background: none;
  padding: 0;
}

#equityFirstSection .hero.hero-slider-layout .hero-slide {
  position: relative;
  background: url("../images/hero-bg.jpg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  padding: 270px 0 190px;
}

#equityFirstSection .hero.hero-slider-layout .hero-slide.slide-2 {
  background: url("../images/hero-bg-2.jpg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

#equityFirstSection .hero.hero-slider-layout .hero-slide::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background:
    linear-gradient(0deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),
    linear-gradient(180.07deg, rgba(0, 0, 0, 0) 0.06%, #000000 116.27%),
    linear-gradient(359.91deg, rgba(0, 0, 0, 0) 55.58%, #000000 105.69%);
  width: 100%;
  height: 100%;
  z-index: 1;
}

#equityFirstSection .hero.hero-slider-layout .hero-slide .hero-slider-image {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
}

#equityFirstSection
  .hero.hero-slider-layout
  .hero-slide
  .hero-slider-image
  img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#equityFirstSection .hero.hero-slider-layout .hero-pagination {
  position: absolute;
  bottom: 30px;
  text-align: center;
  z-index: 2;
}

#equityFirstSection
  .hero.hero-slider-layout
  .hero-pagination
  .swiper-pagination-bullet {
  width: 12px;
  height: 12px;
  background: var(--primary-color);
  opacity: 1;
  transition: all 0.3s ease-in-out;
  margin: 0 5px;
}

#equityFirstSection
  .hero.hero-slider-layout
  .hero-pagination
  .swiper-pagination-bullet-active {
  background-color: var(--accent-color);
}

#equityFirstSection .hero-content {
  position: relative;
  width: 100%;
  max-width: 1100px;
  margin: 0 auto 80px;
  text-align: center;
  z-index: 2;
}

#equityFirstSection .hero.bg-image .hero-content {
  margin-bottom: 0;
}

#equityFirstSection .hero.bg-image .hero-content .section-title p {
  max-width: 800px;
  margin: 0 auto;
  margin-top: 20px;
}

#equityFirstSection .hero-content-body {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px 40px;
  margin-left: 150px;
}

#equityFirstSection .client-review-box {
  display: flex;
  gap: 20px;
  align-items: center;
}

#equityFirstSection .client-review-images {
  display: flex;
  align-items: center;
}

#equityFirstSection .client-review-image {
  display: inline-block;
  margin-left: -14px;
  overflow: hidden;
}

#equityFirstSection .client-review-image:first-child {
  margin: 0;
}

#equityFirstSection .client-review-image figure {
  display: block;
  width: 40px;
  height: 40px;
  border: 1px solid var(--dark-color);
  border-radius: 50%;
}

#equityFirstSection .client-review-image img {
  position: relative;
  width: 100%;
  z-index: 1;
}

#equityFirstSection .client-review-content p {
  text-transform: capitalize;
  margin: 0;
}

#equityFirstSection .client-review-content p span {
  color: var(--accent-color);
  font-weight: 600;
}

#equityFirstSection .excellence-software-box,
#equityFirstSection .hero-images,
#equityFirstSection .hero-counter-box {
  position: relative;
  text-align: center;
  z-index: 2;
}

#equityFirstSection .excellence-software-circle {
  border-bottom: 1px solid var(--divider-color);
  margin-bottom: 50px;
  padding-bottom: 50px;
}

#equityFirstSection .excellence-software-circle img {
  width: 100%;
  max-width: 180px;
  animation: excellencesoftwarerotate 25s infinite linear;
}

@keyframes excellencesoftwarerotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

#equityFirstSection .excellence-software-content p {
  margin: 0;
}

#equityFirstSection .hero-images {
  margin: 0 12px;
}

#equityFirstSection .hero-images figure {
  display: block;
  border-radius: 40px 40px 0 0;
}

#equityFirstSection .hero-images img {
  width: 100%;
  aspect-ratio: 1 / 0.836;
  object-fit: cover;
  border-radius: 40px 40px 0 0;
}

#equityFirstSection .hero-counter-item {
  border-bottom: 1px solid var(--divider-color);
  margin-bottom: 50px;
  padding-bottom: 50px;
}

#equityFirstSection .hero-counter-item:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
}

#equityFirstSection .hero-counter-item h2 {
  color: var(--accent-color);
  font-size: 60px;
  margin-bottom: 10px;
}

#equityFirstSection .hero-counter-item p {
  margin: 0;
}

#equity-first-h2 {
  font-size: 60px;
}

.download-p {
  font-size: 20px;
  margin: 0;
}

#equity-section-title {
  margin-bottom: 0;
}

/* deams section */

.investment-section {
  max-width: 800px;
  margin: auto;
  text-align: center;
  padding-top: 100px;
}

#index-investment {
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-left: 165px;
  margin-top: 15px;
}

.investment-tabs {
  display: flex;
  width: 100%;
  /* justify-content: center; */
  gap: 5px;
  /* border-bottom: 2px solid #ccc; */
  padding-bottom: 10px;
  height: 70px;
  padding-left: 0px;
}

.investment-tab {
  font-size: 18px;
  font-weight: bold;
  cursor: pointer;
  padding: 5px;
  transition: border-bottom 0.3s ease;
  color: #949494;
}

.investment-tab.active-tab {
  border-bottom: 2px solid white;

  background: none;
}

.investment-content {
  margin-top: 20px;
  display: flex;
  /* justify-content: center; */
  padding-left: 0px;
  height: 200px;
  width: 100%;
}

.content-box {
  display: none;
  font-size: 16px;
  animation: fadeIn 0.5s ease-in-out;
  text-align: left;
  max-width: 800px;
}
.active-content {
  display: block;
  /* or visibility: visible; */
}
.points-container {
  display: grid;
  grid-template-columns: repeat(4, 1fr); /* 2 columns */
  gap: 20px; /* Space between items */
}

#investment-index {
  margin: 0;
}

.point {
  /* background: white; */
  padding: 15px 10px;
  border-radius: 6px;
  text-align: center;
  line-height: 1.3;
  box-shadow: 0 2px 8px rgba(0, 0, 0);
  width: 165px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  background-color: #212121;
}

.point ul {
  padding: 0;
  margin-top: 10px;
}

.point ul li {
  color: #4fa3f7;
  font-size: 13px;
  list-style-type: disc;
  text-align: left;
}

.point h4 {
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 5px;
  color: #fff;
  line-height: 1.5;
}

.point p {
  font-size: 14px;
  color: #9a9999;
}

.big-text1 {
  font-size: 32px;
  color: #e95b25;
}
.big-text2 {
  font-size: 28px;
  color: #ffcc00;
}
.big-text3 {
  font-size: 28px;
  color: #8bc34a;
}
.big-text4 {
  font-size: 28px;
  color: #e94560;
}
.big-text5 {
  font-size: 28px;
  color: #fff;
}
.big-text6 {
  font-size: 28px;
  color: #458de9;
}

.d-content h4 {
  color: #e95b25;
}

.r-content h4 {
  color: #ffcc00;
}
.e-content h4 {
  color: #8bc34a;
}
.a-content h4 {
  color: #458de9;
}
.m-content h4 {
  color: #e94560;
}
.s-content h4 {
  color: #fff;
}

#equityFirstSection .agency-circle-arrow {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: 90px;
  width: 90px;
  background: var(--accent-color);
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease-in-out;
}

#equityFirstSection a:hover .agency-circle-arrow {
  background: var(--primary-color);
}

#equityFirstSection .agency-circle-arrow img {
  max-width: 38px;
  transition: all 0.4s ease-in-out;
}

#equityFirstSection a:hover .agency-circle-arrow img {
  transform: rotate(45deg);
}

#equityFirstSection .hero .our-agency-circle {
  text-align: center;
}

#equityFirstSection .our-agency-circle a {
  position: relative;
  display: inline-flex;
  z-index: 2;
}

#equityFirstSection .our-agency-circle a figure img {
  max-width: 200px;
  animation: agencycirclerotate 25s infinite linear;
}

@keyframes agencycirclerotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

#equityFirstSection .our-agency-circle .agency-circle-arrow {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: 90px;
  width: 90px;
  background: var(--accent-color);
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease-in-out;
}

#equityFirstSection .our-agency-circle a:hover .agency-circle-arrow {
  background: var(--primary-color);
}

#equityFirstSection .our-agency-circle .agency-circle-arrow img {
  max-width: 38px;
  transition: all 0.4s ease-in-out;
}

#equityFirstSection .our-agency-circle a:hover .agency-circle-arrow img {
  transform: rotate(45deg);
}

#account-form {
  position: fixed;
  bottom: 0;
  left: 50%;
  width: 85%;
  height: 60px;
  transform: translateX(-50%);
  background: linear-gradient(to right, #000000, #292929);
  color: #fff;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  border-radius: 15px;
  padding: 15px;
  z-index: 1000;
  opacity: 0;
  transition: opacity 0.3s ease-out;
}

#account-form-mobile {
  position: fixed;
  bottom: 0;
  left: 50%;
  width: 70%;
  height: 50px;
  transform: translateX(-50%);
  background: linear-gradient(to right, #e92828, #9e1a1a);
  color: #fff;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  border-radius: 5px;
  padding: 10px;
  z-index: 1000;
  opacity: 0;
  transition: opacity 0.3s ease-out;
}

#account-form h2 {
  font-size: 24px;
}
#close-btn {
  cursor: pointer;
  position: absolute;
  top: 10px;
  right: 10px;
  color: #fff;
  font-size: 20px;
}

#account-form .row {
  align-items: center;
  justify-content: space-evenly;
}

#account-form input {
  margin-top: 6px;
  height: 40px;
  padding: 10px;
  border-radius: 10px;
  border: none;
  width: 90%;
}
.btn-submit {
  background-color: #fff;
  color: #000;
  padding: 7px 15px;
  display: inline-block;
  height: 40px;
  width: 100%;
  border-radius: 10px;
}
@media (max-width: 767px) {
  #account-form {
    width: 90%; /* Adjust the width for smaller screens */
    padding: 10px; /* Adjust the padding for smaller screens */
    display: none;
  }

  /* Optionally, you can adjust other styles for better mobile presentation */
  #account-form h2 {
    font-size: 16px;
  }

  #account-form label {
    font-size: 18px;
  }

  #account-form input {
    width: 75%; /* Make the input take up the full width */
    margin-left: 20px;
  }
  #account-form #mobile {
    margin-left: 50px;
  }
}

.execution-partner-text {
  margin: 0;
  text-align: center;
}

.navbar-links-dark {
  align-items: center;
}

/* rotating open account */

.oa-wrapper {
  position: relative;
  width: 200px;
  height: 200px;
  margin: 50px auto;
}

.oa-circle-text {
  width: 100%;
  height: 100%;
  animation: rotateOA 10s linear infinite;
}

.oa-svg-text {
  width: 100%;
  height: 100%;
}

.oa-center-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100px;
  height: 100px;
  background-color: #f15a22;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  transform: translate(-50%, -50%);
}

.oa-center-icon img {
  width: 40px;
  height: 40px;
  transition: transform 0.4s ease;
}

@keyframes rotateOA {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

/* HOVER EFFECT */
.oa-wrapper:hover .oa-center-icon {
  background-color: #ffffff;
}

.oa-wrapper:hover .oa-center-icon img {
  transform: rotate(45deg); /* Adjust angle as needed */
}

.equity-heading {
  display: inline;
  color: #f15a22;
  font-weight: 600;
  font-size: 60px;
}
.focused-highlight {
  display: inline;
  color: #f15a22;
  font-weight: 600;
  font-size: 45px;
}
.callnow-div {
  display: flex;
  align-items: center;
  gap: 10px;
}

.callnow-div img {
  width: 40px;
}

#pmscta-p {
  margin-bottom: 40px;
}

#pmsChartUnique {
  max-width: 100%;
  height: 300px;
  margin-bottom: 20px;
}

/* key features */

.oa-box-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 40px;
}

.oa-box {
  position: relative;
  width: 300px;
  height: 180px;
  background: #111;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 0 10px rgba(255, 75, 0, 0.5);
  border: 1px solid #f15a22;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  transition: transform 0.3s ease;
}

.oa-box:hover {
  transform: translateY(-5px) scale(1.02);
}

.oa-box-text {
  text-align: center;
  color: #fff;
  font-size: 18px;
  font-weight: bold;
  animation: fadeText 4s ease-in-out infinite;
}

.oa-box-text span {
  display: block;
}

.oa-box-icon {
  margin-top: 15px;
  width: 60px;
  height: 60px;
  background: #f15a22;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  animation: pulseArrow 2s ease-out infinite;
  box-shadow: 0 0 15px #f15a22;
}

.oa-box-icon img {
  width: 28px;
  height: 28px;
  filter: brightness(0) invert(1);
}

.oa-glow-effect {
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle, rgba(255, 75, 0, 0.2), transparent 70%);
  animation: glowPulse 6s linear infinite;
  z-index: 0;
  pointer-events: none;
}

@keyframes fadeText {
  0%,
  100% {
    opacity: 1;
  }
  50% {
    opacity: 0.4;
  }
}

@keyframes pulseArrow {
  0% {
    transform: scale(1);
    opacity: 1;
  }
  50% {
    transform: scale(1.15);
    opacity: 0.8;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}

@keyframes glowPulse {
  0% {
    transform: rotate(0deg) scale(1);
    opacity: 0.2;
  }
  50% {
    transform: rotate(180deg) scale(1.05);
    opacity: 0.4;
  }
  100% {
    transform: rotate(360deg) scale(1);
    opacity: 0.2;
  }
}

.openAccount-Download {
  display: flex;
  align-items: center;
}

@media (max-width: 480px) {
  .oa-box {
    width: 240px;
    height: 150px;
  }

  .oa-box-text {
    font-size: 16px;
  }

  .oa-box-icon {
    width: 50px;
    height: 50px;
  }

  .oa-box-icon img {
    width: 22px;
    height: 22px;
  }
}

.partnericon {
  width: 60px;
  cursor: pointer;
}

.partner-popup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.85);
  display: none;
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

.partner-popup {
  background: #111;
  border-radius: 12px;
  width: 90%;
  max-width: 850px;
  padding: 30px;
  position: relative;
  color: white;
}

.partner-popup-close {
  position: absolute;
  top: 5px;
  right: 15px;
  font-size: 28px;
  color: #fff;
  cursor: pointer;
}

.partner-popup-content {
  display: flex;
  gap: 30px;
  flex-wrap: wrap;
  align-items: stretch;
}

.partner-left {
  flex: 1 1 45%;
  display: flex;
  flex-direction: column;
  /* justify-content: center; */
}

.partner-left h4 {
  margin-bottom: 10px;
}

.partner-left h2 {
  color: #f15a22;
  font-size: 28px;
  margin-bottom: 20px;
}

.advantage-item {
  display: flex;
  align-items: center;
  margin-bottom: 25px;
}

.advantage-icon {
  width: 30px;
  height: 30px;
  margin-right: 15px;
  filter: brightness(0) invert(1); /* Make white if icons are dark */
}

.advantage-item p {
  margin: 0;
  font-size: 16px;
  line-height: 1.4;
}

.partner-right {
  flex: 1 1 45%;
  display: flex;
  align-items: center;
}

.partner-right form {
  display: flex;
  flex-direction: column;
  gap: 18px;
  width: 100%;
}

.partner-right input {
  padding: 12px 14px;
  border: none;
  border-radius: 8px;
  background: #333;
  color: white;
}

.partner-right input::placeholder {
  color: #ccc;
}

.partner-right button {
  padding: 12px;
  background-color: #f15a22;
  color: white;
  border: none;
  border-radius: 8px;
  font-size: 16px;
  cursor: pointer;
  transition: 0.3s ease;
}

.partner-right button:hover {
  background-color: #c24e00;
}

/* Responsive */
@media (max-width: 768px) {
  .partner-popup-content {
    flex-direction: column;
  }

  .partner-left,
  .partner-right {
    flex: 1 1 100%;
  }

  .partner-popup {
    padding: 20px;
  }
}

#mobile-img {
  width: 100% !important;
}

.downloadExceution {
  display: flex;
  flex-direction: column;
}

.downloadExceution img {
  width: 250px;
}
.execution-div {
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 30px;
}

.execution-div p {
  margin: 0;
  font-size: 20px;
}

.equityHomeTitle {
  margin-bottom: 0px;
  font-size: 50px !important;
}
.highlightText {
  color: #f15a22;
}

.trio-stat-wrapper {
  width: 100%;
  display: flex;
  gap: 20px;
  margin-top: 30px;
}

.trio-left {
  display: flex;
  /* flex-direction: column; */
  gap: 20px;
}

.trio-right {
  display: flex;
  align-items: center;
}

.trio-card {
  background: #1e1e1e;
  padding: 16px;
  border-radius: 10px;
  width: 120px;
  text-align: center;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
}

.stat-number {
  font-size: 24px;
  font-weight: bold;
  color: #f15a22;
  margin-bottom: 6px;
}

.stat-label {
  font-size: 16px;
  color: #fff;
  line-height: 1.3;
}

/* .ml{
	margin-left: 25px;
}
.mlLess{
	margin-left: 5px;
} */

.custom-growth-chart {
  /* max-width: 500px; */
  margin: auto;
  padding: 5px 0px;
}

.custom-growth-chart canvas,
.custom-growth-chart2 canvas {
  width: 100% !important;
  height: auto !important;
}

.custom-growth-chart2 {
  margin-top: 10px;
}

.custom-growth-char2 {
  max-width: 500px;
  margin: auto;
  padding: 20px;
}

.custom-growth-char2 canvas {
  width: 100% !important;
  height: auto !important;
}
.section-p {
  font-size: 20px;
}

.kotaklogo {
  width: 25%;
  margin-left: -20px;
}
.kotaklogo2 {
  width: 200px !important;
  aspect-ratio: auto !important;
  max-width: 100%;
  margin-left: -20px;
}
.button-adv {
  display: flex;
  justify-content: center;
}

.section-p-rotate {
  font-size: 24px;
  color: #fff;
  font-weight: 500;
  /* display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px; */
}

.trade-words {
  position: relative;
  display: inline-block;
  width: 130px;
  margin-bottom: -7px;
  height: 35px;
  overflow: hidden;
}

.trade-words .word {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  opacity: 0;
  transform: translateY(100%);
  animation: wordRotate 8s infinite ease-in-out;
  font-weight: bold;
  background: linear-gradient(90deg, #ff9800, #f15a22);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.trade-words .word:nth-child(1) {
  animation-delay: 0s;
}
.trade-words .word:nth-child(2) {
  animation-delay: 2s;
}
.trade-words .word:nth-child(3) {
  animation-delay: 4s;
}
.trade-words .word:nth-child(4) {
  animation-delay: 6s;
}

@keyframes wordRotate {
  0% {
    opacity: 0;
    transform: translateY(100%);
  }
  10% {
    opacity: 1;
    transform: translateY(0);
  }
  25% {
    opacity: 1;
    transform: translateY(0);
  }
  35% {
    opacity: 0;
    transform: translateY(-100%);
  }
  100% {
    opacity: 0;
  }
}

.section-p-highlight {
  font-size: 20px;
  color: #fff;
  font-weight: 500;
  line-height: 1.6;
  margin-bottom: 20px;
}

.highlight-word {
  color: #f15a22;
  font-weight: bold;
}

#swiperapp-wrapper {
  width: 50%;
  /* max-width: 400px; */
  /* margin: 0 auto; */
  /* height: 500px; */
}

#swiperapp-wrapper img {
  width: 100%;
  height: 500px;
  border-radius: 10px;
  object-fit: cover;
  border-radius: 20px 0 0 20px;
}
.custom-activity-box {
  /* background-color: #1a1a1a; */
  color: #fff;
  padding: 20px;
  border-radius: 12px;
  /* box-shadow: 0 0 12px rgba(229, 94, 0, 0.2); */
  max-width: 100%;
}

.custom-activity-header {
  margin-bottom: 16px;
}

.custom-activity-title {
  font-size: 30px;
  color: #f15a22;
  margin-bottom: 4px;
}

.custom-activity-title span {
  color: #000;
}

.custom-activity-subtitle {
  font-size: 14px;
  color: #ccc;
}

.custom-activity-cards {
  display: flex;
  /* gap: 15px; */
  flex-wrap: wrap;
  margin-bottom: 20px;
}

.custom-activity-card {
  /* flex: 1; */
  min-width: 140px;
  /* background: #2e2c2c; */
  padding: 15px 0 0 0;
  border-radius: 10px;
  /* box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); */
}

.custom-activity-label {
  font-size: 13px;
  color: #aaa;
  margin-bottom: 6px;
}

.custom-activity-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: column;
  height: 100%;
}

.custom-activity-month {
  font-size: 18px;
  color: #000;
}

.custom-activity-change {
  font-size: 18px;
  color: #f15a22;
  font-weight: bold;
  display: flex;
  align-items: center;
  gap: 4px;
}

.custom-activity-arrow {
  font-size: 12px;
}

.custom-activity-save-amount {
  font-size: 20px;
  font-weight: bold;
  color: #fff;
}

.custom-basket-boxes {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 15px;
}

.custom-basket-item {
  /* background-color: #2e2c2c; */
  color: #fff;
  padding: 12px 14px;
  border-radius: 8px;
  text-align: center;
  min-width: 110px;
  flex: 1;
  /* box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); */
}

.custom-basket-value {
  font-size: 18px;
  font-weight: bold;
  color: #f15a22;
}

.custom-basket-label {
  font-size: 13px;
  color: #ccc;
  line-height: 1.3;
  margin-top: 4px;
}

.custom-basket-sub {
  font-size: 11px;
  color: #999;
}

.custom-basket-button {
  flex: 1;
  text-align: center;
}

.custom-btn-enroll {
  background-color: #f15a22;
  color: #fff;
  padding: 10px 16px;
  border-radius: 6px;
  font-size: 14px;
  text-decoration: none;
  font-weight: bold;
  display: inline-block;
}

@media (max-width: 576px) {
  .custom-activity-content {
    flex-direction: column;
    align-items: flex-start;
  }

  .custom-activity-cards,
  .custom-basket-boxes {
    flex-direction: column;
  }

  .custom-basket-item,
  .custom-basket-button {
    width: 100%;
    text-align: center;
  }
}

#maximize-box {
  padding: 20px 20px;
  width: 50%;
}
#enroll-btn {
  padding: 5px 10px;
  margin-right: 0;
  border-radius: 10px;
  font-size: 14px;
}
#enroll-btn::before {
  display: none;
}

.maximizeh4 {
  margin: 20px 0;
  font-size: 40px !important;
}

.swiper-scrollbar.swiper-scrollbar-vertical {
  opacity: 0;
}

#about-list {
  height: 500px;
  margin-top: 45px;
}

.swiper-app .image-anime {
  overflow: visible;
}

.dark-section-container {
  display: flex;
  flex-wrap: wrap;
  /* background-color: #121212; */
  padding: 20px 0px 0;
  border-radius: 12px;
  color: #fff;
  gap: 20px;
  align-items: center;
  justify-content: space-between;
}

.dark-section-heading {
  flex: 1 1 200px;
  font-size: 28px;
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 20px;
  line-height: 1.3;
}

.dark-section-heading h2 {
  margin-bottom: 20px;
  font-size: 30px;
}

.dark-card-wrapper {
  display: flex;
  flex: 3 1 600px;
  gap: 20px;
  flex-wrap: wrap;
  justify-content: space-between;
}

.dark-feature-card {
  background: #1f1f1f;
  border: 1px solid #2e2e2e;
  border-radius: 10px;
  padding: 20px;
  flex: 1 1 200px;
  min-width: 200px;
  max-width: 100%;
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
}

.dark-feature-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 16px rgba(255, 255, 255, 0.1);
}

.dark-card-title {
  font-size: 18px;
  margin-bottom: 10px;
  color: #f97316; /* Orange accent */
}

.dark-card-desc {
  font-size: 14px;
  color: #cccccc;
  margin-top: 0 !important;
}

/* Responsive: Stack cards on smaller screens */
@media (max-width: 768px) {
  .dark-section-container {
    flex-direction: column;
    align-items: flex-start;
  }

  .dark-card-wrapper {
    flex-direction: column;
    width: 100%;
  }

  .dark-feature-card {
    width: 100%;
  }
}

.custom-counter-wrapper {
  background-color: #111; /* dark background */
  padding: 20px;
  border-radius: 12px;
  text-align: center;
  max-width: 520px;
  width: 100%;
  /* margin: auto; */
  color: #fff;
  box-shadow: 0 0 10px rgba(255, 153, 0, 0.2);
}

.custom-counter-heading {
  font-size: 40px;
  font-weight: 600;
  color: #f97316; /* Hex orange */
  margin-bottom: 10px;
  margin-top: 4px;
}

.custom-counter-value {
  font-size: 34px;
  font-weight: bold;
  margin-bottom: 8px;
}

.custom-counter-number {
  color: #f97316; /* Orange for number only */
}

.custom-counter-description {
  font-size: 14px;
  color: #ccc;
  margin: 0;
}

.portfolio-charts-wrapper {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
  gap: 30px;
  padding: 0px 0 30px;
  /* background-color: #0e0e0e;  */
}

.portfolio-chart-card {
  background-color: #1a1a1a;
  color: #fff;
  border-radius: 12px;
  padding: 20px;
  /* max-width: 500px; */
  gap: 10px;
  min-height: 65vh;
  display: flex;
  width: 100%;
  justify-content: center;
  /* width: 100%; */
  box-shadow: 0 0 15px rgba(255, 153, 0, 0.15);

  align-items: center;
}

.portfolio-title {
  font-size: 20px;
  font-weight: 600;
  color: #f97316; /* Hex orange */
  margin-bottom: 15px;
  text-align: left;
}

.portfolio-info-cards {
  display: flex;
  gap: 10px;
  flex-direction: column;
  margin-bottom: 20px;
  /* flex-wrap: wrap; */
  align-items: center;
  justify-content: center;
  margin-top: 20px;
}

.info-box-container {
  width: 100%;
  display: flex;
  justify-content: space-between;
  gap: 10px;
}

.portfolio-info-box {
  background-color: #111;
  border-radius: 10px;
  padding: 10px 15px;
  display: flex;
  text-align: center;
  height: 150px;
  flex: 1 1 120px;
  width: 70%;
  flex-direction: column;
  /* align-items: center; */
  justify-content: center;
}

.portfolio-info-box h4 {
  font-size: 16px;
  color: #ccc;
  margin: 0 0 4px;
}

.portfolio-highlight {
  color: #f97316 !important;
  font-weight: bold !important;
  font-size: 20px !important;
  margin: 0 !important;
}

.portfolio-source {
  font-size: 12px;
  color: #aaa;
  margin-top: 10px;
}

#lineChartAlpha {
  height: 400px;
}

#pmstte {
  display: flex;
  /* justify-content: center; */
  width: 100%;
  margin-top: 20px;
  gap: 20px;
}

#pmstte a {
  margin-right: 0;
}

#pms-section-row {
  margin-bottom: 30px;
}

.performance-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
  gap: 20px;
}

.performance-title {
  color: #fff;
  font-size: 24px;
  font-weight: 700;
  flex: 1;
  margin: 0;
}

.performance-counters {
  display: flex;
  gap: 15px;
  flex-wrap: wrap;
}

.perf-counter-block {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 45%;
  background: #242424;
  padding: 15px;
  border-radius: 15px;
  height: 200px;
  justify-content: center;
}

.perf-counter-label {
  font-size: 30px;
  color: #ccc;
  margin-bottom: 4px;
  /* text-transform: uppercase; */
  letter-spacing: 0.5px;
}

.perf-counter-value {
  font-size: 28px;
  font-weight: bold;
  color: #f15a22; /* Hex orange */
}

@media (max-width: 768px) {
  .performance-header {
    flex-direction: column;
    align-items: flex-start;
  }

  .performance-title {
    margin-bottom: 10px;
  }

  .performance-counters {
    justify-content: flex-start;
  }
}

.pmstitle-cagr {
  display: flex;
  align-items: center;
  gap: 40px;
}

#pmstitle {
  font-size: 60px;
}

@media (max-width: 768px) {
  .dezerv-left-content .pmsTitle {
    font-size: 40px !important;
  }
  #firstHeading h1,
  #pmstitle {
    font-size: 40px;
  }
  #about-list {
    height: 100%;
  }
  .trio-card {
    width: 100%;
  }
  .trio-stat-wrapper,
  .trio-left {
    flex-direction: column;
  }
  .basket-item {
    width: 100%;
  }
  .portfolio-info-box {
    flex: 1 1 auto;
  }
}

.titleAndBtn {
  display: flex;
  justify-content: space-between;
  align-items: center;
  /* margin-bottom: 30px; */
}

#tradeeasy-content {
  width: 100%;
}

.calltrade-btns {
  display: flex;
  align-items: center;
}

.swiper-basket {
  padding: 20px;
}

.swiper-basket .swiper-slide {
  /* background: #f9f9f9; */
  border-radius: 10px;
  padding: 20px;
  box-sizing: border-box;
}

#graphAndApp {
  width: 100%;
}

/* what we do */

.what-we-do {
  padding: 0px 0;
}

.what-we-do-image {
  margin-right: 30px;
  box-shadow: 0 0 12px rgba(229, 94, 0, 0.2);
  background: #1a1a1a82;
}

.what-we-do-image img {
  width: 100%;
  border-radius: 30px;
  aspect-ratio: 1 / 1.38;
  object-fit: cover;
}

.what-we-boxes {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}

.what-we-item {
  width: calc(50% - 15px);
  background: url(../images/what-we-item-bg.svg) no-repeat;
  background-position: top left;
  background-size: auto;
  border: 1px solid var(--divider-color);
  border-radius: 30px;
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  overflow: hidden;
  padding: 15px 30px;
}

.what-we-item::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: var(--secondary-color);
  opacity: 40%;
  z-index: -1;
}

.what-we-item .icon-box {
  margin-bottom: 30px;
}

.what-we-item .icon-box img {
  max-width: 40px;
}

.what-we-item-content h3 {
  font-size: 20px;
  text-transform: capitalize;
  margin-bottom: 15px;
}

.what-we-item-content p {
  margin: 0;
}

.what-we-item.get-free-item {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 30px;
  padding: 40px;
}

.what-we-item.get-free-item .what-we-item-content {
  width: calc(54% - 15px);
}

#maximizeDiv {
  margin-bottom: 10px;
}

.success-strike {
  text-align: center;
  color: #f15a22;
  font-size: 30px;
  font-weight: bold;
}

#wetrade {
  margin-bottom: 10px;
}

.investSmartly {
  margin-top: 10px !important;
}

/* we make your trade */

.wemake .what-we-do {
  position: relative;
  padding: 80px 0 30px;
}

.wemake .what-we-do-image {
  box-shadow: none;
  background: none;
}

.wemake .what-we-do h2 {
  font-size: 50px;
}

.wemake .what-we-do::before {
  content: "";
  display: block;
  position: absolute;
  left: -20px;
  bottom: 80px;
  background: url("../images/section-bg-shape-4.png") no-repeat;
  background-position: left bottom;
  background-size: contain;
  width: 160px;
  height: 220px;
  animation: circlerotate 10s infinite linear;
  animation-direction: alternate;
  z-index: -1;
}

.wemake .satisfy-client-images {
  margin-bottom: 10px;
}

.wemake .satisfy-client-image {
  display: inline-block;
  margin-left: -14px;
  border: 1px solid var(--dark-color);
  border-radius: 50%;
  overflow: hidden;
}

.wemake .satisfy-client-image:first-child {
  margin: 0;
}

.wemake .satisfy-client-image figure {
  display: block;
}

.wemake .satisfy-client-image img {
  max-width: 40px;
}

.wemake .satisfy-client-content p {
  text-transform: capitalize;
  margin: 0;
}

.wemake .satisfy-client-content p span {
  font-weight: 600;
  color: var(--accent-color);
}

.wemake .what-we-do-images {
  position: relative;
  padding-left: 20px;
}

.wemake .what-we-do-image figure {
  display: block;
  border-radius: 999px;
  overflow: hidden;
}

.wemake .what-we-do-image img {
  width: 100%;
  aspect-ratio: 1 / 1.584;
  border-radius: 999px;
  object-fit: cover;
}

.wemake .what-we-do-circle {
  position: absolute;
  bottom: 0;
  left: 0;
}

.wemake .what-we-do-circle img {
  max-width: 150px;
  animation: infiniterotate 30s infinite linear;
}

.wemake .what-we-do-header,
.wemake .what-we-do-body {
  margin-bottom: 60px;
}

.wemake .what-we-do-header p:last-child {
  margin-bottom: 0;
}

.wemake .what-we-do-body {
  display: flex;
  gap: 30px 70px;
  flex-wrap: wrap;
}

.wemake .what-do-body-item {
  position: relative;
  width: calc(33.33% - 46.67px);
}

.wemake .what-do-body-item h3 {
  font-size: 30px;
  color: var(--accent-color);
  margin-bottom: 20px;
}

.wemake .what-do-body-item::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: -35px;
  height: 100%;
  width: 1px;
  background-color: var(--divider-color);
}

.wemake .what-do-body-item:nth-of-type(3n + 3):before,
.wemake .what-do-body-item:last-child:before {
  display: none;
}

.wemake .what-do-body-item p {
  margin-bottom: 0;
}

/* why choose */

.whychoose .why-choose-us {
  padding: 80px 0 0;
}

.whychoose .why-choose-image {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
  margin-right: 30px;
  width: 100%;
}

.whychoose .why-choose-image .why-choose-img-1 {
  position: relative;
  width: calc(56% - 15px);
  padding-bottom: 70px;
}

.whychoose .why-choose-image .why-choose-img-2 {
  width: calc(44% - 15px);
}

.whychoose .why-choose-img-1 figure,
.whychoose .why-choose-img-2 figure {
  display: block;
  border-radius: 30px;
}

.whychoose .why-choose-img-1 img,
.whychoose .why-choose-img-2 img {
  width: 100%;
  object-fit: cover;
  border-radius: 30px;
}

.whychoose .why-choose-img-1 img {
  aspect-ratio: 1 / 1.18;
}

.whychoose .why-choose-img-2 img {
  aspect-ratio: 1 / 1.8;
}

.whychoose .company-experience {
  position: absolute;
  bottom: 0;
  left: 0px;
  /* background-color: var(--accent-color); */
  background-color: #000;
  border: 8px solid var(--dark-color);
  border-radius: 20px;
  padding: 20px 0;
  display: flex;
  align-items: center;
  width: max-content;
  /* animation: experienceobject 3s infinite linear alternate; */
  overflow: hidden;
  z-index: 1;
}

@keyframes experienceobject {
  50% {
    left: 55px;
  }
}

.whychoose .company-experience h3 {
  color: var(--dark-color);
  position: relative;
  width: 38%;
  font-size: 36px;
  margin-right: 10px;
  z-index: 1;
}

.whychoose .company-experience p {
  position: relative;
  width: 100%;
  /* color: var(--dark-color); */
  color: #fff;
  line-height: 1.1em;
  text-transform: capitalize;
  text-align: left;
  margin: 0;
  z-index: 1;
}

.whychoose .why-choose-content .section-title {
  border-bottom: 1px solid var(--divider-color);
  padding-bottom: 30px;
}

.whychoose .why-choose-content p {
  margin: 0;
  font-size: 15px;
}

.whychoose .why-choose-counter-box {
  display: flex;
  flex-wrap: wrap;
  gap: 30px 80px;
  padding-bottom: 40px;
  margin-bottom: 40px;
  border-bottom: 1px solid var(--divider-color);
}

.whychoose .why-choose-counter-item {
  position: relative;
  width: calc(33.33% - 53.33px);
}

.whychoose .why-choose-counter-item::before {
  content: "";
  position: absolute;
  width: 1px;
  height: 100%;
  top: 0;
  right: -40px;
  bottom: 0;
  background: var(--divider-color);
}

.whychoose .why-choose-counter-item:last-child:before,
.whychoose .why-choose-counter-item:nth-child(3n + 3):before {
  display: none;
}

.whychoose .why-choose-counter-item h2 {
  color: var(--accent-color);
  font-size: 30px;
  margin-bottom: 10px;
}

.whychoose .why-choose-counter-item p {
  text-transform: capitalize;
  margin: 0;
}

.whychoose .why-choose-list ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.whychoose .why-choose-list ul li {
  position: relative;
  line-height: normal;
  margin-bottom: 30px;
  padding-left: 30px;
}

.whychoose .why-choose-list ul li:last-child {
  margin-bottom: 0;
}

.whychoose .why-choose-list ul li::before {
  content: "\f192";
  position: absolute;
  font-family: "FontAwesome";
  font-weight: 900;
  left: 0;
  top: 2px;
  font-size: 18px;
  color: var(--accent-color);
  transition: all 0.3s ease-in-out;
}

.actionable {
  font-size: 20px !important;
  color: #000;
}

#boxes-img1 {
  width: 100%;
}

#company {
  /* bottom: auto; */
}

#maximize-content {
  margin-top: -25px;
}

#easytext {
  font-size: 70px;
}

#what-we-boxes {
  padding-bottom: 50px;
}

#whatweItembox {
  width: 100%;
}

#maximize-container {
  border: 1px solid var(--divider-color);
  border-radius: 30px;
  backdrop-filter: blur(100px);

  overflow: hidden;
  padding: 25px 30px;
}

.investment-heading {
  font-size: 40px !important;
  margin: 20px 0 0 !important;
}

.cagr {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.dark-card-title.cagr {
  margin-bottom: 0;
}

.dark-card-desc.cagr {
  font-size: 22px;
}

.cardsAndh2,
.graphAndbtn {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.cardsAndh2 p {
  font-size: 19px;
}

canvas {
  width: 100% !important;
  height: 100% !important;
}

.unique-heading {
  font-size: 60px;
  font-weight: 700;
  margin-bottom: 25px;
  color: #000;
}

.unique-subtitle {
  font-size: 14px;
  text-transform: uppercase;
  font-weight: 600;
  color: #2ca7a7;
  margin-bottom: 5px;
}

.unique-list p {
  margin-bottom: 0px;
}

.unique-list p:first-child {
  font-weight: 500;
  color: #000;
}

.unique-list p:not(:first-child) {
  color: #000;
}

.unique-button {
  border-radius: 30px;
  padding: 10px 24px;
  font-weight: 500;
  font-size: 18px;
}

.unique-right {
  margin-top: 50px;
}

.unique-right-box {
  background-color: #f7f7f7;
  border-radius: 20px;
  padding: 20px;
  width: 100%;
  max-width: 320px;
  box-shadow: inset 0 0 0 1px #eee;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.unique-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  object-fit: cover;
  margin-right: 10px;
}

.unique-portfolio-card {
  background: #f0f0f0;
  padding: 16px;
  border-radius: 15px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
  width: 100%;
}

.unique-portfolio-left {
  display: flex;
  align-items: center;
}

.unique-portfolio-name {
  font-weight: 500;
}

.unique-percentage {
  color: #f15a22;
  font-weight: bold;
  font-size: 16px;
  text-align: right;
}
.unique-section {
  background: #fff;
  border-radius: 25px;
  padding: 20px 40px 0;
  margin-bottom: 40px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
  height: min-content;
  width: 90%;
}

.box2-scroll-wrapper {
  position: relative;
  height: 100vh; /* Box 2 scroll container height */
}

.unique-fixed-box {
  position: sticky;
  top: 80px;
  z-index: 3;
  opacity: 0;
  transform: translateY(40px);
  transition: all 0.6s ease;
}

.unique-fixed-box.visible {
  opacity: 1;
  transform: translateY(0);
}

@media (max-width: 768px) {
  .unique-layout {
    flex-direction: column;
    text-align: center;
  }
  .unique-right {
    margin-top: 30px;
  }
}

.choose-table-wrapper {
  max-width: 1000px;
  margin: auto;
  /* background: #fff; */
  /* border: 2px solid #000; */
  border-radius: 12px;
  padding: 30px 20px;
  /* box-shadow: 0 8px 24px rgba(0, 0, 0, 0.05); */
}

.choose-table-row {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 20px;
  text-align: center;
}

.choose-table-cell {
  flex: 1;
  min-width: 200px;
  padding: 15px 10px;
}

.choose-table-number {
  font-size: 32px;
  font-weight: 600;
  color: #f15a22;
  margin-bottom: 8px;
}

.choose-table-label {
  font-size: 18px;
  color: #222;
  font-weight: 500;
  font-weight: bold;
}

@media (max-width: 768px) {
  .choose-table-row {
    flex-direction: column;
    gap: 16px;
  }
}

.cycle-line,
.cycle-line2,
.cycle-line3 {
  width: 3px;
  background: #f2f2f2;
  border-radius: 2px;
  position: relative;
  height: 100%;
}

.cycle-line-indicator,
.cycle-line-indicator2,
.cycle-line-indicator3 {
  position: absolute;
  display: none;
  width: 3px;
  height: 40px;
  background: #f15a22;
  top: 0;
  left: 0;
  transition: top 0.4s ease;
}

.cycle-wrapper,
.cycle-wrapper2,
.cycle-wrapper3 {
  display: flex;
  align-items: flex-start;
  gap: 15px;
  max-width: 600px;
  margin: 0 auto;
  padding: 0px 0px;
}

.cycle-wrapper2,
.cycle-wrapper3 {
  flex-direction: column;
}

.cycle-list,
.cycle-list2,
.cycle-list3 {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.cycle-item,
.cycle-item2,
.cycle-item3 {
  position: relative;
  padding-left: 12px;
  border-left: 2px solid #eee;
  opacity: 0.5;
  transition: all 0.4s ease;
}

.cycle-item.active,
.cycle-item2.active,
.cycle-item3.active {
  opacity: 1;
  /* font-weight: 600; */
}

.cycle-item.active::before,
.cycle-item2.active::before,
.cycle-item3.active::before {
  content: "";
  position: absolute;
  left: -2px;
  top: 0;
  width: 2px;
  height: 100%;
  background-color: #f15a22;
}

.cycle-title,
.cycle-title2 {
  font-size: 28px;
  margin: 0 0 4px;
}
.cycle-title2 {
  font-size: 24px;
}
.cycle-subtext,
.cycle-subtext2,
.cycle-subtext3 {
  font-size: 22px;
  color: #666;
  margin: 0;
}
/* .cycle-subtext2{
	font-size: 18px;
} */
.gif-card-wrapper {
  /* background-color: #f0f0f0;  */
  border-radius: 16px;
  padding: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: 100%;
  /* box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05); */
}

.gif-card-img {
  max-width: 100%;
  height: auto;
  border-radius: 12px; /* Optional: rounded edges for gif */
}

/* gsap */
.cards {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 70vh;
  margin-bottom: 90px;
}
.custom-card {
  position: absolute;
  width: 100%;
  top: 0px;
  /* margin-top: 60px; */
  height: 90vh;
  /* background: -webkit-linear-gradient(
    130deg,
    #d754ad 0%,
    #f96785 67%,
    #fe7333 100%
  );
  background: linear-gradient(-40deg, #d754ad 0%, #f96785 67%, #fe7333 100%); */
  color: #fff;
  margin-bottom: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50px;
  /* box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.2); */
}
.card1 {
}
.card2 {
  top: 30px;
}

.opacity {
  -moz-transition: 0.4s ease;
  -ms-transition: 0.4s ease;
  -o-transition: 0.4s ease;
  transition: 0.4s ease;
  -webkit-transition: 0.4s ease;
  opacity: 0.6;
}
.scale {
  moz-transition: 0.4s ease;
  -ms-transition: 0.4s ease;
  -o-transition: 0.4s ease;
  transition: 0.4s ease;
  -webkit-transition: 0.4s ease;
  width: 95%;
}

.insight-block {
  font-size: 1.15rem;
  line-height: 1.7;
  color: #1a1a1a;
  max-width: 680px;
  margin: 30px auto 15px;
  padding: 20px 25px;
  border-radius: 12px;
  /* background: #fafafa;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.05); */
}

.insight-block .badge {
  display: inline-block;
  background-color: #ffe8db;
  color: #f15a22;
  font-weight: 600;
  padding: 3px 8px;
  margin: 0 5px;
  border-radius: 6px;
  font-size: 20px;
}

.insight-block .pre-text {
  font-weight: 500;
  color: #444;
}

.insight-block .post-text {
  color: #555;
}

.diversified {
  color: #000;
}

/* tabs for swiper alpha */

.swiper-tabs-container {
  display: flex;
  /* justify-content: center; */
  gap: 20px;
  margin-bottom: 20px;
}

.swiper-tab-btn {
  padding: 10px 20px;
  background: #ffffff;
  border: none;
  color: #000000;
  border-radius: 10px;
  cursor: pointer;
  transition: all 0.3s ease;
  font-weight: 600;
}

.swiper-tab-btn:hover {
  background: #f15a22;
  color: #fff;
}

.active-tab {
  background: #f15a22;
  color: #fff;
}

@media (min-width: 768px) {
  .unique-heading {
    font-size: 30px;
  }
}

.deven-tabs {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin-bottom: 30px;
  margin-top: 20px;
}

.deven-tab-btn {
  padding: 10px 25px;
  background: #111;
  border: 1px solid #f15a22;
  color: #fff;
  border-radius: 30px;
  cursor: pointer;
  transition: 0.3s ease;
  font-weight: 500;
}

.deven-tab-btn:hover,
.active-deven-tab {
  background: #f15a22;
  color: #fff;
}

.deven-slide {
  display: flex;
  justify-content: center;
}

.deven-card {
  display: flex;
  background: #f6f6f6;
  border-radius: 20px;
  overflow: hidden;
  width: 95%;
  max-width: 1100px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

.deven-video-box {
  flex: 2;
  max-width: 50%;
  overflow: hidden;
}

.deven-video-box video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.deven-content {
  flex: 1;
  padding: 10px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: #fff;
}
.deven-style {
  background: #fff;
  padding: 40px 30px;
  border-radius: 18px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;

  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.05);
}

/* Bold event title like Dezerv quote */
.deven-event-title {
  font-size: 40px;
  font-weight: 700;
  color: #000;
  line-height: 1.3;
  margin-bottom: 20px;
  word-spacing: 1px;
}

/* Footer section for name, title, location */
.deven-footer-details {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

/* Name in orange, bold */
.deven-person-name {
  font-size: 1.2rem;
  font-weight: 700;
  color: #f15a22;
}

/* Title in semi-bold, dark gray */
.deven-person-role {
  font-size: 28px;
  font-weight: 600;
  color: #000000;
}

/* Location in lighter gray */
.deven-person-location {
  font-size: 0.95rem;
  color: #777;
}
.deven-channel {
  display: flex;
  /* align-items: center; */
  flex-direction: column;
  gap: 10px;
  margin-bottom: 30px;
}

.deven-channel-logo {
  width: 70px;
  height: auto;
  object-fit: cover;
}

.deven-channel-name {
  font-size: 1.1rem;
  font-weight: 600;
  color: #444;
  /* text-transform: uppercase; */
  letter-spacing: 0.5px;
}

@media (max-width: 768px) {
  .deven-card {
    flex-direction: column;
  }

  .deven-video-box,
  .deven-content {
    max-width: 100%;
  }

  .deven-content {
    padding: 20px;
  }

  .deven-quote {
    font-size: 1.4rem;
  }
}

.deven-videos {
  padding: 100px 0;
}

/* wwealth Management */

.swiper-wealth-steps-container,
.swiper-wealth-steps-container2 {
  width: 100%;
  padding: 40px 0;
  /* background: #111; */
}

.swiper-wealth-steps-container .chart-container img {
  width: 345px;
}

.swiper-wealth-tabs,
.swiper-wealth-tabs2 {
  display: flex;
  /* justify-content: center; */
  margin-bottom: 30px;
  gap: 15px;
}

.wealth-tab-btn,
.wealth-tab-btn2 {
  padding: 10px 20px;
  background: #ffffff;
  border: none;
  color: #000000;
  border-radius: 10px;
  cursor: pointer;
  transition: all 0.3s ease;
  font-weight: 600;
}
.active-wealth-tab,
.active-wealth-tab2 {
  background: #f15a22;
  color: #fff;
}

.wealth-step-card {
  background: #fff;
  color: #111;
  border-radius: 20px;
  padding: 40px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 40px;
  height: 90vh;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
}
@media (max-width: 1280px) {
  .wealth-step-card {
    height: 100% !important;
  }
}
.wealth-step-card .wealth-text {
  flex: 1;
}
.wealth-step-card .wealth-step-num {
  display: inline-block;
  font-size: 24px;
  font-weight: bold;
  border: 2px solid #000;
  border-radius: 50%;
  padding: 10px;
  margin-bottom: 10px;
}
.wealth-step-card h4 {
  font-size: 20px;
  margin-bottom: 15px;
  color: #fff;
}
.wealth-step-card p {
  font-size: 36px;
  line-height: 1.4;
}
.wealth-image {
  flex: 1;
  display: flex;
  justify-content: center;
}
.wealth-image img {
  max-width: 100%;
  height: auto;
}

.wealth-scrollbar,
.deven-scrollbar,
.swiper-scrollbar {
  display: none !important;
}

.execution-partner-wrapper {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 20px;
}

.execution-partner-label {
  font-size: 20px;
  font-weight: 600;
  color: #f15a22;
  background-color: #ffe8db;
  padding: 4px 12px;
  border-radius: 4px;
  /* text-transform: uppercase; */
  letter-spacing: 0.5px;
}

.kotaklogo2 {
  /* height: 22px; */
}

/* graph gif */
svg {
  max-width: 100%;
  height: auto;
}

.label,
.date {
  font-size: 20px;
  fill: #444;
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
}

.dot {
  opacity: 0;
}

.caption {
  font-size: 12px;
  fill: #aaa;
}

.dot-group circle:first-child {
  fill: #f15a22; /* Outer dot */
}

.dot-group circle:last-child {
  fill: #fff; /* Inner dot */
}

hr {
  width: 100%;
  height: 2px;
  background-color: #969696;
  margin: 10px 0;
}

.interviewDiv {
  margin-bottom: 50px;
}

.interviewDiv h2 {
  font-size: 60px;
}

.interviewDiv h2 span {
  font-weight: 600;
  color: var(--accent-color);
}

.interview-video {
  aspect-ratio: 9 / 16;
  width: 100%;
  object-fit: contain;
  /* border-radius: 20px; */
  /* width: 478px; */
  /* height: 850px; */
}

.chaturAi-btns {
  display: flex;
  margin-top: 10px;
  gap: 10px;
}

#mutualfundContent {
  display: flex;
  align-items: center;
}

#mutualfundContent h3 {
  line-height: 1.8;
  font-size: 26px !important;
  font-weight: 500;
}

.action p {
  /* margin-left: 10px; */
  margin-top: 20px;
  font-size: 30px;
}

/* mf first section */

.mutual-fund .hero {
  position: relative;
  padding: 225px 0 175px;
}

.mutual-fund .hero::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background:
    linear-gradient(179.5deg, rgba(0, 0, 0, 0) 0.44%, #000000 119.12%),
    linear-gradient(0.62deg, rgba(0, 0, 0, 0) 81.46%, #000000 99.49%);
  height: 100%;
  width: 100%;
  z-index: 1;
}

.mutual-fund .hero .hero-bg-video {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
}

.mutual-fund .hero .hero-bg-video video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.mutual-fund .hero.bg-image {
  background: url("../images/hero-bg.jpg") no-repeat;
  background-position: center center;
  background-size: cover;
  padding: 225px 0 175px;
}

.mutual-fund .hero.hero-slider-layout {
  background: none;
  padding: 0;
}

.mutual-fund .hero.hero-slider-layout .hero-slide {
  position: relative;
  background: url("../images/hero-bg.jpg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  padding: 225px 0 175px;
}

.mutual-fund .hero.hero-slider-layout .hero-slide.slide-2 {
  background: url("../images/hero-bg-2.jpg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

.mutual-fund .hero.hero-slider-layout .hero-slide::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background:
    linear-gradient(179.5deg, rgba(0, 0, 0, 0) 0.44%, #000000 119.12%),
    linear-gradient(0.62deg, rgba(0, 0, 0, 0) 81.46%, #000000 99.49%);
  width: 100%;
  height: 100%;
  z-index: 1;
}

.mutual-fund .hero.hero-slider-layout .hero-slide .hero-slider-image {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
}

.mutual-fund .hero.hero-slider-layout .hero-slide .hero-slider-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.mutual-fund .hero.hero-slider-layout .hero-pagination {
  position: absolute;
  bottom: 30px;
  text-align: center;
  z-index: 2;
}

.mutual-fund
  .hero.hero-slider-layout
  .hero-pagination
  .swiper-pagination-bullet {
  width: 12px;
  height: 12px;
  background: var(--primary-color);
  opacity: 1;
  transition: all 0.3s ease-in-out;
  margin: 0 5px;
}

.mutual-fund
  .hero.hero-slider-layout
  .hero-pagination
  .swiper-pagination-bullet-active {
  background-color: var(--accent-color);
}

.mutual-fund .hero-content {
  position: relative;
  z-index: 2;
}

.mutual-fund .hero-content .section-title p {
  font-size: 22px;
}

.mutual-fund .hero-content-btn {
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
}

.mutual-fund .hero-content-btn .video-play-button {
  display: inline-flex;
  align-items: center;
}

.mutual-fund .hero-content-btn .video-play-button p {
  font-weight: 700;
  text-transform: capitalize;
  color: var(--primary-color);
  margin: 0 15px 0 0;
  transition: all 0.3s ease-in-out;
}

.mutual-fund .hero-content-btn .video-play-button:hover p {
  color: var(--accent-color);
}

.mutual-fund .hero-content-btn .video-play-button a {
  height: 50px;
  width: 50px;
  background: var(--accent-color);
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: none;
  transition: all 0.3s ease-in-out;
}

.mutual-fund .hero-content-btn .video-play-button a:hover {
  background: var(--primary-color);
}

.mutual-fund .hero-content-btn .video-play-button a i {
  font-size: 18px;
  color: var(--dark-color);
}

.mutual-fund .hero .our-agency-circle {
  text-align: end;
}

.mutual-fund .our-agency-circle a {
  position: relative;
  display: inline-flex;
  z-index: 2;
}

.mutual-fund .our-agency-circle a figure img {
  max-width: 200px;
  animation: agencycirclerotate 25s infinite linear;
}

@keyframes agencycirclerotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

.mutual-fund .our-agency-circle .agency-circle-arrow {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: 90px;
  width: 90px;
  background: var(--accent-color);
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease-in-out;
}

.mutual-fund .our-agency-circle a:hover .agency-circle-arrow {
  background: var(--primary-color);
}

.mutual-fund .our-agency-circle .agency-circle-arrow img {
  max-width: 38px;
  transition: all 0.4s ease-in-out;
}

.mutual-fund .our-agency-circle a:hover .agency-circle-arrow img {
  transform: rotate(45deg);
}

.mutual-fund #mf-title {
  font-size: 47px;
  font-weight: 300;
  line-height: 1.2em;
  color: var(--primary-color);
  margin-bottom: 0;
  cursor: none;
}

#mf-title span,
#mf-title span {
  font-weight: 700;
  color: #f15a22;
}

/* mf second section */

.advisor .our-services {
  padding: 80px 0;
}

.advisor .service-item {
  position: relative;
  background: url("../images/service-bg.svg") no-repeat;
  background-position: top left;
  background-size: auto;
  border: 1px solid var(--divider-color);
  border-radius: 30px;
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  height: calc(100% - 30px);
  margin-bottom: 30px;
  padding: 40px;
  transition: all 0.4s ease-in-out;
  overflow: hidden;
  width: 100%;
  display: block;
}
#advisorTitle {
  font-size: 50px;
}
.advisor .service-item:hover {
  transform: translateY(-5px);
}

.advisor .service-item::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: var(--secondary-color);
  opacity: 40%;
}

.advisor .service-item-header {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 100px;
}

.advisor .service-item-header .icon-box img {
  max-width: 60px;
}

.advisor .service-arrow a img {
  max-width: 34px;
  transition: all 0.3s ease-in-out;
}

.advisor .service-item:hover .service-arrow a img {
  filter: brightness(0) invert(1);
  transform: rotate(45deg);
}

.advisor .service-item-body {
  position: relative;
}

.advisor .service-item-body h3 {
  font-size: 22px;
  text-transform: capitalize;
  margin-bottom: 20px;
}

.advisor .service-item-body p {
  margin-bottom: 0;
}

.advisor .service-footer {
  margin-top: 20px;
}

.advisor .service-footer p {
  text-align: center;
  margin-bottom: 0;
}

.advisor .service-footer p a {
  font-weight: 700;
  text-transform: capitalize;
  text-decoration: underline;
  color: var(--accent-color);
  transition: all 0.3s ease-in-out;
}

.advisor .service-footer p a:hover {
  color: var(--primary-color);
}

/* mf third section */

.sip-section-dark {
  background-color: #0f0f0f;
  color: #ffffff;
  padding: 40px 20px;
}

.sip-title {
  font-size: 24px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 20px;
}

.sip-tabs {
  display: flex;
  justify-content: center;
  gap: 15px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.sip-tab {
  background: transparent;
  border: none;
  color: #ccc;
  padding: 10px 16px;
  font-size: 14px;
  border-bottom: 2px solid transparent;
  cursor: pointer;
}

.sip-tab.active {
  color: #fff;
  border-bottom: 2px solid #337dff;
}

.sip-table-wrapper {
  overflow-x: auto;
}

.sip-table {
  min-width: 600px;
  width: 100%;
  border-radius: 10px;
  border: 1px solid #333;
  overflow: hidden;
}

.sip-header-row,
.sip-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 16px;
  border-bottom: 1px solid #222;
}

.sip-header-row {
  background-color: #1a1a1a;
  font-weight: bold;
  font-size: 14px;
}

.sip-row {
  background-color: #191919;
  font-size: 14px;
  transition: background 0.3s;
}

.sip-row:hover {
  background-color: #222;
}

.sip-col {
  flex: 1;
  padding-right: 10px;
  min-width: 120px;
}

.fund-name img {
  height: 50px;
  width: 100px;
  margin-right: 8px;
  object-fit: cover;
  vertical-align: middle;
}

.fund-name {
  flex: 2;
  display: flex;
  flex-direction: column;
}

.sip-subtext {
  color: #afafaf;
  font-size: 16px;
  margin-top: 4px;
}

.sip-btn-wrapper {
  text-align: center;
  margin-top: 20px;
}

.sip-col.invest-btn {
  flex: 0 0 100px; /* fixed width column for button */
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

.sip-col.invest-btn .btn-default {
  padding: 6px 12px;
  font-size: 13px;
  background-color: #337dff;
  color: #fff;
  border: none;
  border-radius: 4px;
  text-decoration: none;
  transition: background 0.3s;
}

.sip-col.invest-btn .btn-default:hover {
  background-color: #255ec9;
}

/* Make it scroll on smaller screens */
@media (max-width: 600px) {
  .sip-table-wrapper {
    overflow-x: auto;
  }
}

/* mf lumpsum */

.lumpsum .about-us {
  position: relative;
  padding: 0px 0 80px;
}

.lumpsum .about-us::before {
  content: "";
  display: block;
  position: absolute;
  right: -20px;
  bottom: 80px;
  background: url("../images/section-bg-shape-1.png") no-repeat;
  background-position: right bottom;
  background-size: contain;
  width: 200px;
  height: 200px;
  animation: circlerotate 10s infinite linear;
  animation-direction: alternate;
  z-index: -1;
}

@keyframes circlerotate {
  from {
    transform: translateY(0) rotate(0deg);
  }
  to {
    transform: translateY(-110%) rotate(360deg);
  }
}

.lumpsum .about-us-images {
  position: relative;
  padding: 0;
  margin-right: 30px;
}

.lumpsum .about-image-1 {
  position: relative;
  /* border: 10px solid var(--dark-color); */
  border-radius: 20px;
  z-index: 1;
}

.lumpsum .about-image figure {
  display: block;
  border-radius: 10px;
  overflow: hidden;
}

.lumpsum .about-image img {
  width: 100%;
  object-fit: cover;
}

.lumpsum .about-image-1 .about-image img {
  aspect-ratio: 1 / 0.818;
}

.lumpsum .about-image-circle {
  position: absolute;
  top: 70px;
  right: 0;
  transform: translateX(50%);
}

.lumpsum .about-image-circle img {
  max-width: 150px;
  animation: infiniterotate 30s infinite linear;
}

.lumpsum .about-image-2 {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  max-width: 468px;
}

.lumpsum .about-image-2 .about-image img {
  aspect-ratio: 1 / 0.69;
}

.lumpsum .about-project-info-box {
  position: absolute;
  bottom: 80px;
  left: 0;
  transform: translateX(-50%);
  width: 100%;
  max-width: 245px;
  display: flex;
  align-items: center;
  padding: 18px;
  border-radius: 100px;
  background: var(--accent-color);
  animation: infiniteboxmove 3s infinite linear alternate;
  overflow: hidden;
}

@keyframes infiniteboxmove {
  50% {
    transform: translateX(-20%);
  }
}

.lumpsum .about-project-info-box::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--primary-color);
  height: 100%;
  width: 0;
  border-radius: 100px;
  transition: all 0.4s ease-in-out;
  z-index: -1;
}

.lumpsum .about-project-info-box:hover::after {
  width: 100%;
  right: 100%;
}

.lumpsum .about-project-info-box .icon-box {
  width: 50px;
  height: 50px;
  background-color: var(--dark-color);
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  margin-right: 15px;
}

.lumpsum .about-project-info-box .icon-box img {
  max-width: 25px;
}

.lumpsum .about-project-content {
  width: calc(100% - 65px);
}

.lumpsum .about-project-content h3 {
  font-size: 24px;
  color: var(--dark-color);
  margin-bottom: 5px;
}

.lumpsum .about-project-content p {
  color: var(--dark-color);
  margin-bottom: 0;
}

.lumpsum .about-content-box {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
  justify-content: center;
}

.lumpsum .about-list-box {
  width: calc(65% - 15px);
}

.lumpsum .about-list {
  margin-bottom: 40px;
}

.lumpsum .about-list ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.lumpsum .about-list ul li {
  position: relative;
  text-transform: capitalize;
  line-height: normal;
  padding-left: 30px;
  margin-bottom: 30px;
}

.lumpsum .about-list ul li:last-child {
  margin-bottom: 0;
}

.lumpsum .about-list ul li::before {
  content: "\f192";
  font-family: "Font Awesome 6 Free";
  position: absolute;
  font-size: 18px;
  font-weight: 400;
  color: var(--accent-color);
  top: 2px;
  left: 0;
}
.about-success-info {
  width: 100%;
  border: 1px solid var(--divider-color);
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  display: flex;
  border-radius: 20px;
  align-items: center;
  justify-content: center;
  padding: 20px;
  overflow: hidden;
  gap: 20px;
  background: #000;
}

.lumpsum .about-success-info {
  width: 75%;
  border: 1px solid var(--divider-color);
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  display: flex;
  border-radius: 20px;
  align-items: center;
  justify-content: center;
  padding: 30px;
  overflow: hidden;
  gap: 50px;
}

.lumpsum .about-success-info::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--secondary-color);
  height: 100%;
  width: 100%;
  opacity: 40%;
  z-index: -1;
}
.about-success-info::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--secondary-color);
  height: 100%;
  width: 100%;
  opacity: 40%;
  z-index: -1;
}

.lumpsum .about-success-item {
  /* border-bottom: 1px solid var(--divider-color); */
  /* margin-bottom: 20px;
	padding-bottom: 20px; */
  display: flex;
  gap: 10px;
  align-items: center;
}
.about-success-item {
  /* border-bottom: 1px solid var(--divider-color); */
  /* margin-bottom: 20px;
	padding-bottom: 20px; */
  display: flex;
  gap: 10px;
  align-items: center;
}

.lumpsum .about-success-item:last-child {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}
.about-success-item:last-child {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}

.lumpsum .about-success-item h3 {
  font-size: 30px;
  color: var(--accent-color);
  margin-bottom: 5px;
}

.about-success-item h3 {
  font-size: 30px;
  color: var(--accent-color);
  margin-bottom: 0px;
}

.lumpsum .about-success-item p {
  margin: 0;
}

.about-success-item p {
  margin: 0;
  font-size: 26px;
  color: white;
}

.about-success-item .crtext {
  color: #fff;
  font-size: 26px;
}

#lumpsumTitle {
  font-size: 50px;
}

.lumpcalc-wrapper {
  background: linear-gradient(to bottom, #1c1c1c, #2b2b2b);
  padding: 40px 20px;
  border-radius: 12px;
  max-width: 400px;
  margin: auto;
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.4);
  width: 100%;
}

.lumpcalc-box {
  display: flex;
  flex-direction: column;
  gap: 15px;
  color: #f0f0f0;
}

.lumpcalc-title {
  font-size: 22px;
  text-align: center;
  font-weight: bold;
  color: #ffffff;
  margin-bottom: 10px;
}

.lumpcalc-label {
  font-size: 14px;
  font-weight: 500;
}

.lumpcalc-input {
  padding: 10px;
  border-radius: 8px;
  border: none;
  font-size: 15px;
  background-color: #333;
  color: #fff;
  outline: none;
}

.lumpcalc-input::placeholder {
  color: #aaa;
}

.lumpcalc-calcbtn {
  padding: 12px;
  background-color: #f15a22;
  color: #fff;
  border: none;
  border-radius: 8px;
  font-weight: bold;
  cursor: pointer;
  transition: background 0.3s ease;
}

.lumpcalc-calcbtn:hover {
  background-color: #e25b2c;
}

.lumpcalc-result {
  margin-top: 10px;
  text-align: center;
  font-size: 24px;
  font-weight: bold;
  color: #fff;
}

@media (max-width: 500px) {
  .lumpcalc-wrapper {
    padding: 30px 15px;
    width: 100%;
  }
}

.lumpsum-btn {
  display: flex;
  gap: 20px;
  margin-top: 20px;
}

.sipTitle {
  font-size: 54px !important;
}

#sipPara {
  font-size: 20px;
}

#sip-management-chart-container {
  flex-direction: column;
  width: 100%;
  align-items: center;
}

.sipcalc-wrapper {
  background: linear-gradient(to bottom, #1c1c1c, #2b2b2b);
  padding: 40px 20px;
  border-radius: 12px;
  max-width: 400px;
  width: 100%;
  margin: auto;
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.4);
}

.sipcalc-box {
  display: flex;
  flex-direction: column;
  gap: 15px;
  color: #f0f0f0;
}

.sipcalc-title {
  font-size: 22px;
  text-align: center;
  font-weight: bold;
  color: #ffffff;
  margin-bottom: 10px;
}

.sipcalc-label {
  font-size: 14px;
  font-weight: 500;
}

.sipcalc-input {
  padding: 10px;
  border-radius: 8px;
  border: none;
  font-size: 15px;
  background-color: #333;
  color: #fff;
  outline: none;
}

.sipcalc-input::placeholder {
  color: #aaa;
}

.sipcalc-calcbtn {
  padding: 12px;
  background-color: #f15a22;
  color: #fff;
  border: none;
  border-radius: 8px;
  font-weight: bold;
  cursor: pointer;
  transition: background 0.3s ease;
}

.sipcalc-calcbtn:hover {
  background-color: #e25b2c;
}

.sipcalc-result {
  margin-top: 10px;
  text-align: center;
  font-size: 24px;
  font-weight: bold;
  color: #fff;
}

@media (max-width: 500px) {
  .sipcalc-wrapper {
    padding: 30px 15px;
    width: 100%;
  }
}

/* elss */

.elss-section {
  background-color: #1a1a1a;
  padding: 40px 20px;
  color: #fff;
}

.elss-title {
  text-align: center;
  font-size: 32px;
  font-weight: bold;
  margin-bottom: 30px;
}

.elss-table {
  max-width: 1200px;
  margin: auto;
  border-radius: 10px;
  overflow-x: auto;
}

.elss-header,
.elss-row {
  display: grid;
  grid-template-columns: 2.5fr 1.5fr 1fr 1fr auto;
  align-items: center;
  padding: 16px 20px;
  border-bottom: 1px solid #333;
}

.elss-header {
  background-color: #111;
  font-weight: 600;
}

.elss-row {
  background-color: #1e1e1e;
}

.elss-fund {
  display: flex;
  align-items: center;
  gap: 15px;
}

.elss-fund img {
  width: 30px;
  height: 30px;
  object-fit: contain;
}

.elss-meta {
  font-size: 13px;
  color: #ccc;
  margin-top: 4px;
}

.elss-aum,
.elss-return,
.elss-rating {
  font-size: 15px;
}

.elss-star {
  color: gold;
  margin-right: 4px;
}

.elss-invest-btn {
  background-color: transparent;
  color: #0f0;
  border: 1px solid #0f0;
  padding: 8px 16px;
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.3s ease;
}

.elss-invest-btn:hover {
  background-color: #0f0;
  color: #000;
}

@media (max-width: 768px) {
  .elss-header,
  .elss-row {
    grid-template-columns: 1fr;
    text-align: left;
    gap: 10px;
  }

  .elss-fund {
    flex-direction: row;
    gap: 10px;
  }

  .elss-row {
    padding: 20px;
  }

  .elss-invest-btn {
    width: 100%;
    margin-top: 10px;
  }
}

.elss-table-title {
  font-size: 15px;
}

/* graph */

.dezerv-section {
  background-color: #000;
  color: #fff;
  padding: 100px 20px;
}

.dezerv-left-content h2 {
  font-weight: 300 !important;
  font-size: 56px !important;
  line-height: 70px !important;
  margin-bottom: 16px !important;
}

.dezerv-left-content p {
  font-size: 22px;
  color: #000;
  line-height: 30px;
  margin-bottom: 48px;
}

.dezerv-btn {
  background-color: #fff;
  color: #000;
  padding: 12px 24px;
  border-radius: 30px;
  font-size: 16px;
  border: none;
  margin-top: 30px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.dezerv-right-graph {
  text-align: center;
  margin-top: 30px;
}

.dezerv-graph-img {
  max-width: 100%;
  height: auto;
  width: 512px;
  border-radius: 12px;
  /* background-color: #111; */
  height: 436px;
  padding: 10px;
  object-fit: contain;
}

.dezerv-disclaimer {
  font-size: 12px;
  color: #aaa;
  margin-top: 10px;
}

.dezerv-disclaimer a {
  color: #aaa;
  text-decoration: underline;
}

@media (max-width: 767px) {
  .dezerv-left-content h1 {
    font-size: 28px;
  }

  .dezerv-left-content h2 {
    font-size: 22px;
  }

  .dezerv-btn {
    width: 100%;
    justify-content: center;
  }

  .dezerv-right-graph {
    margin-top: 50px;
  }
}
#sip-calc-btn {
  gap: 20px;
}

/* pms */

.pms-performance-section {
  background-color: #000;
  padding: 150px 20px 100px;
  color: #fff;
}

.pms-performance-left {
  padding: 20px;
  text-align: center;
}

.pms-heading {
  font-size: 28px;
  font-weight: 300;
}

.pms-highlight {
  font-size: 36px;
  font-weight: 700;
  margin: 10px 0 20px;
}

.pms-book-btn {
  background: #fff;
  color: #000;
  padding: 12px 24px;
  border-radius: 30px;
  font-weight: 500;
  border: none;
  cursor: pointer;
}
.pms-performance-chart-wrapper {
  padding: 20px;
  display: flex;
  justify-content: center;
}

.pms-performance-chart {
  background-color: #121212;
  padding: 30px;
  border-radius: 15px;
  text-align: center;
  width: 100%;
  max-width: 480px;
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.5);
}

.pms-chart-title {
  font-size: 20px;
  font-weight: 600;
  color: #fff;
}

.pms-chart-sub {
  font-size: 14px;
  color: #aaa;
  margin-bottom: 20px;
}

.pms-bar-group {
  display: flex;
  justify-content: space-around;
  align-items: flex-end;
  height: 240px;
  margin-bottom: 20px;
}

.pms-bar-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 100%;
  justify-content: flex-end;
}

.pms-bar {
  width: 130px;
  border-radius: 10px 10px 0 0;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  position: relative;
  margin-bottom: 10px;
  transition: all 0.3s ease;
}

.bar-market {
  height: 150px;
  background-color: #888;
}

.bar-pms {
  height: 200px;
  background-color: #f15a22;
}

.pms-bar-label {
  position: absolute;
  /* top: -28px; */
  font-size: 16px;
  font-weight: 600;
  color: #fff;
  background: rgba(0, 0, 0, 0.6);
  padding: 4px 10px;
  border-radius: 10px 10px 0 0;
}

.pms-bar-caption {
  font-size: 13px;
  color: #ccc;
  text-align: center;
  min-height: 36px;
  line-height: 1.3;
}

.pms-chart-footer {
  font-size: 12px;
  color: #999;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.pms-disclaimer {
  font-size: 12px;
  color: #aaa;
  text-decoration: underline;
}

/* Responsive */
@media (max-width: 576px) {
  .pms-bar-group {
    flex-direction: column;
    align-items: center;
    height: auto;
    gap: 30px;
  }

  .pms-bar {
    width: 40px;
  }

  .pms-bar-label {
    font-size: 14px;
  }
}

/* second section */

.whychooseus-section {
  background-color: #111;
  color: #fff;
  padding: 100px 20px;
}

.whychooseus-container {
  max-width: 1200px;
  margin: 0 auto;
}

.whychooseus-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 40px;
  max-width: 75%;
  margin: 25px 0;
}

.whychooseus-header h2 {
  font-size: 2.2rem;
  font-weight: 400;
}

.whychooseus-header strong {
  font-weight: 700;
}

.whychooseus-btn {
  background-color: #fff;
  color: #000;
  font-weight: 600;
  border: none;
  padding: 12px 20px;
  border-radius: 30px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 10px;
}

.whychooseus-cards {
  display: flex;
  gap: 20px;
}

.whychooseus-card {
  background-color: #040404;
  padding: 30px;
  border-radius: 12px;
  text-align: center;
  flex: 1 1 280px;
  max-width: 100%;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.4);
}

.whychooseus-icon {
  background: radial-gradient(circle, #333 30%, #1c1c1c 70%);
  color: #cfcfcf;
  width: 50px;
  height: 50px;
  margin: 0 auto 20px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  box-shadow: 0 0 10px rgba(255, 255, 255, 0.05);
}

.whychooseus-card h3 {
  font-size: 1.6rem;
  margin: 10px 0 5px;
  color: #fff;
}

.whychooseus-card h3 span {
  font-size: 1rem;
  font-weight: normal;
  margin-left: 4px;
}

.whychooseus-card p {
  color: #aaa;
  font-size: 30px;
  text-align: center;
}

/* Responsive Design */
@media (max-width: 768px) {
  .whychooseus-header {
    flex-direction: column;
    gap: 20px;
    text-align: center;
  }
  .slider-buttons {
    flex-direction: column;
  }
  .whychooseus-btn {
    justify-content: center;
  }
  .mySwiperCustom {
    width: 100% !important;
  }
}

.pms-alpha-h4 {
  font-size: 35px !important;
}

#pmsViewBtn {
  justify-content: center;
  gap: 20px;
}

.graph-wrapper {
  background: #111;
  border-radius: 12px;
  padding: 20px;
  box-shadow: 0 0 12px rgba(255, 255, 255, 0.05);
  max-width: 100%;
  width: 100%;
  margin: 40px 0;
}

canvas.dr-performance-chart {
  width: 100%;
  height: 100%;
  /* background-color: #1a1a1a; */
  border-radius: 10px;
}

#alpha-focused-btn {
  justify-content: start;
  gap: 10px;
}

#SIP-whychoose {
  margin-bottom: 15px !important;
  padding-bottom: 15px !important;
}

#SIP-whychoose img {
  max-width: 20px !important;
}

#Sip-right {
  width: 100% !important;
  padding: 0;
}

.nfo-table {
  width: 100%;
  background-color: #1a1a1a;
  color: #fff;
  border: 1px solid #333;
  border-radius: 10px;
  overflow: hidden;
  font-size: 14px;
}

.nfo-header,
.nfo-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 14px;
  border-bottom: 1px solid #2b2b2b;
}

.nfo-header {
  background-color: #222;
  font-weight: bold;
  color: #ccc;
}

.nfo-row {
  background-color: #191919;
}

.nfo-row:hover {
  background-color: #222;
}

.nfo-cell {
  flex: 1;
  min-width: 80px;
  padding: 4px 8px;
  word-break: break-word;
}

.nfo-invest-btn {
  display: inline-block;
  padding: 8px 16px;
  border: 1.5px solid #f15a22;
  color: #ffffff;
  background-color: transparent;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  transition: all 0.3s ease;
}

.nfo-invest-btn:hover {
  background-color: #f15a22;
  color: #000000;
}

/* Responsive tweak */
@media (max-width: 576px) {
  .nfo-header,
  .nfo-row {
    flex-direction: column;
    align-items: flex-start;
  }
  .nfo-cell {
    width: 100%;
    padding: 6px 0;
  }
}

.nfo-upcoming-title {
  font-size: 24px;
  padding: 10px 0;
}

.highlight-newpercentage {
  font-size: 24px;
  font-weight: 600;
  color: #cc5a00; /* Soft, muted orange */
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
  letter-spacing: 0.5px;
  display: inline-block;
}

.fundamental-text {
  font-size: 18px;
  line-height: 1.7;
  color: #ddd;
  /* text-align: center; */
  margin-bottom: 30px;
  padding: 0 20px;
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
}

.fundamental-points {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 20px;
  padding: 0 20px;
}

.fundamental-point {
  background: #1a1a1a;
  border: 1px solid #2d2d2d;
  border-radius: 10px;
  padding: 20px 16px;
  text-align: center;
  font-size: 13px;
  color: #fff;
  transition: background 0.3s ease;
}

.fundamental-point:hover {
  background-color: #222;
}

.fundamental-point span {
  display: block;
  font-size: 22px;
  font-weight: bold;
  color: #f15a22;
  margin-bottom: 6px;
}

.how-it-work {
  position: relative;
  padding: 80px 0;
}

.how-it-work::before {
  content: "";
  display: block;
  position: absolute;
  right: -80px;
  top: 80px;
  background: url(../images/section-bg-shape-5.png) no-repeat;
  background-position: right top;
  background-size: contain;
  width: 250px;
  height: 250px;
  opacity: 50%;
  animation: circlerotate 12s infinite linear;
  animation-direction: alternate;
  z-index: -1;
}

.how-work-list {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}

.how-work-item {
  width: calc(25% - 22.5px);
  height: calc(100% - 30px);
}

.how-work-item .icon-box {
  position: relative;
  background-image: url("/images/arrowIconresearch.png");
  background-repeat: no-repeat;
  background-position: left 120px center;
  background-size: auto;
  margin-bottom: 30px;
  margin-left: 5px;
}

.how-work-item:nth-child(4n + 4) .icon-box,
.how-work-item:last-child .icon-box {
  background-image: none;
}

.how-work-item .icon-box figure {
  position: relative;
  width: 100px;
  height: 100px;
  background-color: var(--dark-color);
  border: 1px solid var(--accent-color);
  border-radius: 50%;
  display: flex;
  align-items: center;
  align-items: center;
  justify-content: center;
  transition: all 0.4s ease-in-out;
  z-index: 1;
}

.how-work-item:hover .icon-box figure {
  position: relative;
  border-color: var(--white-color);
}

.how-work-item .icon-box img {
  width: 100%;
  max-width: 40px;
  transition: all 0.4s ease-in-out;
}

.how-work-item:hover .icon-box img {
  filter: brightness(0) invert(1);
  transform: rotateY(180deg);
}

.how-work-step {
  position: absolute;
  top: 5px;
  left: -5px;
  height: 30px;
  width: 30px;
  background: var(--dark-color);
  border: 1px solid var(--accent-color);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.4s ease-in-out;
  z-index: 2;
}

.how-work-item:hover .how-work-step {
  border-color: var(--white-color);
}

.how-work-step h3 {
  font-size: 14px;
}

.how-work-content h3 {
  font-size: 22px;
  text-transform: capitalize;
  margin-bottom: 10px;
}

.how-work-content p {
  margin: 0;
}

.philosophy-ul {
  list-style: none;
  padding: 0;
  margin: 30px auto;
  max-width: 800px;
  color: #dddddd;
  font-size: 15.5px;
  line-height: 1.8;
}

.philosophy-li {
  position: relative;
  padding-left: 24px;
  margin-bottom: 14px;
  padding-top: 10px;
}

.philosophy-li::before {
  content: "▹";
  position: absolute;
  left: 0;
  top: 0;
  color: #f28500;
  font-size: 30px;
  line-height: 1.5;
}

.tab-section-modern {
  background: #1a1a1a;
  padding: 30px 10px 80px;
  border-radius: 10px;
  color: #fff;
}

.tab-headers {
  display: flex;
  gap: 20px;
  margin-bottom: 25px;
  border-bottom: 1px solid #333;
  padding-bottom: 10px;
}

.tab-btn-modern {
  background: none;
  border: none;
  color: #aaa;
  font-size: 16px;
  font-weight: 500;
  cursor: pointer;
  padding: 10px;
  border-bottom: 2px solid transparent;
  transition: all 0.3s ease;
}

.tab-btn-modern.active {
  color: #fff;
  border-bottom: 2px solid #f28500;
}

.tab-content-modern {
  display: none;
}

.tab-content-modern.active {
  display: block;
}

.recommend-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 15px;
  background: #111;
}

.recommend-table th,
.recommend-table td {
  padding: 14px;
  text-align: left;
  border-bottom: 1px solid #333;
  vertical-align: middle;
}

.recommend-table th {
  color: #aaa;
  font-weight: 500;
  text-transform: uppercase;
  font-size: 13px;
}

.action-icon {
  width: 50px;
  height: 50px;
  margin-right: 8px;
  vertical-align: middle;
}

.table-btn {
  display: inline-block;
  padding: 6px 14px;
  margin: 4px 6px 0 0;
  border-radius: 4px;
  font-size: 13px;
  font-weight: 500;
  text-decoration: none;
  transition: all 0.3s ease;
}

.table-btn.orange {
  background: #f28500;
  color: #fff;
}

.table-btn.orange:hover {
  background: #ff9933;
  color: #111;
}

.table-btn.orange-outline {
  border: 1px solid #f28500;
  color: #f28500;
  background: transparent;
}

.table-btn.orange-outline:hover {
  background: #f28500;
  color: #111;
}

.table-div-btn {
  display: flex;
  align-items: center;
  gap: 10px;
}

.advisory-section {
  background-color: #111;
  color: #fff;
  padding: 50px 20px;
  text-align: center;
}

.advisory-title {
  font-size: 28px;
  margin-bottom: 30px;
  color: #f28500;
}

.advisory-cards {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center;
}

.advisory-card {
  background-color: #1a1a1a;
  border: 1px solid #2a2a2a;
  border-left: 4px solid #f28500;
  padding: 20px;
  max-width: 300px;
  border-radius: 8px;
  text-align: left;
  transition: transform 0.3s;
}

.advisory-card:hover {
  transform: translateY(-5px);
}

.advisory-heading {
  font-size: 20px;
  margin-bottom: 12px;
  color: #fff;
}

.advisory-desc {
  font-size: 15px;
  color: #ccc;
}

.our-fact {
  padding: 80px 0;
}

.our-fact-box {
  position: relative;
  border: 1px solid var(--divider-color);
  background: url("../images/our-fact-box-bg.svg") no-repeat;
  background-position: top right;
  background-size: auto;
  display: flex;
  flex-wrap: wrap;
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  border-radius: 30px;
  overflow: hidden;
}

.our-fact-box::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--secondary-color);
  opacity: 40%;
  z-index: -1;
}

.our-fact-content {
  width: 50%;
  /* background-color: var(--accent-color); */
  background-color: #fff;
  padding: 75px 50px;
}

.our-fact-content .section-title h3::before {
  filter: brightness(0) invert(0);
}

.our-fact-content .section-title h3,
.our-fact-content .section-title h2,
.our-fact-content .section-title h2 span,
.our-fact-content .section-title p {
  color: var(--dark-color);
}

.our-fact-body {
  margin-bottom: 40px;
}

.our-fact-body ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.our-fact-body ul li {
  position: relative;
  color: var(--dark-color);
  text-transform: capitalize;
  line-height: normal;
  padding-left: 30px;
  margin-bottom: 20px;
}

.our-fact-body ul li:last-child {
  margin-bottom: 0;
}

.our-fact-body ul li::before {
  content: "\f192";
  font-family: "Font Awesome 6 Free";
  position: absolute;
  font-size: 18px;
  font-weight: 400;
  color: var(--dark-color);
  top: 2px;
  left: 0;
}

.our-fact-btn .btn-default {
  background: var(--dark-color);
  color: var(--primary-color);
}

.our-fact-btn .btn-default::after {
  display: none;
}

.our-fact-btn .btn-default::before {
  background-color: var(--dark-color);
  background-image: url("../images/arrow-primary.svg");
}

.fact-counter-list {
  width: 50%;
  display: flex;
  flex-wrap: wrap;
  padding: 60px;
}

.fact-counter-item {
  width: 50%;
}

.fact-counter-item {
  padding: 45px 45px 45px 0;
  border-bottom: 1px solid var(--divider-color);
  border-right: 1px solid var(--divider-color);
}

.fact-counter-item:nth-of-type(2n + 2) {
  padding: 45px 0 45px 45px;
  border-bottom: 1px solid var(--divider-color);
  border-right: none;
}

.fact-counter-item:nth-last-child(-n + 2) {
  padding-bottom: 0;
  border-bottom: none;
}

.fact-counter-item:nth-child(-n + 2) {
  padding-top: 0;
}

.fact-counter-item .icon-box {
  margin-bottom: 30px;
}

.fact-counter-item .icon-box img {
  width: 100%;
  max-width: 50px;
  transition: all 0.4s ease-in-out;
}

.fact-counter-item:hover .icon-box img {
  filter: brightness(0) invert(1);
  transform: rotateY(180deg);
}

.fact-counter-content h3 {
  color: var(--accent-color);
  font-size: 40px;
  margin-bottom: 20px;
}

.fact-counter-content p {
  margin: 0;
}

#keyfact {
  font-size: 50px;
}

.capital-split-section {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  background: #0d0d0d;
  color: #fff;
  padding: 60px 30px;
  border-radius: 16px;
  box-shadow: 0 0 20px rgba(255, 102, 0, 0.07);
  gap: 40px;
  flex-wrap: wrap;
  animation: fadeSlideIn 0.8s ease;
}

.capital-left {
  flex: 1;
  min-width: 280px;
}

.capital-heading-split {
  font-size: 28px;
  font-weight: 800;
  background: linear-gradient(to right, #ff7e32, #ff5100);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  line-height: 1.4;
  margin: 0;
}

.capital-right {
  flex: 2;
  min-width: 300px;
}

.capital-description-split {
  font-size: 18px;
  color: #fff;
  line-height: 1.8;
  text-shadow: 0 0 1px rgba(255, 115, 0, 0.4);
  font-weight: 500;
  margin: 0;
}

/* Animation */
@keyframes fadeSlideIn {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Responsive Layout */
@media (max-width: 768px) {
  .capital-split-section {
    flex-direction: column;
    text-align: center;
  }

  .capital-left,
  .capital-right {
    flex: 1 1 100%;
  }

  .capital-heading-split {
    font-size: 22px;
    margin-bottom: 20px;
  }

  .capital-description-split {
    font-size: 16px;
  }
}

#pms-percent-numbers {
  font-size: 24px;
}

.wealth-management-mf-p {
  position: relative !important;
}

#wealth-management-chart-container {
  flex-direction: column;
  align-items: center;
}

.equity-btn-div {
  display: flex;
  /* gap: 10px; */
}

.equity-btn-div .hero-btn a {
  margin-right: 10px;
}

.kotak-app-section {
  background-color: #000;
  color: #fff;
  padding: 60px 20px;
}

.kotak-app-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 1280px;
  margin: 0 auto;
  flex-wrap: wrap;
  gap: 40px;
}

.kotak-app-title {
  flex: 1; /* 40% width approx */
  min-width: 300px;
}

.kotak-app-title h2 {
  font-size: 50px;
  line-height: 1.4;
  font-weight: bold;
  color: #f15a22;
}

.kotak-app-title span {
  color: #fff;
}

.kotak-app-content {
  flex: 1.2;
  min-width: 320px;
  max-width: 700px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: end;
}

.kotak-app-content p {
  font-size: 20px;
  line-height: 1.6;
  color: #ddd;
  margin-bottom: 0px;
}

.kotak-app-buttons {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.kotak-app-buttons a {
  width: fit-content;
  color: #ccc;
}

.highlight-word {
  color: #f15a22;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .kotak-app-container {
    flex-direction: column;
    align-items: flex-start;
  }

  .kotak-app-title h2 {
    font-size: 26px;
  }
}

.execution-partner {
  margin-top: 40px;
  text-align: left;
  display: flex;
  align-items: center;
}

.execution-title {
  color: #eaeaea;
  font-size: 24px;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 8px;
  font-weight: 600;
}

.kotak-logo {
  max-height: 70px;
  width: auto;
  filter: brightness(1.1) contrast(1.2);
}

#trade-btn-div {
  gap: 20px;
}

#app-sections {
  padding: 50px 0;
}

.ekyc-section-dark {
  background-color: #0e0e0e;
  color: #fff;
  padding: 60px 20px;
}

.ekyc-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 40px;
  flex-wrap: wrap;
  max-width: 1200px;
  margin: 0 auto;
}

.ekyc-text {
  flex: 1 1 65 0px;
}

.ekyc-title {
  font-size: 40px;
  font-weight: 700;
  margin-bottom: 20px;
  line-height: 1.4;
}

.ekyc-title span {
  color: #f15a22;
}

.ekyc-description {
  font-size: 18px;
  line-height: 1.6;
  color: #ccc;
  margin-bottom: 30px;
}

.ekyc-cta a {
  display: inline-block;
  margin-right: 16px;
  padding: 12px 24px;
  font-size: 15px;
  border-radius: 6px;
  text-decoration: none;
  transition: all 0.3s ease;
}

.btn-ekyc-primary {
  background-color: #f15a22;
  color: #fff;
  font-weight: 600;
}

.btn-ekyc-primary:hover {
  background-color: #ff6e17;
  color: #111;
}

.btn-ekyc-secondary {
  border: 1px solid #f15a22;
  color: #f15a22;
  background-color: transparent;
}

.btn-ekyc-secondary:hover {
  background-color: #f15a22;
  color: #111;
}

.ekyc-visual {
  flex: 1 1 330px;
  text-align: center;
}

.ekyc-visual img {
  max-width: 100%;
  height: auto;
  border-radius: 10px;
}

.trading-section {
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  /* flex-direction: row-reverse; */
  max-width: 1200px;
  padding: 20px 0px 20px;
  /* box-shadow: 2px 2px 10px #ccc; */
  width: 100%;
  border-radius: 20px;
}

/* Left Image Container */
.image-container {
  flex: 1;
  text-align: center;
  display: flex;
  justify-content: center;
}

.trading-img {
  display: none;
  width: 100%;
  max-width: 350px;
  border-radius: 10px;
}

.trading-img.active {
  display: block;
}

/* Right FAQ Container */
.faq-container {
  /* flex: 1; */
  max-width: 400px;
  border-radius: 20px;
  padding: 10px;
  width: 100%;
  background: linear-gradient(to bottom, #1b1b1b, #000000);
}

.faq-item {
  /* background: rgba(255, 255, 255, 0.1); */
  margin-bottom: 5px;
  border-radius: 5px;
  overflow: hidden;
}

.faq-question {
  width: 100%;
  text-align: left;
  padding: 5px 15px;
  border: none;
  background: none;
  color: white;
  font-size: 16px;
  font-weight: bold;
  cursor: pointer;
  transition: background 0.3s;
  display: block;
}

.faq-question.active {
  /* background: rgba(255, 255, 255, 0.2); */
}

.faq-answer {
  max-height: 0;
  overflow: hidden;
  transition:
    max-height 0.4s ease-out,
    opacity 0.4s ease-out,
    padding 0.3s;
  opacity: 0;
  /* background: white; */
  color: #fff;
  padding: 0 15px;
}

.faq-answer.active {
  max-height: 90px; /* Fixed height */
  opacity: 1;
  padding: 15px;
}

.faq-answer p {
  margin-bottom: 5px;
}

.start-trading {
  display: block;
  width: 100%;
  padding: 15px;
  background: #f15a22;
  color: white;
  text-align: center;
  font-weight: bold;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  margin-top: 10px;
}

.start-trading:hover {
  background: #fff;
  color: #f15a22;
}

/* Responsive */
@media (max-width: 768px) {
  .trading-section {
    flex-direction: column;
    text-align: center;
    gap: 20px;
  }

  .faq-container {
    max-width: 100%;
  }
}

.steps-container {
  background: #1e1e1e;
  padding: 30px;
  border-radius: 12px;
  box-shadow: 0 4px 10px rgba(255, 255, 255, 0.1);
  max-width: 600px;
  margin: 40px auto;
  color: #fff;
  margin-bottom: 100px;
}

.steps-container h3 {
  color: #fff;
}
.step {
  display: flex;
  align-items: center;
  margin-bottom: 20px;
}
.step-number {
  width: 40px;
  height: 40px;
  background: #ff5e00;
  color: #fff;
  font-weight: bold;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  margin-right: 15px;
}
.step-text {
  flex: 1;
  font-size: 16px;
}

.what-we-do-page {
  padding-top: 100px;
}

.ekyc-p {
  margin-top: 20px;
  font-size: 20px;
}

.ekyc-a {
  color: darkblue;
  font-size: 18px;
  padding-top: 20px;
}

.kotakAppImg {
  width: 70%;
  /* border-radius: 20px; */
  padding-bottom: 20px;
}

.dezerv-graph-swiper {
  width: 100%;
  height: auto;
}

.dezerv-graph-swiper .swiper-slide {
  display: flex;
  justify-content: center;
  align-items: center;
}

.kotak-store-buttons {
  display: flex;
  gap: 30px;
  margin-bottom: 15px;
  flex-wrap: wrap;
  align-items: center;
  margin-top: 20px;
}
.download-app-text {
  margin-bottom: 0;
  font-size: 24px;
}
.store-btn {
  /* display: flex; */
  align-items: center;
  gap: 6px;
  padding: 10px 14px;
  /* background-color: #fff; */
  color: #111;
  border-radius: 6px;
  font-weight: 600;
  text-decoration: none;
  font-size: 14px;
  transition: background-color 0.3s ease;
}

.store-btn:hover {
  /* background-color: #e5e5e5; */
}

.store-icon {
  width: 150px;
  height: auto;
}

.testimonials-div {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  align-items: start;
}

#pms-hero-section {
  padding: 150px 0 100px;
}

.pms-hero-btns {
  display: flex;
  /* justify-content: center; */
}

.flagship-heading {
  font-size: 40px;
  color: #000;
}
#lets-understand-btns {
  justify-content: center;
}

#alphabtns-div {
  margin-top: 20px;
}

#wealthBtn-div {
  flex-direction: column;
}

.lollipop-chart-section {
  background-color: #0c0c0c;
  padding: 40px 20px;
  display: flex;
  justify-content: center;
  border-radius: 40px;
}

.lollipop-chart-container {
  max-width: 800px;
  width: 100%;
  position: relative;
}

.lollipop-chart-container canvas {
  width: 100% !important;
  height: auto !important;
}

#researchReports-title {
  font-size: 56px;
}

/* goal based */
.unique-approach-slider-wrapper {
  width: 100%;
  overflow: hidden;
  background: #000;
  border-radius: 10px;
  margin: 20px 0;
}

.unique-approach-slider {
  display: flex;
  width: 200%;
  transition: transform 0.5s ease;
}

.unique-approach-slide {
  flex: 0 0 50%;
  box-sizing: border-box;
  padding: 20px;
}

.unique-approach-slide p {
  color: #ccc;
  font-size: 20px;
}

.unique-approach-tabs button {
  padding: 10px 20px;
  margin-right: 10px;
  border: none;
  font-weight: bold;
  color: #fff;
  background-color: #1a1a1a;
  cursor: pointer;
  font-size: 24px;
  border-radius: 10px;
}

.unique-approach-tabs button.active {
  background-color: #e95b25;
  color: #fff;
}

.unique-approach-tabs .market-btn {
  background-color: #e95b25;
  color: #fff;
  padding: 12px 24px;
  border: none;
  cursor: pointer;
  margin-top: 10px;
}
.goal-based-div {
  width: 100%;
  text-align: center;
  margin-bottom: 20px;
}
.key-highlights {
  text-align: left;
  color: #fff;
  list-style: none;
  font-size: 20px;
  padding-left: 0px;
  /* display: flex; */
}
.solution-key-highlights {
  text-align: left;
  color: #fff;
  list-style: none;
  font-size: 20px;
  padding-left: 0px;
}
.inner-keys {
  display: flex;
  justify-content: space-between;
}

.solution-inner-keys li h4 {
  font-size: 16px;
  color: #fff;
  font-weight: normal;
}

.key-highlights li h4,
.solution-key-highlights li h4 {
  font-size: 18px;
  color: #fff;
  font-weight: normal;
}

.mf-goal-cards {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.mf-goal-card {
  background: #1e1e1e;
  color: #ffffff;
  padding: 20px;
  border-radius: 10px;
  text-align: center;
  height: 90%;
  width: 90%;
  box-shadow: 0px 4px 8px rgba(255, 255, 255, 0.1);
  transition: transform 0.3s ease-in-out;
}
.mf-goal-card:hover {
  transform: scale(1.05);
}
.mf-goal-card h3 {
  font-size: 20px;
  margin-bottom: 10px;
  color: #fff;
}
.mf-goal-card p {
  font-size: 16px;
  opacity: 0.8;
  line-height: 1.3;
}

#plan-heading {
  line-height: 1.3;
  text-align: left;
  font-size: 30px;
  padding-left: 30px;
  margin-bottom: 20px;
}

.equity-text-gradient {
  color: #e95b25;
  font-weight: bold;
}

.unique-approach-section {
  padding-bottom: 0px;
}

#mf-chaturai {
  padding: 100px 0;
}

#disclaimer-col {
  margin-top: 50px;
}

.footer-title {
  margin-bottom: 10px;
}

.footer-links {
  padding: 20px 10px;
}

.disclaimer-heading {
  font-size: 20px;
  color: #ffffff;
  margin-bottom: 10px;
}

.disclaimer-marquee {
  color: #ffffff;
  font-size: 14px;
  padding: 10px 0;
  background: transparent;
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.disclaimer-links {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  padding-top: 15px;
}

.disclaimer-links a {
  color: #ffffff;
  text-decoration: none;
  font-size: 14px;
  transition: color 0.3s ease;
}

.disclaimer-links a:hover {
  color: #40b454; /* Highlight green */
}

.who-we-are {
  padding: 150px 0 50px;
}

/* vision mission */
#visionMission {
  padding-bottom: 50px;
}

#visionMission .our-services {
  padding: 80px 0;
}

#visionMission .service-item {
  position: relative;
  background: url("../images/service-bg.svg") no-repeat;
  background-position: top left;
  background-size: auto;
  border: 1px solid var(--divider-color);
  border-radius: 30px;
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  height: calc(100% - 30px);
  margin-bottom: 30px;
  padding: 40px;
  transition: all 0.4s ease-in-out;
  overflow: hidden;
  width: 100%;
  display: block;
}

#visionMission .service-item:hover {
  transform: translateY(-5px);
}

#visionMission .service-item::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: var(--secondary-color);
  opacity: 40%;
}

#visionMission .service-item-header {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 100px;
}

#visionMission .service-item-header .icon-box img {
  max-width: 60px;
}

#visionMission .service-arrow a img {
  max-width: 34px;
  transition: all 0.3s ease-in-out;
}

#visionMission .service-item:hover .service-arrow a img {
  filter: brightness(0) invert(1);
  transform: rotate(45deg);
}

#visionMission .service-item-body {
  position: relative;
}

#visionMission .service-item-body h3 {
  font-size: 22px;
  text-transform: capitalize;
  margin-bottom: 20px;
}

#visionMission .service-item-body p {
  margin-bottom: 0;
}

#visionMission .service-footer {
  margin-top: 20px;
}

#visionMission .service-footer p {
  text-align: center;
  margin-bottom: 0;
}

#visionMission .service-footer p a {
  font-weight: 700;
  text-transform: capitalize;
  text-decoration: underline;
  color: var(--accent-color);
  transition: all 0.3s ease-in-out;
}

#visionMission .service-footer p a:hover {
  color: var(--primary-color);
}

/* our journey */

#our-journey .our-testimonial {
  position: relative;
  padding: 80px 0;
}

#our-journey .our-testimonial::before {
  content: "";
  display: block;
  position: absolute;
  right: -60px;
  bottom: 10%;
  background: url(../images/section-bg-shape-6.png) no-repeat;
  background-position: right bottom;
  background-size: contain;
  opacity: 70%;
  width: 306px;
  height: 304px;
  animation: roundrotate 10s infinite linear alternate;
  z-index: -1;
}

#our-journey .testimonial-slider .swiper-wrapper {
  cursor: none;
}

#our-journey .testimonial-item {
  position: relative;
  background: #181818;
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
  border: 1px solid var(--divider-color);
  border-radius: 30px;
  backdrop-filter: blur(100px);
  -webkit-backdrop-filter: blur(100px);
  border-radius: 30px;
  overflow: hidden;
  box-shadow: 2px 2px 10px #4a4949;
}

#our-journey .testimonial-item::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--secondary-color);
  opacity: 40%;
  width: 100%;
  height: 100%;
  z-index: -1;
}

#our-journey .testimonial-header {
  border-bottom: 1px solid var(--divider-color);
  padding: 20px 35px 0;
  height: 230px;
}

#our-journey .testimonial-content {
  margin-bottom: 30px;
}

#our-journey .testimonial-content p {
  margin: 0;
  font-weight: normal;
  font-size: 18px;
}

#our-journey .testimonial-author {
  display: flex;
  align-items: center;
}

#our-journey .author-image {
  margin-right: 20px;
}

#our-journey .author-image figure {
  border-radius: 50%;
}

#our-journey .author-image img {
  max-width: 50px;
  border-radius: 50%;
}

#our-journey .author-content {
  width: calc(100% - 70px);
}

#our-journey .author-content h3 {
  font-size: 22px;
  text-transform: capitalize;
  margin-bottom: 5px;
}

#our-journey .author-content p {
  text-transform: capitalize;
  margin: 0;
}

#our-journey .testimonial-body {
  display: flex;
  align-items: center;
  padding: 35px;
}

#our-journey .testimonial-counter {
  width: calc(100% - 50px);
}

#our-journey .testimonial-counter h2 {
  font-size: 40px;
  margin-bottom: 5px;
  color: #f15a22;
}

#our-journey .testimonial-counter p {
  text-transform: capitalize;
  margin: 0;
}

#our-journey .testimonial-quote {
  margin-left: 20px;
}

#our-journey .testimonial-quote img {
  max-width: 30px;
}

#our-journey .testimonial-slider .testimonial-pagination {
  position: relative;
  margin-top: 50px;
  text-align: center;
}

#our-journey
  .testimonial-slider
  .testimonial-pagination
  .swiper-pagination-bullet {
  position: relative;
  height: 8px;
  width: 8px;
  background: var(--accent-color);
  opacity: 1;
  margin: 0 8px;
  transition: all 0.3s ease-in-out;
}

#our-journey
  .testimonial-slider
  .testimonial-pagination
  .swiper-pagination-bullet:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: 0;
  width: 0;
  border-radius: 50%;
  transition: all 0.3s ease-in-out;
}

#our-journey
  .testimonial-slider
  .testimonial-pagination
  .swiper-pagination-bullet-active {
  background: var(--accent-color);
}

#our-journey
  .testimonial-slider
  .testimonial-pagination
  .swiper-pagination-bullet-active:before {
  border: 1px solid var(--accent-color);
  height: 20px;
  width: 20px;
}

/* our team */

#our-team .our-team {
  position: relative;
  padding: 80px 0 50px;
}

#our-team .our-team::before {
  content: "";
  display: block;
  position: absolute;
  left: -70px;
  bottom: 10px;
  background: url(../images/section-bg-shape-5.png) no-repeat;
  background-position: left bottom;
  background-size: contain;
  opacity: 40%;
  width: 255px;
  height: 260px;
  animation: circlemoverotate 10s infinite linear;
  animation-direction: alternate;
  z-index: -1;
}

#our-team .team-item {
  position: relative;
  border-radius: 30px;
  height: calc(100% - 30px);
  margin-bottom: 30px;
  overflow: hidden;
}

#our-team .team-image a {
  display: block;
  cursor: none;
}

#our-team .team-image img {
  width: 100%;
  aspect-ratio: 1 / 1.091;
  object-fit: cover;
  border-radius: 30px;
  transition: all 0.4s ease-in-out;
}

#our-team .team-item:hover .team-image img {
  transform: scale(1.1);
}

#our-team .team-body {
  position: absolute;
  bottom: 30px;
  left: 30px;
  right: 30px;
  border-radius: 20px;
  backdrop-filter: blur(50px);
  -webkit-backdrop-filter: blur(50px);
  overflow: hidden;
  padding: 15px 20px;
  transition: all 0.4s ease-in-out;
  z-index: 2;
  transform: none;
}

#our-team figure {
  aspect-ratio: auto;
}

#our-team .team-body::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  background-color: var(--primary-color);
  opacity: 12%;
  width: 100%;
  height: 100%;
  z-index: 0;
}

#our-team .team-body::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  bottom: auto;
  background: var(--accent-color);
  height: 100%;
  width: 100%;
  transition: all 0.4s ease-in-out;
  z-index: -1;
}

#our-team .team-item:hover .team-body::after {
  top: 0;
}

#our-team .team-content {
  position: relative;
  z-index: 1;
  text-align: left;
  padding: 0 10px;
}

#our-team .team-content h3 {
  font-size: 22px;
  text-transform: capitalize;
  margin-bottom: 10px;
  transition: all 0.4s ease-in-out;
}

#our-team .team-content h3 a {
  color: inherit;
}

#our-team .team-content p {
  margin: 0;
  transition: all 0.4s ease-in-out;
}

#our-team .team-item:hover .team-content p,
#our-team .team-item:hover .team-content h3 {
  color: var(--dark-color);
}

#our-team .team-social-list {
  position: relative;
  display: flex;
  height: 0;
  opacity: 0;
  visibility: hidden;
  transition: all 0.4s ease-in-out;
  z-index: 1;
}

#our-team .team-item:hover .team-social-list {
  height: 35px;
  opacity: 1;
  visibility: visible;
}

#our-team .team-social-list ul {
  list-style: none;
  margin: 15px 0 0 0;
  padding: 0;
}

#our-team .team-social-list ul li {
  display: inline-block;
  margin-right: 10px;
}

#our-team .team-social-list ul li:last-child {
  margin: 0;
}

#our-team .team-social-list ul li a i {
  color: var(--dark-color);
  font-size: 20px;
  transition: all 0.3s ease-in-out;
}

#our-team .team-social-list ul li:hover a i {
  color: var(--primary-color);
}

#investmentBanking-lists {
  padding-top: 100px;
}

.list-btn {
  display: flex;
}

.research-reports-btn {
  display: flex;
  justify-content: center;
  gap: 20px;
}

#corporate-div h3 {
  font-size: 30px;
}

#corporate-div p {
  font-size: 20px;
}

#investor-service p {
  font-size: 20px;
}

#about-parah {
  font-size: 20px;
}

#aboutHeader {
  font-size: 80px;
}

#corporateHeading {
  font-size: 56px;
}
.highlight-text {
  color: #f15a22;
}

.gi-card {
  background-color: #111; /* dark background */
  border: 1px solid #e95b2533;
  border-radius: 12px;
  padding: 30px 20px;
  text-align: center;
  max-width: 320px;
  margin: auto;
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
  height: 300px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  box-shadow: 6px 6px 5px rgb(246 68 0 / 18%);
}

.gi-card:hover {
  /* transform: translateY(-5px); */
}

.gi-card-heading {
  font-size: 1.5rem;
  color: #fff;
  margin-bottom: 20px;
  font-weight: 600;
}

/* The button class .btn-view-more uses your existing styles */
.btn-view-more {
  display: inline-block;
  text-decoration: none;
}

.gi-card .hero-btn a {
  margin-right: 0;
}

#fixedIncome-div {
  padding-left: 200px;
}

.deven-pms-chart-container {
  position: relative;
  width: 100%;
  max-width: 100%;

  background-color: #0a0a0a; /* Optional, match your card bg */
  border-radius: 10px;
  padding: 10px;
  box-sizing: border-box;
}

#devenPMSChart {
  width: 100% !important;
  height: 100% !important;
  display: block;
}

@media (max-width: 576px) {
  .deven-pms-chart-container {
    padding: 0 5px;
    aspect-ratio: 1/1;
  }

  #devenPMSChart {
    /* min-height: 150px;
	min-width: 350px; */
  }

  .deven-caption {
    font-size: 12px;
    text-align: center;
  }
}

.deven-caption {
  color: #999;
  font-size: 13px;
  margin-top: 10px;
  font-style: italic;
}

.call-tabs-hero {
  background: #000;
  color: #fff;
  padding: 40px 20px;
  /* font-family: 'Segoe UI', sans-serif; */
}

.call-container-section {
  position: relative;
  height: max-content; /* Example height */
}

.call-tabs-nav {
  position: sticky;
  top: 0px;
  background: #000;
  z-index: 100;
  margin-top: 50px;
  max-width: 100%;
  margin: 0 auto;
}

#call-tabs-nav-id {
  max-width: 80%;
  margin: 0 auto;
}

.call-tabs-nav ul {
  display: flex;
  gap: 30px;
  justify-content: space-between;
  border-bottom: 1px solid #333;
  border-top: 1px solid #333;
  padding-top: 15px;
  padding-bottom: 15px;
  margin-bottom: 0px;
  list-style: none;
  flex-wrap: wrap;
}

.call-tabs-nav a {
  color: #aaa;
  text-decoration: none;
  font-size: 20px;
  position: relative;
  padding-bottom: 4px;
  transition: color 0.3s;
}

.call-tabs-nav a.active,
.call-tabs-nav a:hover {
  color: #fff;
}

.call-tabs-nav a.active::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  height: 2px;
  width: 100%;
  background: #fff;
  transition: width 0.3s ease;
}

.call-tabs-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  flex-wrap: wrap;
}

.call-tabs-content {
  flex: 1;
  min-width: 300px;
}

.call-tabs-content h1 {
  font-size: 50px;
  font-weight: 400;
  margin-bottom: 16px;
}

.call-tabs-content h1 span {
  font-weight: 700;
  font-size: 56px;
  display: inline-block;
}

.call-tabs-content p {
  font-size: 14px;
  color: #aaa;
}

.call-tabs-features {
  margin: 16px 0;
  padding: 0;
  list-style: none;
}

.call-tabs-features li::marker {
  list-style: none;
}

.call-tabs-features li {
  font-size: 16px;
  margin-bottom: 10px;
  color: #fff;
  list-style: none;
}

.call-tabs-button {
  display: inline-block;
  background: #fff;
  color: #000;
  padding: 12px 20px;
  font-size: 16px;
  border-radius: 30px;
  text-decoration: none;
  font-weight: 500;
  margin-top: 20px;
}

.call-tabs-disclaimer {
  margin-top: 12px;
}

.call-tabs-disclaimer a {
  color: #aaa;
  text-decoration: underline;
  font-size: 13px;
}

.call-tabs-image {
  flex: 1;
  min-width: 300px;
}

.call-tabs-image img {
  width: 100%;
  border-radius: 20px;
  object-fit: cover;
}

.mutual-problem-section {
  background: #000;
  color: #fff;
  padding: 80px 20px 40px;
}

.mutual-problem-section .container {
  max-width: 1200px;
  margin: 0 auto;
}

.mutual-problem-section h2 {
  font-size: 56px;
  font-weight: 400;
  line-height: 1.4;
  text-align: left;
  margin-bottom: 10px;
  max-width: 70%;
  /* margin: auto; */
}

.mutual-problem-section .orange-bold {
  font-weight: 700;
  color: #f15a22;
  font-size: 42px;
}

.mutual-subtext {
  font-size: 18px;
  color: #b3b3b3;
  margin-bottom: 40px;
  text-align: left;
  /* margin: 10px auto 40px; */
  max-width: 70%;
}

.mutual-cards {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  /* justify-content: center; */
  margin-bottom: 30px;
}

.mutual-card {
  height: 250px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background-color: #0c0c0c;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  padding: 30px;
  flex: 1 1 300px;
  min-width: 280px;
  /* max-width: 400px; */
  box-shadow: 0 0 2px rgba(255, 255, 255, 0.05);
}

.mutual-card h3 {
  font-size: 48px;
  color: #f15a22;
  font-weight: bold;
  margin-bottom: 10px;
}

.mutual-card p {
  color: #aaa;
  font-size: 17px;
  margin: 0;
}

.mutual-find-link {
  display: inline-block;
  font-size: 15px;
  color: #f15a22;
  text-decoration: underline;
  margin-top: 10px;
  text-align: left;
  transition: all 0.3s ease;
  width: 100%;
}

.mutual-find-link:hover {
  color: #fff;
  text-decoration: none;
}

#pms-solution-tabs {
  gap: 100px;
}

/* Responsive */
@media (max-width: 768px) {
  .mutual-problem-section h2 {
    font-size: 38px;
    max-width: 100%;
  }
  .call-tabs-content h1,
  .call-tabs-content h1 span {
    font-size: 30px;
    line-height: 1.1;
  }
  .call-tabs-nav ul {
    padding-left: 0;
  }

  .mutual-problem-section .orange-bold {
    font-size: 30px;
  }

  .mutual-cards {
    flex-direction: column;
  }

  .mutual-card {
    width: 100%;
  }

  .mutual-subtext,
  .mutual-find-link {
    text-align: left;
  }
}

.returns-pms-section {
  background: #000;
  color: #fff;
  padding: 60px 20px;
}

.returns-pms-container {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  max-width: 1300px;
  margin: 0 auto;
  gap: 40px;
}

.returns-pms-left {
  flex: 1;
  min-width: 300px;
}

.returns-pms-left h2 {
  font-size: 56px;
  line-height: 1.3;
  font-weight: 400;
}

.returns-pms-left h2 strong {
  font-weight: 700;
  color: #fff;
}

.returns-pms-btn {
  margin-top: 30px;
  display: inline-block;
  background: #fff;
  color: #000;
  padding: 14px 26px;
  border-radius: 40px;
  font-weight: 600;
  text-decoration: none;
  font-size: 20px;
}

.returns-pms-right {
  flex: 1;
  min-width: 300px;
  text-align: center;
}

.returns-pms-bars {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  gap: 60px;
  margin-bottom: 30px;
  height: 300px;
}

.returns-pms-bar {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  width: 100px;
  border-radius: 10px;
  position: relative;
  padding-bottom: 40px;
}

.benchmark-bar {
  background: #777;
  height: 220px;
}

.dezerv-bar {
  background: #6d8745;
  height: 260px;
}

.returns-pms-value {
  color: #fff;
  font-weight: 700;
  font-size: 18px;
  position: absolute;
  top: 16px;
  left: 50%;
  transform: translateX(-50%);
}

.returns-pms-label {
  margin-top: 10px;
  font-size: 14px;
  display: block;
}

.returns-pms-options {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  background: #111;
  padding: 14px 10px;
  border-radius: 14px;
  margin-bottom: 20px;
  gap: 10px;
}

.returns-pms-options button {
  background: transparent;
  border: none;
  color: #aaa;
  font-size: 15px;
  cursor: pointer;
  padding: 6px 12px;
  border-radius: 4px;
  transition: all 0.2s ease;
}

.returns-pms-options button.active {
  color: #fff;
  font-weight: 600;
}

.returns-pms-bottom {
  display: flex;
  justify-content: space-between;
  font-size: 13px;
  color: #aaa;
}

.returns-pms-disclaimer {
  color: #aaa;
  text-decoration: underline;
  font-size: 13px;
}

/* Responsive */
@media (max-width: 768px) {
  .returns-pms-container {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .returns-pms-bottom {
    flex-direction: column;
    align-items: center;
    gap: 5px;
  }
  .returns-pms-left h2 {
    font-size: 40px;
  }
}

#onlyPay-container {
  align-items: center;
}

#pmsHero {
  height: 100vh;
}

.marginBottomMinus {
  margin-bottom: -50px;
}

/* Container for all benefits */
.sip-benefits-list {
  display: flex;
  flex-direction: column;
  gap: 0px;
  padding: 15px;
  background-color: #fff;
}

/* Individual card */
.sip-benefit-card {
  display: flex;
  align-items: flex-start;
  gap: 15px;
  padding: 15px;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
}

.sip-benefit-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
}
#research-benefit-icon {
  flex: 0 0 20px;
}
/* Icon container */
.sip-benefit-icon img {
  width: 40px;
  height: 40px;
  object-fit: contain;
}

/* Text styling */
.sip-benefit-text h3 {
  font-size: 20px;
  color: #222;
  margin-bottom: 4px;
}

.sip-benefit-text p {
  font-size: 18px;
  color: #555;
  line-height: 1.5;
  margin: 0;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .sip-benefit-text h3 {
    font-size: 18px;
  }
  .sip-benefit-text p {
    font-size: 16px;
  }
}

.lumpsumpText {
  font-size: 18px !important;
}

.chaturMixedSection {
  padding: 0 !important;
}

.mtf-dark-section {
  background-color: #0f0f0f;
  color: #fff;
  padding: 30px 20px;
}

.mtf-dark-heading {
  text-align: center;
  margin-bottom: 30px;
}

.mtf-dark-subheading {
  color: #fff;
  font-weight: 600;
  text-transform: uppercase;
  margin-bottom: 8px;
  font-size: 24px;
}

.mtf-dark-title {
  font-size: 28px;
  font-weight: 600;
  color: #ffffff;
  text-align: left;
}

/* Grid of Cards */
.mtf-dark-features {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 24px;
  margin-top: 30px;
}

/* Card Styles */
.mtf-dark-card {
  background-color: #1a1a1a;
  border-radius: 12px;
  padding: 24px;
  transition: all 0.3s ease;
  border: 1px solid transparent;
}

.mtf-dark-card:hover {
  border-color: #f15a22;
  background-color: #222;
}

.mtf-dark-icon {
  font-size: 24px;
  margin-bottom: 12px;
}

.mtf-dark-card-title {
  font-size: 18px;
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 6px;
}

.mtf-dark-card-desc {
  font-size: 14px;
  color: #cccccc;
}

/* Button Styles */
.mtf-dark-button-wrap {
  text-align: center;
  margin-top: 40px;
}

.mtf-dark-button {
  background-color: #f15a22;
  color: #ffffff;
  padding: 12px 30px;
  font-size: 16px;
  border-radius: 8px;
  text-decoration: none;
  display: inline-block;
  transition: background 0.3s ease;
  font-weight: 600;
}

.mtf-dark-button:hover {
  background-color: #f15a22;
}

/* Responsive Text Adjustments */
@media (max-width: 480px) {
  .mtf-dark-title {
    font-size: 22px;
  }

  .mtf-dark-card-title {
    font-size: 16px;
  }

  .mtf-dark-card-desc {
    font-size: 13px;
  }
}

.mtf-work-section {
  background-color: #0f0f0f;
  color: #ffffff;
  padding: 60px 20px;
  text-align: center;
}

.mtf-work-heading h2 {
  font-size: 28px;
  margin-bottom: 40px;
  font-weight: 600;
}

.mtf-work-flow {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 20px;
}

.mtf-work-box {
  background-color: #1a1a1a;
  border-radius: 12px;
  padding: 24px 32px;
  min-width: 200px;
  text-align: left;
  border: 1px solid #333;
}

.mtf-work-label {
  font-size: 16px;
  color: #ccc;
  margin-bottom: 8px;
}

.mtf-work-amount {
  font-size: 20px;
  font-weight: 600;
  color: #ffffff;
}

.mtf-work-sign {
  font-size: 24px;
  font-weight: 700;
  color: #ffffff;
  margin: 0 10px;
}

/* Responsive Styling */
@media (max-width: 768px) {
  .mtf-work-flow {
    flex-direction: column;
  }

  .mtf-work-sign {
    margin: 10px 0;
  }

  .mtf-work-box {
    text-align: center;
  }
}
.lowfunds {
  color: #fff;
  font-size: 24px;
  line-height: 1.3;
  text-align: left;
  font-weight: bold;
}
.chaturmargin {
  color: #f15a22;
  margin-top: 20px;
  font-weight: bold;
}

.slbm-contact-section {
  background: #000;
  padding: 60px 20px;
  color: #ffffff;
}

.slbm-wrapper {
  max-width: 1100px;
  margin: auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
}

.slbm-content {
  flex: 1 1 400px;
}

.slbm-heading {
  font-size: 2rem;
  font-weight: 600;
  margin-bottom: 10px;
  color: #ffffff;
}

.slbm-subheading {
  font-size: 1.25rem;
  color: #9ca3af;
  margin-bottom: 30px;
}

.slbm-btn {
  display: inline-block;
  padding: 12px 28px;
  background: #f15a22;
  color: #fff;
  border-radius: 8px;
  text-decoration: none;
  font-weight: 500;
  transition: background 0.3s ease;
  margin: 15px 0;
}

.slbm-btn:hover {
  background: #a6191b;
}

.slbm-image {
  flex: 1 1 300px;
  text-align: center;
}

.slbm-image img {
  max-width: 100%;
  height: auto;
  border-radius: 20px;
  /* box-shadow: 0 2px 10px rgb(107 107 107); */
}

/* Responsive */
@media (max-width: 768px) {
  .slbm-wrapper {
    flex-direction: column-reverse;
    text-align: center;
  }

  .slbm-content {
    margin-top: 20px;
  }
}

#speakBTNDiv {
  justify-content: start;
}

.commodity-section {
  background-color: #000000;
  padding: 60px 20px;
  color: #ffffff;
  border-radius: 20px;
}

.commodity-container {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  max-width: 1200px;
  margin: auto;
  gap: 40px;
}

.commodity-left,
.commodity-center,
.commodity-right {
  flex: 1 1 300px;
}

.commodity-definition {
  background: #1a1a1a;
  padding: 30px;
  border-radius: 16px;
  color: #d1d5db;
  font-size: 1rem;
  line-height: 1.6;
  box-shadow: 0 0 10px rgba(255, 255, 255, 0.05);
}

.commodity-image {
  width: 100%;
  border-radius: 16px;
  box-shadow: 0 10px 30px rgba(255, 255, 255, 0.05);
  /* max-width: 300px; */
}

.commodity-box-container {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.commodity-box {
  background-color: #1e1e1e;
  padding: 30px 20px 20px;
  border-radius: 12px;
  width: 300px;
  text-align: center;
  box-shadow: 0 0 12px rgba(255, 255, 255, 0.04);
  transition: transform 0.3s ease;
}

.commodity-box:hover {
  transform: translateY(-5px);
}

.commodity-highlight {
  font-size: 1.8rem;
  font-weight: bold;
  color: #e95b25;
}

.commodity-box-text {
  font-size: 0.95rem;
  color: #ffffff;
  margin-top: 6px;
}

/* Responsive */
@media (max-width: 768px) {
  .commodity-container {
    flex-direction: column;
    text-align: center;
  }

  .commodity-left,
  .commodity-center,
  .commodity-right {
    flex: 1 1 100%;
  }

  .commodity-image {
    margin: 0 auto;
  }
}
#commodityboxContainer {
  flex-direction: row;
}

#market-heading {
  font-size: 40px;
  margin-bottom: 30px;
  text-align: center;
  font-family: Helvetica, Arial, sans-serif;
}

.tradein-card .hero-btn a {
  margin-right: 0;
}

/* Card Container */
.fando-cards {
  background-color: #1e1e1e;
  border-radius: 12px;
  padding: 20px;
  text-align: center;
  margin-bottom: 20px;
  position: relative;
  margin: 10px 0px;
  width: 90%;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
  transition: transform 0.3s;
  height: 150px;
}

.fando-cards:hover {
  transform: translateY(-5px);
}

/* Header Section */
.fando-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.fando-header h5 {
  color: #e95b25;
}

.fando-logo {
  width: 30px;
  height: 30px;
}

.fando-sell {
  background-color: #ff4c4c;
  color: white;
  padding: 5px 12px;
  border-radius: 20px;
}

.fando-buy {
  background-color: #4caf50;
  color: white;
  padding: 5px 12px;
  border-radius: 20px;
}

/* Tag Section */
.fando-tag {
  background-color: rgba(255, 255, 255, 0.1);
  color: #ccc;
  font-size: 12px;
  padding: 5px 10px;
  border-radius: 16px;
  display: inline-block;
  margin-top: 10px;
}

/* Price and Return */
.fando-label {
  color: #aaa;
  /* margin: 8px 0 4px; */
  font-size: 20px;
}

.fando-price {
  font-weight: bold;
  color: #f5f5f5;
  font-size: 20px;
}

.fando-return {
  font-weight: bold;
  color: #ff4c4c;
}

.fando-return.text-success {
  font-weight: bold;
  color: #4caf50;
}

/* Locked Cards */
.fando-locked {
  filter: blur(4px);
  position: relative;
}

.fando-lock {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: rgba(0, 0, 0, 0.7);
  border-radius: 50%;
  padding: 20px;
}

.fando-lock i {
  font-size: 24px;
  color: white;
}

#fando-btn {
  margin-top: 20px;
}

#fando-btn a {
  margin-right: 0;
}

.full-potential-title {
  color: #fff;
  margin-bottom: 20px;
  font-size: 30px;
  margin-left: 20px;
  text-align: center;
}
.fando-advantage-ul {
  text-align: left;
  color: #fff;
  list-style: none;
  font-size: 20px;
  padding-left: 10px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 20px;
}

.fando-advantage-ul h4 {
  font-size: 20px;
  color: #fff;
}

.fando-advantage-ul p {
  color: #ccc;
  font-size: 20px;
  margin: 0px 0;
  text-align: left;
}

.fando-advantage-ul li {
  flex: 1 1 calc(50% - 20px); /* Two items per row with spacing */
}
.advantage-box {
  display: flex;
  align-items: center;
  background: #1f1f1f;
  border-radius: 12px;
  padding: 0px 20px;
  color: #f0f0f0;
  box-shadow: 0 0 10px rgba(0, 0, 0, 1);
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
  min-height: 100px;
}

.advantage-box:hover {
  transform: translateY(-4px);
  box-shadow: 0 0 20px rgba(255, 255, 255, 0.1);
}

.icon-img {
  width: 24px;
  height: 24px;
  margin-right: 15px;
  margin-top: 4px;
}

.insurance-slide-card {
  background-color: transparent;
  padding: 20px;
  border-radius: 12px;
  text-align: center;
  cursor: pointer;
  transition: transform 0.3s;
  display: flex;
  flex-direction: column;
  align-items: center;
  border: 1px solid #484848;
  height: 100% !important;
}

.insurance-slide-card:hover {
  transform: translateY(-5px);
}

.insurance-slide-card img {
  width: 200px;
  height: 100px;
  object-fit: contain;
  margin-bottom: 10px;
}

.insurance-slide-card p {
  color: #fff;
  font-size: 15px !important;
}
.insurance-slide-card .hero-btn a {
  margin-right: 0;
}

.adv-benefit-cards {
  background: #1e1e1e; /* Dark card background */
  border-radius: 12px;
  padding: 40px 25px;
  transition: all 0.3s ease;
  border: 1px solid rgba(255, 255, 255, 0.1); /* Soft border */
  box-shadow: 0px 4px 20px rgba(255, 255, 255, 0.1);
  text-align: left;
  height: 90%;
}

.adv-benefit-cards:hover {
  box-shadow: 0px 4px 20px rgba(255, 255, 255, 0.2);
  transform: translateY(-5px);
}

.adv-benefit-content {
  display: flex;
  align-items: start;
  flex-direction: column;
  gap: 20px;
}

.adv-benefit-icon {
  background: rgba(255, 255, 255, 0.1);
  border-radius: 50%;
  width: 65px;
  height: 65px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.adv-benefit-icon-img {
  max-width: 80%; /* Set small width for icon image */
  height: auto;
}

.adv-benefit-heading {
  color: #ffffff;
  font-size: 20px;
  margin-bottom: 8px;
}

.adv-benefit-description {
  color: #ccc;
  font-size: 14px;
  line-height: 1.5;
}

.why-icon {
  width: 50px;
}

.metalP {
  color: #fff !important;
  font-size: 18px !important;
  line-height: 1.2 !important;
}

#equityProblem {
  font-size: 24px !important;
  line-height: 1.3 !important;
}

.mf-section-unique {
  max-width: 1200px;
  margin: auto;
  padding: 40px 20px;
  text-align: center;
}

.mf-section-unique h2 {
  font-size: 50px;
  font-weight: bold;
  margin-bottom: 10px;
}

.mf-section-unique p {
  color: #aaa;
  font-size: 16px;
  margin-bottom: 40px;
}

.mf-boxes-unique {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.mf-box-unique {
  background: #111;
  padding: 30px 10px;
  border-radius: 12px;
  text-align: left;
  transition: transform 0.3s ease;
}

.mf-box-unique:hover {
  transform: translateY(-5px);
}

.mf-box-unique h3 {
  font-size: 22px;
  color: #ff5a00;
  margin-bottom: 10px;
}

.mf-box-unique p {
  font-size: 15px;
  color: #ccc;
  margin: 0;
}

/* Responsive */
@media (max-width: 992px) {
  .mf-boxes-unique {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 576px) {
  .mf-boxes-unique {
    grid-template-columns: 1fr;
  }
}

.mf-result-unique {
  font-size: 18px;
  margin-top: 15px;
  color: #ddd;
}

.mf-result-unique strong {
  color: #ff5a00; /* Highlight color (orange) */
}

.mf-result-unique span {
  color: #fff; /* Keep text bright */
}

.mf-highlight-number {
  color: #ff5a00; /* Bright orange highlight */
  font-weight: bold; /* Make it stand out */
  text-shadow: 0 0 6px rgba(255, 90, 0, 0.6); /* Soft glow effect */
}

#products-Hero {
  padding: 150px 0 100px;
}

.custom-list-unique {
  list-style: none;
  margin: 0;
  padding: 0;

  border-radius: 12px;
  overflow: hidden;
}

.custom-list-unique li {
  display: flex;
  align-items: center;
  gap: 12px;
  background: #1e1e1e; /* slightly lighter for contrast */
  color: #f5f5f5;
  font-size: 16px;
  font-weight: 500;
  padding: 14px 18px;
  margin-bottom: 10px;
  border-radius: 8px;
  transition: background 0.3s ease;
}

.custom-list-unique li:hover {
  background: #242424; /* hover effect */
}

.custom-list-unique li::before {
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url("../images/dots.png") no-repeat center center;
  background-size: contain;
  flex-shrink: 0;
}

.rebalanceCard-dark {
  background-color: #1a1a1a;
  border-radius: 12px;
  padding: 16px 20px;
  color: white;

  max-width: 500px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
  margin-bottom: 10px;
}

.rebalanceCard-left {
  display: flex;
  flex-direction: column;
}

.rebalanceCard-label {
  font-size: 18px;
  color: #fff;
  margin-bottom: 4px;
}

.rebalanceCard-highlight {
  color: #e35e00;
  font-size: 30px;
  font-weight: bold;
  text-shadow: 0 0 6px rgba(227, 94, 0, 0.7);
}

.rebalanceCard-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.rebalanceCard-detail {
  font-size: 18px;
  margin-bottom: 4px;
}

.rebalanceCard-key {
  color: #fff;
  margin-right: 6px;
}

.rebalanceCard-value {
  display: block;
  color: #e35e00;
  font-weight: bold;
  font-size: 30px;
  text-shadow: 0 0 5px rgba(227, 94, 0, 0.6);
}

.dezerv-left-content .research-swiper-section {
  /* background-color: #121212; */
  /* padding: 50px 20px; */
}

.dezerv-left-content .research-slide-card {
  background: linear-gradient(145deg, #1e1e1e, #2a2a2a);
  padding: 40px 30px;
  border-radius: 16px;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.6);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
  max-width: 700px;
  margin: 0 auto;
  text-align: left;
  height: 300px;
}

.dezerv-left-content .research-slide-icon {
  font-size: 32px;
  color: #d12023; /* Highlight color */
}

.dezerv-left-content .research-slide-text {
  color: #f1f1f1;
  font-size: 22px;
  line-height: 1.7;
}

.dezerv-left-content .research-swiper-pagination {
  margin-top: 20px;
  text-align: center;
}

.dezerv-left-content .research-swiper-pagination .swiper-pagination-bullet {
  background: #f15a22;
  opacity: 0.6;
  transition: all 0.3s ease;
}

.dezerv-left-content
  .research-swiper-pagination
  .swiper-pagination-bullet-active {
  background: #fff;
  opacity: 1;
  transform: scale(1.2);
}

#researchSolutionTabs {
  gap: 20px;
}

.ipoReportsTitle {
  color: #000 !important;
  top: 50px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

.tagline {
  display: block;
  font-weight: normal;
  font-size: 16px;
  text-align: center;
}

.swing-swiper-box {
  width: 100%;
  max-width: 500px; /* stays within flex:1 */
  background: #121212;
  height: 400px;
  margin-top: 20px;
  padding: 15px;
  border-radius: 12px;
  flex: 1;
}

.swing-slide {
  color: #fff;
  text-align: center;
}

.swing-slide-title {
  font-size: 18px;
  margin-bottom: 12px;
  color: #f15a22;
}

.swing-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
  background: #1e1e1e;
  border-radius: 8px;
  overflow: hidden;
}

.swing-table th,
.swing-table td {
  padding: 8px 10px;
  text-align: center;
  border-bottom: 1px solid #333;
  color: #f1f1f1;
}

.swing-table th {
  background: #f15a22;
  color: #fff;
  font-weight: 600;
}

.swing-blur {
  filter: blur(3px);
  opacity: 0.6;
}

.swing-note {
  margin-top: 10px;
  font-size: 13px !important;
  color: #eee;
}

.swing-details {
  text-align: left;
  margin-top: 15px;
  font-size: 14px;
}

.swing-details h4 {
  color: #f15a22;
  margin-top: 10px;
}

.swing-swiper-pagination {
  margin-top: 12px;
  text-align: center;
}

.swing-swiper-pagination .swiper-pagination-bullet {
  background: #f15a22;
  opacity: 0.6;
  transition: 0.3s;
}

.swing-swiper-pagination .swiper-pagination-bullet-active {
  background: #fff;
  opacity: 1;
  transform: scale(1.2);
}

/* Responsive */
@media (max-width: 600px) {
  .swing-table th,
  .swing-table td {
    font-size: 12px;
    padding: 6px;
  }
  .swing-slide-title {
    font-size: 16px;
  }
}

#alphaInvestList {
  background: #000;
}

#alphaInvestCard {
  background: none;
}

.alpha-invest-section {
  background: #0d0d0d;
  color: #fff;
  padding: 60px 20px;
}

.alpha-container {
  max-width: 1100px;
  margin: 0 auto;
}

.alpha-hero {
  text-align: center;
  margin-bottom: 40px;
}

.alpha-title {
  font-size: 28px;
  line-height: 1.4;
}

.alpha-highlight {
  color: #f15a22;
}

.alpha-tagline {
  margin-top: 10px;
  font-size: 18px;
  color: #bbb;
}

.alpha-btn {
  margin-top: 20px;
  display: inline-block;
  background: #f15a22;
  color: #fff;
  padding: 12px 24px;
  border-radius: 30px;
  text-decoration: none;
  transition: background 0.3s ease;
}

.alpha-btn:hover {
  background: #ff6a1a;
}

.alpha-narrative {
  margin: 40px 0;
}

.alpha-list {
  list-style: none;
  padding: 0;
  margin: 0;
  max-width: 900px;
  display: grid;
  grid-template-columns: repeat(3, 330px);
  gap: 15px;
}

.alpha-list li {
  margin-bottom: 18px;
  padding: 14px 18px 14px 55px;
  position: relative;
  font-size: 16px;
  line-height: 1.7;
  color: #b7b7b7;
  background: #000000;
  border-radius: 12px;
  box-shadow: 2px 1px 4px #5c5c5c;
  transition: all 0.3s ease;
}

.alpha-list li::before {
  content: "";
  position: absolute;
  left: 18px;
  top: 50%;
  transform: translateY(-50%);
  width: 22px;
  height: 22px;
  background: url("/images/dots.png") no-repeat center center;
  background-size: contain;
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.15));
  transition: transform 0.3s ease;
}

/* Subtle bounce for icon on hover */
.alpha-list li:hover::before {
  transform: translateY(-50%) scale(1.1);
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .alpha-list li {
    font-size: 15px;
    padding: 12px 14px 12px 50px;
  }

  .alpha-list li::before {
    width: 18px;
    height: 18px;
    left: 15px;
  }
}

.alpha-journey-title {
  font-size: 40px !important;
  text-align: center !important;
  margin-bottom: 20px !important;
  color: #f15a22 !important;
  max-width: 100% !important;
}

.alpha-slide {
  background: #1a1a1a;
  border-radius: 12px;
  height: 400px;
  padding: 20px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5);
}

.alpha-slide h3 {
  color: #fff;
  margin-bottom: 10px;
}

.alpha-slide p {
  color: #ccc;
  font-size: 14px;
  margin-bottom: 10px;
}

.alpha-swiper-pagination .swiper-pagination-bullet {
  background: #f15a22;
  opacity: 0.6;
}

.alpha-swiper-pagination .swiper-pagination-bullet-active {
  background: #fff;
  opacity: 1;
  transform: scale(1.2);
}

/* Responsive */
@media (max-width: 768px) {
  .alpha-title {
    font-size: 22px;
  }
  .alpha-slide {
    padding: 15px;
  }
}

.alpha-slide h3 {
  margin-bottom: 15px;
  color: #f15a22;
}

.alpha-slide-img img {
  max-width: 100%;
  border-radius: 10px;
  width: 250px;
}

.alpha-steps {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
}

.alpha-step {
  flex: 1 1 45%;
  background: #222;
  padding: 12px;
  border-radius: 8px;
  text-align: center;
  font-size: 14px;
  color: #fff;
}

.alpha-table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 10px;
}

.alpha-table th,
.alpha-table td {
  border: 1px solid #333;
  padding: 8px;
  font-size: 14px;
  color: #eee;
  text-align: center;
}

.alpha-table th {
  background: #1f1f1f;
  color: #f15a22;
}

#alpha-risk-chart2,
#alpha-risk-chart,
#alpha-risk-chart3 {
  max-width: 250px;
  max-height: 250px;
  display: flex;
  justify-content: center;
}

.alpha-slide-info {
  margin-top: 15px;
  font-size: 14px;
  color: #333;
}

.alpha-slide-info p {
  margin: 4px 0;
}

/* Container styling */
.portfolio-health-section {
  color: #fff;
  padding: 40px 20px;
}

.portfolio-health-container {
  max-width: 1200px;
  margin: 0 auto;
}

/* Top cards: side by side */
.portfolio-health-top {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  margin-bottom: 30px;
}

.portfolio-health-card {
  flex: 1 1 300px;
  background: #111;
  border: 1px solid #333;
  border-radius: 10px;
  padding: 25px;
  box-sizing: border-box;
}

.portfolio-health-card h3 {
  color: #f15a22;
  font-size: 45px;
  margin-bottom: 10px;
}

.portfolio-health-card p {
  font-size: 16px;
  line-height: 1.5;
  color: #ddd;
}

/* Middle card: Outputs you receive */
.portfolio-health-middle {
  background: #111;
  border: 1px solid #333;
  border-radius: 10px;
  padding: 25px;
  text-align: center;
}

.portfolio-health-middle h3 {
  color: #f15a22;
  font-size: 45px;
  margin-bottom: 15px;
}

.portfolio-health-middle ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.portfolio-health-middle ul li {
  margin-bottom: 10px;
  font-size: 16px;
  line-height: 1.5;
  position: relative;
  padding-left: 25px;
}

/* Custom bullet using image */
.portfolio-health-middle ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 6px;
  width: 14px;
  height: 14px;
  background: url("images/dots.png") no-repeat center center;
  background-size: contain;
}

.upload-content,
.analyse-content,
.review-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  padding: 1rem 2rem;
}

.upload-card p,
.analyse-card p,
.review-card p {
  color: #fff;
  margin-bottom: 0;
}

.upload-card,
.analyse-card,
.review-card {
  display: flex;
  align-items: flex-start;
  background: #121212;
  padding: 1rem 1.2rem;
  border-radius: 12px;
  gap: 1rem;
  width: 100%;
  max-width: 500px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.8);
  transition:
    transform 0.3s,
    box-shadow 0.3s;
}

.upload-card:hover,
.analyse-card:hover,
.review-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 25px rgba(229, 94, 0, 0.6);
}

.dot-icon {
  width: 20px;
  height: 20px;
  margin-top: 4px;
}

.highlight {
  color: #f15a22;
  font-weight: bold;
}

.upload-img img,
.analyse-img img,
.review-img img {
  width: 100%;
  max-width: 350px;
  border-radius: 15px;
  margin-top: 1.5rem;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4);
}

.review-btn {
  background-color: #f15a22;
  color: #fff;
  border: none;
  padding: 0.8rem 1.5rem;
  border-radius: 8px;
  cursor: pointer;
  font-weight: bold;
  margin-top: 1.5rem;
  transition:
    background 0.3s,
    transform 0.3s;
}

.review-btn:hover {
  background-color: #ff7b33;
  transform: scale(1.05);
}

/* Responsive */
@media (max-width: 768px) {
  .upload-card,
  .analyse-card,
  .review-card {
    flex-direction: row;
    width: 90%;
  }

  .upload-img img,
  .analyse-img img,
  .review-img img {
    max-width: 90%;
  }
}

.btnGroup {
  display: flex;
  margin-top: 50px;
  justify-content: center;
}

.btnGroup .hero-btn a {
  margin-right: 20px;
}

.analyse-box {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1rem;
  background: #1a1a1a;
  padding: 1.5rem 2rem;
  border-radius: 15px;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.5);
}

.analyse-item {
  background: #2a2a2a;
  padding: 0.8rem 1.2rem;
  border-radius: 10px;
  max-width: 160px;
  width: 100%;
  /* width: 100%; */
  text-align: center;
  font-weight: bold;
  color: #fff;
  transition:
    transform 0.3s,
    box-shadow 0.3s;
}

.highlight {
  color: #f15a22;
}

/* Image styling */
.analyse-img img {
  width: 100%;
  max-width: 400px;
  border-radius: 15px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4);
}

/* Responsive */
@media (max-width: 768px) {
  .analyse-box {
    flex-direction: column;
    gap: 1rem;
  }

  .analyse-item {
    min-width: 80%;
  }

  .analyse-img img {
    max-width: 90%;
  }
}

.plan-table {
  width: 100%;
  border-collapse: collapse;
  margin: 1rem 0;
  color: #fff;
}
.plan-table th,
.plan-table td {
  border: 1px solid #444;
  padding: 0.6rem;
  text-align: center;
}
.plan-table th {
  background: #2a2a2a;
  color: #f15a22;
}

.outputs-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 0;
  margin-top: 1.5rem;
}
.output-card {
  background: #1a1a1a;
  padding: 0;
  border-radius: 12px;
  text-align: center;
  color: #fff;
  transition:
    transform 0.3s,
    box-shadow 0.3s;
}
.output-card img {
  width: 40px;
  margin-bottom: 0.5rem;
}
.output-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 6px 20px rgba(229, 94, 0, 0.6);
}

.order-text {
  color: #f15a22;
  font-weight: bold;
  font-size: 22px;
}

/* Order Book Section */
.alpha-orderbook {
  margin: 0px auto;
  background: #f9f9fb;
  border: 1px solid #ddd;
  border-radius: 12px;
  padding: 20px;
  max-width: 600px;
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.08);
}

/* Header */
.alpha-orderbook-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 15px;
}

.alpha-orderbook-header h4 {
  font-size: 1.3rem;
  font-weight: 700;
  color: #333;
  margin: 0;
}

.alpha-orderbook-sort {
  padding: 6px 10px;
  border-radius: 6px;
  border: 1px solid #ccc;
  font-size: 0.9rem;
  cursor: pointer;
}

/* Reviews */
.alpha-orderbook-reviews {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.alpha-review {
  background: #fff;
  border-radius: 8px;
  padding: 12px 15px;
  border-left: 4px solid #f15a22;
}

.alpha-review-text {
  margin: 0 0 6px;
  font-size: 0.95rem;
  color: #000 !important;
  font-style: italic;
}

.alpha-review-client {
  font-size: 0.85rem;
  font-weight: 600;
  color: #f15a22;
}

/* Responsive */
@media (max-width: 768px) {
  .alpha-orderbook {
    padding: 15px;
    max-width: 100%;
  }

  .alpha-orderbook-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .alpha-orderbook-sort {
    width: 100%;
  }
}

/* Execute Slide Container */
.execute-box {
  margin: 0px auto;
  /* background: #fff7f0; */
  /* border: 1px solid #f2c7a6; */
  border-radius: 12px;
  padding: 25px;
  max-width: 700px;
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.08);
  text-align: center;
}

/* Header */
.execute-header h4 {
  font-size: 1.4rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: 8px;
}

.execute-subtitle {
  font-size: 0.95rem;
  color: #555;
  margin-bottom: 25px;
}

/* Steps Layout */
.execute-steps {
  display: flex;
  justify-content: space-between;
  gap: 15px;
  flex-wrap: wrap;
}

.execute-step {
  flex: 1 1 calc(25% - 10px);
  background: #fff;
  border-radius: 10px;
  padding: 15px;
  border: 1px solid #f2c7a6;
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
}

.execute-step:hover {
  transform: translateY(-5px);
  box-shadow: 0px 6px 16px rgba(0, 0, 0, 0.15);
}

/* Step Icon */
.execute-icon {
  width: 40px;
  height: 40px;
  margin: 0 auto 10px;
  border-radius: 50%;
  background: #f15a22;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 1rem;
}

.execute-step p {
  font-size: 0.9rem;
  font-weight: 600;
  margin: 0;
  color: #333;
}

/* Responsive */
@media (max-width: 768px) {
  .execute-step {
    flex: 1 1 100%;
  }
}

/* Wrapper (no background color) */
.posttrade-box {
  margin: 20px auto;
  max-width: 750px;
  padding: 10px 0;
}

/* Header */
.posttrade-header h4 {
  font-size: 1.4rem;
  font-weight: 700;
  color: #f15a22; /* brand pink */
  margin-bottom: 20px;
  border-left: 4px solid #f15a22;
  padding-left: 10px;
}

/* Steps */
.posttrade-step {
  display: flex;
  align-items: flex-start;
  margin-bottom: 20px;
  justify-content: center;
  gap: 15px;
}

.posttrade-icon {
  font-size: 1.6rem;
  min-width: 40px;
  text-align: center;
  color: #f15a22;
}

.posttrade-info h5 {
  margin: 0 0 6px;
  font-size: 1rem;
  font-weight: 700;
  color: #fff;
}

.posttrade-info p,
.posttrade-info ul {
  margin: 0;
  font-size: 0.9rem;
  color: #ccc;
  line-height: 1.4;
}

.posttrade-info ul {
  padding-left: 18px;
  list-style-type: none;
}

/* Status highlights */
.success {
  color: #28a745;
  font-weight: 600;
}
.fail {
  color: #dc3545;
  font-weight: 600;
}
.partial {
  color: #ffc107;
  font-weight: 600;
}

/* Responsive */
@media (max-width: 576px) {
  .posttrade-step {
    flex-direction: column;
    gap: 8px;
  }
  .posttrade-icon {
    font-size: 1.4rem;
  }
}

/* Common Slide Box */
.workflow-step-box {
  max-width: 750px;
  margin: 0 auto;
  padding: 20px;
  text-align: center;
}

.workflow-step-box h4 {
  font-size: 1.5rem;
  font-weight: 700;
  color: #f15a22;
  margin-bottom: 10px;
}

.workflow-step-box p {
  font-size: 0.95rem;
  color: #fff;
  margin-bottom: 20px;
}

/* Discover */
.discover-chart img {
  max-width: 250px;
  /* border: 1px solid #ddd; */
  border-radius: 10px;
}

/* Narrow */
.narrow-tags {
  display: flex;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
}
.narrow-tags .tag {
  background: #fff3ec;
  border: 1px solid #f15a22;
  color: #f15a22;
  font-size: 0.85rem;
  padding: 6px 12px;
  border-radius: 20px;
  font-weight: 600;
}

/* Decide */
.decide-card {
  /* background: #fff; */
  border: 1px solid #f15a22;
  border-radius: 10px;
  padding: 15px;
  max-width: 280px;
  margin: 0 auto;
}
.decide-card h5 {
  font-size: 1rem;
  font-weight: 700;
  margin: 0 0 8px;
}
.workflow-btn {
  margin-top: 10px;
  padding: 10px 18px;
  background: #f15a22;
  border: none;
  border-radius: 6px;
  color: #fff;
  font-weight: 600;
  cursor: pointer;
}
.workflow-btn:hover {
  background: #c74c00;
}

/* Record */
.record-table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 15px;
  font-size: 0.9rem;
}
.record-table th,
.record-table td {
  border: 1px solid #ddd;
  padding: 8px;
  color: #000;
}

.record-table td {
  color: #fff;
}
.record-table th {
  background: #fff3ec;
  font-weight: 600;
}
.record-table td.success {
  color: #28a745;
  font-weight: 600;
}
.record-table td.fail {
  color: #dc3545;
  font-weight: 600;
}
.record-table td.partial {
  color: #ffc107;
  font-weight: 600;
}

/* Responsive */
@media (max-width: 576px) {
  .workflow-step-box {
    padding: 15px;
  }
  .discover-chart img {
    max-width: 100%;
  }
  .decide-card {
    width: 100%;
  }
  .record-table {
    font-size: 0.8rem;
  }
}

/* Tabs Wrapper */
.tabs-wrapper {
  max-width: 1100px;
  margin: auto;
}

/* Tabs Navigation */
.tabs-nav {
  display: flex;
  justify-content: center;
  gap: 60px;
  position: sticky;
  top: 60px;
  background: #000;
  padding: 10px 0;
  z-index: 10;
  border-bottom: 1px solid #333;
}

.tab-btn {
  padding: 10px 20px;
  border: none;
  background: #f15a22;
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  border-radius: 25px;
  transition: all 0.3s ease;
  color: #fff;
}

.tab-btn.active {
  background: #fff; /* rose gold */
  color: #f15a22;
}

/* Tab Content Sections */
.tab-section {
  min-height: 80vh; /* ensures scrolling space */
  padding: 40px 20px;
  border-bottom: 1px solid #ddd;
}

.tab-section h2 {
  margin-bottom: 15px;
  color: #000;
}

.tab-section p {
  /* max-width: 800px; */
  line-height: 1.6;
}

/* Responsive */
@media (max-width: 768px) {
  .tabs-nav {
    flex-direction: column;
    align-items: center;
  }

  .tab-btn {
    width: 90%;
    text-align: center;
  }
}

#cycle_alpha {
  line-height: 1.3;
  font-size: 18px;
}

.beta-swiper-section {
  width: 100%;
  /* padding: 50px 20px; */
  /* background: #fdfdfd; */
}

.beta-swiper {
  width: 100%;
  max-width: 1100px;
  margin: auto;
}

.beta-slide {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 30px;
  background: #fff;
  border-radius: 15px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
  text-align: center;
  min-height: 450px;
}

.beta-title {
  font-size: 1.6rem;
  font-weight: 600;
  margin-bottom: 20px;
  color: #000;
}

.beta-slide-img img {
  max-width: 220px;
  margin-bottom: 20px;
}

.beta-slide-info p {
  font-size: 1rem;
  margin-bottom: 10px;
  color: #333;
}

.beta-highlight {
  color: #f15a22;
  font-weight: bold;
}

.beta-steps {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  max-width: 400px;
}

.beta-step {
  padding: 12px;
  background: #fff7f3;
  border: 1px solid #e5c2c4;
  border-radius: 8px;
  text-align: left;
  font-weight: 500;
  color: #444;
}

.beta-table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 20px;
}

.beta-table th,
.beta-table td {
  padding: 12px;
  border: 1px solid #ddd;
  text-align: center;
  color: #000;
}

.beta-table th {
  background: #f15a22;
  color: #fff;
}

.beta-swiper-nav .swiper-button-next,
.beta-swiper-nav .swiper-button-prev {
  color: #fff;
  background: #f15a22;
  width: 38px;
  height: 38px;
  border-radius: 50%;
}

.beta-swiper-nav .swiper-button-next::after,
.beta-swiper-nav .swiper-button-prev::after {
  font-size: 18px;
}

.beta-swiper-pagination .swiper-pagination-bullet {
  background: #000;
  opacity: 0.7;
}

.beta-swiper-pagination .swiper-pagination-bullet-active {
  background: #f15a22;
  opacity: 1;
}

/* Responsive */
@media (max-width: 768px) {
  .beta-slide {
    padding: 20px;
    min-height: 350px;
  }

  .beta-title {
    font-size: 1.3rem;
  }

  .beta-slide-img img {
    max-width: 160px;
  }
}

.pas-getstarted-section {
  background: #121212; /* Dark theme background */
  color: #f5f5f5;
  padding: 60px 20px;
}

.pas-getstarted-container {
  /* max-width: 1100px; */
  margin: 0 auto;
  text-align: center;
}

.pas-heading {
  font-size: 2.2rem;
  margin-bottom: 15px;
  color: #ffffff;
}

.pas-subtext {
  font-size: 1.1rem;
  color: #bbb;
  margin-bottom: 40px;
}

.pas-steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 5px;
  margin-bottom: 150px;
}

.pas-step {
  background: #000;
  border-radius: 12px;
  padding: 25px;
  text-align: left;
  box-shadow: 2px 2px 10px #2e2e2e;
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
}

.pas-step-title {
  font-size: 21px;
  margin-bottom: 12px;
  color: #f15a22; /* Highlight color */
}

.pas-step-desc {
  font-size: 18px;
  line-height: 1.5;
  color: #ddd;
}

.pas-sublist {
  list-style: none;
  padding: 0;
  margin: 0;
}

.pas-sublist li {
  margin-bottom: 0px;
  font-size: 1rem;
  color: #fff;
}

.pas-sublist li strong {
  color: #fff;
}

/* Responsive tweaks */
@media (max-width: 768px) {
  .pas-heading {
    font-size: 1.8rem;
  }
  .pas-subtext {
    font-size: 1rem;
  }
  .pas-step {
    padding: 20px;
  }
}

.pas-issues-section {
  background: #111; /* Dark page background */
  padding: 70px 20px;
  color: #000;
}

.pas-issues-container {
  margin: 0 auto;
  text-align: center;
}

.pas-issues-heading {
  font-size: 50px !important;
  margin-bottom: 15px;
  color: #fff; /* heading stays white */
  text-align: center !important;
  max-width: 100% !important;
}

.pas-issues-subtext {
  font-size: 1.1rem;
  color: #bbb;
  margin-bottom: 50px;
}

.pas-issues-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 25px;
}

.pas-issues-card {
  background: #121212;
  border-radius: 12px;
  padding: 25px 25px 0 25px;
  box-shadow: 2px 2px 10px #2e2e2e;
  text-align: left;
  transition: transform 0.3s ease;
}

.pas-issues-title {
  font-size: 1.3rem;
  margin-bottom: 12px;
  color: #f15a22;
}

.pas-issues-desc {
  font-size: 1rem;
  line-height: 1.6;
  color: #ccc;
}

/* Responsive */
@media (max-width: 768px) {
  .pas-issues-heading {
    font-size: 1.8rem;
  }
  .pas-issues-card {
    padding: 20px;
  }
}

#slideHealthTitle {
  font-size: 23px;
}

/* Shared Title + Subtext */
.beta-title {
  font-size: 1.6rem;
  color: #f15a22;
  margin-bottom: 12px;
}

.beta-subtext {
  font-size: 1rem;
  color: #444;
  margin-bottom: 20px;
}

/* Upload/Connect */
.beta-options {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
}

.beta-option-card {
  background: #fafafa;
  border: 1px solid #eee;
  border-radius: 10px;
  padding: 20px;
  flex: 1;
  min-width: 150px;
  text-align: center;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.beta-icon {
  font-size: 2rem;
  display: block;
  margin-bottom: 10px;
}

/* Analyse */
.beta-metrics {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 12px;
}

.beta-metrics li {
  background: #fafafa;
  padding: 12px 15px;
  border-radius: 8px;
  border: 1px solid #eee;
  font-size: 0.95rem;
  color: #333;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
}

/* Review Report */
.beta-downloads {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
  margin-bottom: 20px;
}

.beta-download-card {
  flex: 1;
  min-width: 180px;
  background: #fafafa;
  border: 1px solid #eee;
  border-radius: 10px;
  padding: 15px;
  text-align: center;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.beta-btn {
  background: #f15a22;
  color: #fff;
  padding: 12px 25px;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  font-size: 1rem;
  font-weight: 600;
  transition: background 0.3s ease;
}

.beta-btn:hover {
  background: #cc4f00;
}

/* Responsive */
@media (max-width: 768px) {
  .beta-options,
  .beta-downloads {
    flex-direction: column;
  }
}

.beta-option-card p,
.beta-download-card p {
  color: #000;
}

.gamma-block {
  text-align: left;
}

.gamma-title {
  font-size: 1.4rem;
  margin-bottom: 10px;
  color: #f15a22;
}

.gamma-text {
  font-size: 1rem;
  color: #333;
  line-height: 1.6;
}

/* Highlight important terms */
.gamma-highlight {
  background: #fff3e6;
  color: #f15a22;
  font-weight: 600;
  padding: 2px 6px;
  border-radius: 4px;
}

/* Actions styling */
.gamma-actions {
  display: flex;
  gap: 12px;
  margin: 12px 0;
}

.gamma-action {
  padding: 6px 14px;
  border-radius: 6px;
  font-weight: 600;
  font-size: 0.95rem;
  color: #fff;
}

.gamma-action.buy {
  background: #28a745;
} /* Green */
.gamma-action.add {
  background: #007bff;
} /* Blue */
.gamma-action.reduce {
  background: #ffc107;
  color: #000;
} /* Yellow */
.gamma-action.exit {
  background: #dc3545;
} /* Red */

/* Review call list */
.gamma-review-list {
  list-style: none;
  padding: 0;
  margin: 12px 0;
}

.gamma-review-list li {
  margin-bottom: 10px;
  padding-left: 28px;
  position: relative;
  font-size: 0.95rem;
  color: #333;
}

.gamma-review-list li::before {
  content: "✔";
  position: absolute;
  left: 0;
  color: #f15a22;
  font-weight: bold;
}

.gamma-note {
  font-size: 0.85rem;
  color: #666;
  margin-top: 8px;
}

/* Outputs handed over (kept as you liked before) */
.gamma-outputs {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 15px;
  margin-top: 15px;
}

.gamma-output-card {
  background: #fafafa;
  border: 1px solid #eee;
  border-radius: 10px;
  padding: 10px 20px 0;
  text-align: center;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.06);
  font-size: 0.95rem;
  font-weight: 500;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.gamma-output-card p {
  margin-top: 8px;
  color: #444;
  margin-bottom: 10px;
}

.gamma-icon {
  font-size: 2rem;
  color: #f15a22;
}

/* Responsive */
@media (max-width: 768px) {
  .gamma-process {
    padding: 20px;
  }
  .gamma-title {
    font-size: 1.2rem;
  }
  .gamma-text {
    font-size: 0.95rem;
  }
}

.delta-slide-content {
  /* background: #fff; */
  border-radius: 12px;
  padding: 25px;
  /* box-shadow: 0 6px 18px rgba(0,0,0,0.08); */
  text-align: left;
}

.delta-title {
  font-size: 1.6rem;
  color: #f15a22;
  margin-bottom: 10px;
}

.delta-subtext {
  font-size: 1rem;
  color: #444;
  margin-bottom: 18px;
}

/* Reviews */
.delta-reviews {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.delta-review {
  background: #fafafa;
  border-left: 4px solid #f15a22;
  padding: 12px 16px;
  border-radius: 8px;
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.05);
}

.delta-review-text {
  font-size: 0.95rem;
  color: #333;
  margin-bottom: 5px;
}

.delta-review-author {
  font-size: 0.85rem;
  color: #666;
  margin-top: 6px;
  display: block;
}

/* Execute Flow */
.delta-highlight {
  background: #fff3e6;
  color: #f15a22;
  padding: 2px 6px;
  border-radius: 4px;
}

.delta-execute-flow {
  display: flex;
  gap: 15px;
  margin: 20px 0;
  flex-wrap: wrap;
}

.delta-step {
  background: #f15a22;
  color: #fff;
  padding: 10px 15px;
  border-radius: 8px;
  font-weight: 600;
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
}

.delta-note {
  font-size: 0.9rem;
  color: #555;
  margin-top: 10px;
}

/* Post Trade */
.delta-post-list {
  list-style: none;
  padding: 0;
  margin: 15px 0;
}

.delta-post-list li {
  margin-bottom: 12px;
  padding-left: 28px;
  position: relative;
  font-size: 0.95rem;
  color: #333;
}

.delta-post-list li::before {
  content: "✔";
  position: absolute;
  left: 0;
  color: #f15a22;
  font-weight: bold;
}

.delta-receipt {
  margin-top: 18px;
  display: flex;
  align-items: center;
  gap: 12px;
  background: #fafafa;
  padding: 12px 18px;
  border-radius: 10px;
  border: 1px solid #eee;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
}

.delta-icon {
  font-size: 1.8rem;
  color: #f15a22;
}

/* Responsive */
@media (max-width: 768px) {
  .delta-slide-content {
    padding: 18px;
  }
  .delta-title {
    font-size: 1.3rem;
  }
  .delta-execute-flow {
    flex-direction: column;
  }
}

.research-section {
  background: #0d0d0d;
  color: #fff;
  padding: 60px 20px;
}

.research-container {
  max-width: 1200px;
  margin: 0 auto;
}

.research-header {
  text-align: center;
  margin-bottom: 40px;
}

.research-title {
  font-size: 2rem;
  font-weight: 700;
  color: #fff;
}

.research-subtitle {
  font-size: 1.1rem;
  color: #bbb;
  margin-top: 8px;
}

/* Filters */
.research-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
  justify-content: center;
  margin-bottom: 40px;
}

.research-filter {
  background: #1a1a1a;
  color: #fff;
  padding: 10px 14px;
  border: 1px solid #333;
  border-radius: 6px;
  font-size: 0.95rem;
  min-width: 180px;
}

/* Cards */
.research-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
  gap: 25px;
}

.research-card {
  background: #1a1a1a;
  border-radius: 12px;
  padding: 20px;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.5);
  display: flex;
  flex-direction: column;
  gap: 12px;
  transition: transform 0.2s ease;
}

.card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.card-title {
  font-size: 1.2rem;
  color: #fff;
}

.card-date {
  font-size: 0.85rem;
  color: #aaa;
}

.card-summary {
  font-size: 0.95rem;
  color: #ccc;
  line-height: 1.5;
}

.card-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.tag {
  background: #262626;
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 0.8rem;
  color: #bbb;
}

.tag.freshness {
  background: #f15a22;
  color: #fff;
  font-weight: 600;
}

/* Actions */
.card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 10px;
}

.action-btn {
  background: #f15a22;
  border: none;
  padding: 8px 14px;
  color: #fff;
  border-radius: 6px;
  font-size: 0.85rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s ease;
}

.action-btn:hover {
  background: #ff6e14;
}

/* Responsive */
@media (max-width: 768px) {
  .research-title {
    font-size: 1.5rem;
  }
  .research-filter {
    min-width: 100%;
  }
}

.compliance-section {
  background: #0d0d0d;
  padding: 60px 20px;
  color: #f5f5f5;
}

.compliance-container {
  max-width: 1100px;
  margin: 0 auto;
}

.compliance-title {
  font-size: 2rem;
  font-weight: 700;
  text-align: center;
  margin-bottom: 40px;
  color: #f15a22;
}

.compliance-card {
  background: #1a1a1a;
  border-left: 4px solid #f15a22;
  border-radius: 12px;
  padding: 25px 30px;
  margin-bottom: 25px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.4);
}

.compliance-heading {
  font-size: 1.3rem;
  font-weight: 600;
  margin-bottom: 12px;
  color: #ff7e29;
}

.compliance-card p,
.compliance-card ul {
  font-size: 1rem;
  line-height: 1.6;
  color: #ddd;
}

.compliance-card ul {
  list-style: disc;
  padding-left: 0;
}

.compliance-card strong {
  color: #fff;
}

.compliance-card em {
  color: #ffb380;
}

.compliance-card .highlight {
  color: #ff7e29;
  font-weight: 600;
}

.compliance-footer {
  background: #111;
  border-top: 1px solid #333;
  padding: 20px;
  margin-top: 40px;
  border-radius: 8px;
  font-size: 0.95rem;
  color: #ccc;
}

.compliance-footer strong {
  color: #f15a22;
}

/* Responsive */
@media (max-width: 768px) {
  .compliance-title {
    font-size: 1.6rem;
  }
  .compliance-card {
    padding: 20px;
  }
  .compliance-heading {
    font-size: 1.1rem;
  }
  .compliance-card p,
  .compliance-card ul {
    font-size: 0.9rem;
  }
}

.view-report-container {
  text-align: center;
  margin: 20px 0;
  position: absolute;
  bottom: 0;
  transform: translate(50%, -50%);
}

.view-report-container1 {
  text-align: left;
  margin: 20px 0;
  position: absolute;
  transform: translate(50%, -50%);
}

.view-report-link {
  font-size: 1.2rem;
  font-weight: 600;
  color: #000;
  text-decoration: none;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.15); /* subtle shadow */
  transition: all 0.3s ease;
  position: relative;
}

.view-report-link1 {
  font-size: 1.2rem;
  font-weight: 600;
  color: #000;
  text-decoration: none;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.15); /* subtle shadow */
  transition: all 0.3s ease;
  position: relative;
}

.view-report-link:hover {
  color: #f15a22; /* highlight on hover */
  text-shadow: 1px 1px 4px rgba(229, 94, 0, 0.25);
}

.view-report-link1:hover {
  color: #f15a22; /* highlight on hover */
  text-shadow: 1px 1px 4px rgba(229, 94, 0, 0.25);
}

.fixed-income-start {
  background: #000;
  padding: 70px 20px;
}

.fixed-income-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 1200px;
  margin: 0 auto;
  gap: 40px;
}

.fixed-income-left {
  flex: 1;
}

.fixed-income-left img {
  flex: 1;
  /* max-width: 100%; */
  border-radius: 12px;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
  /* width: 400px; */
}

.fixed-income-right {
  flex: 1;
}

.fixed-income-title {
  font-size: 2rem;
  font-weight: 700;
  color: #f15a22;
  margin-bottom: 15px;
  text-shadow:
    0 0 6px rgba(255, 255, 255, 0.3),
    0 0 12px rgba(255, 255, 255, 0.1);
}

.fixed-income-text {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #fff;
  margin-bottom: 20px;
}

.fixed-income-list {
  list-style: none;
  padding: 0;
  margin-bottom: 25px;
}

.fixed-income-list li {
  margin-bottom: 10px;
  font-size: 1rem;
  color: #eee;
}

.fixed-income-btn {
  display: inline-block;
  padding: 12px 24px;
  background: #f15a22;
  color: #fff;
  font-weight: 600;
  border-radius: 6px;
  text-decoration: none;
  transition: 0.3s ease;
}

.fixed-income-btn:hover {
  background: #c44d00;
}

/* Responsive */
@media (max-width: 992px) {
  .fixed-income-container {
    flex-direction: column;
    text-align: center;
  }
  .fixed-income-right {
    margin-top: 20px;
  }
}

/* Section Base */
.invest-options-section {
  background: #0d0d0d;
  color: #fff;
  padding: 50px 20px;
  border-radius: 12px;
}

/* Container Layout */
.invest-options-container {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
  margin-bottom: 40px;
}

/* Banner */
.invest-banner {
  flex: 1 1 450px;
  position: relative;
  background: url("/images/equityapp.png") no-repeat center center/cover;
  border-radius: 12px;
  min-height: 450px;
  padding: 30px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  color: #fff;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.5);
  overflow: hidden;
}

/* Dark overlay for text readability */
.invest-banner::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.7);
  border-radius: 12px;
  z-index: 0;
}

.invest-banner-title,
.invest-banner-sub,
.invest-banner-actions {
  position: relative;
  z-index: 1;
}

.invest-banner-title {
  font-size: 1.8rem;
  margin-bottom: 10px;
  font-weight: 700;
}

.invest-banner-sub {
  font-size: 1rem;
  margin-bottom: 15px;
  font-weight: 400;
}

.invest-banner-actions span {
  display: inline-block;
  margin-right: 12px;
  margin-top: 5px;
  font-size: 0.9rem;
  font-weight: 600;
  background: rgba(255, 255, 255, 0.85);
  color: #000;
  padding: 6px 14px;
  border-radius: 20px;
}

/* Responsive */
@media (max-width: 768px) {
  .invest-banner {
    min-height: 200px;
    padding: 20px;
    text-align: center;
    justify-content: center;
  }
  .invest-banner-actions span {
    margin: 5px;
  }
}

/* Options Grid */
.invest-options-grid {
  flex: 2 1 500px;

  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 20px;
  margin-top: 30px;
}

.invest-option-card {
  background: #fff;
  color: #000;
  padding: 25px 15px;
  border-radius: 12px;
  text-align: center;
  font-weight: 600;
  font-size: 1rem;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
}

.invest-option-card i {
  font-size: 28px;
  margin-bottom: 12px;
  color: #f15a22; /* Highlight color */
}

.invest-option-card span {
  font-size: 1rem;
  font-weight: 500;
}

/* Hover effect */
.invest-option-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}

/* Responsive */
@media (max-width: 768px) {
  .invest-option-card {
    padding: 20px 10px;
    font-size: 0.95rem;
  }
  .invest-option-card i {
    font-size: 24px;
  }
}

/* Lower Info Grid */
.invest-info-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 25px;
}
.invest-info-card {
  background: #1a1a1a;
  border-radius: 12px;
  padding: 20px;
  display: flex;
  flex-direction: column-reverse;
  gap: 20px;
  justify-content: space-between;
  min-height: 220px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
  overflow: hidden;
}
.invest-info-text h3 {
  font-size: 1.2rem;
  margin-bottom: 10px;
}
.invest-info-text p {
  font-size: 0.95rem;
  color: #ddd;
}
.invest-info-img {
  margin-top: 15px;
  height: 220px;
  /* background: #333; */
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #aaa;
  font-size: 0.85rem;
}

.invest-info-img img {
  width: 100%;
  height: 100%;
  border-radius: 5px;
  object-fit: contain; /* keeps image ratio & covers area */
  display: block;
}

/* Responsive */
@media (max-width: 768px) {
  .invest-options-container {
    flex-direction: column;
  }
  .invest-banner-actions span {
    margin-bottom: 8px;
  }
  .invest-info-card {
    flex-direction: column;
  }
}

/* Section Wrapper */
.fd-dark-section {
  background: #0f0f0f;
  padding: 60px 20px;
  color: #fff;
}

.fd-dark-container {
  max-width: 1200px;
  margin: 0 auto;
  text-align: center;
}

/* Title & Subtext */
.fd-dark-title {
  font-size: 2rem;
  font-weight: 700;
  margin-bottom: 15px;
}

.fd-dark-subtext {
  font-size: 1rem;
  color: #ccc;
  max-width: 800px;
  margin: 0 auto 40px;
}

/* Grid Layout */
.fd-dark-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 25px;
}

/* Card */
.fd-dark-card {
  background: #1c1c1c;
  padding: 20px;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.6);
  transition: transform 0.3s ease;
}

.fd-dark-card:hover {
  transform: translateY(-5px);
}

/* Logo */
.fd-dark-logo img {
  max-width: max-content;

  margin: 0 0 15px;
  height: 50px;
  object-fit: cover;
  display: block;
}

/* Texts */
.fd-dark-name {
  font-size: 1.1rem;
  font-weight: 600;
  margin-bottom: 8px;
}

.fd-dark-details {
  font-size: 0.9rem;
  color: #bbb;
  margin-bottom: 10px;
}

.fd-dark-rate {
  font-size: 1.1rem;
  font-weight: bold;
  color: #f15a22;
  margin-bottom: 15px;
}

/* Buttons */
.fd-dark-buttons {
  display: flex;
  gap: 10px;
  justify-content: center;
}

.fd-btn {
  padding: 8px 14px;
  border-radius: 6px;
  background: #333;
  color: #fff;
  font-size: 0.85rem;
  text-decoration: none;
  transition: background 0.3s;
}

.fd-btn:hover {
  background: #444;
}

.fd-btn.primary {
  background: #f15a22;
}

.fd-btn.primary:hover {
  background: #ff6a00;
}
.fd-dark-logo {
  display: flex;
  justify-content: center;
}

/* Section Wrapper */
.form-downloads-dark {
  background: #0f0f0f;
  padding: 50px 20px;
  color: #fff;
}

.form-downloads-container {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  max-width: 1200px;
  margin: 0 auto;
}

/* Left Menu */
.form-downloads-menu {
  flex: 1;
  min-width: 220px;
  background: #1a1a1a;
  border-radius: 10px;
  padding: 20px;
}

.form-downloads-heading {
  font-size: 1.2rem;
  margin-bottom: 15px;
  border-bottom: 1px solid #333;
  padding-bottom: 8px;
}

.form-downloads-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.form-downloads-list li {
  padding: 12px 15px;
  cursor: pointer;
  border-radius: 6px;
  margin-bottom: 8px;
  background: #262626;
  transition: background 0.3s;
}

.form-downloads-list li:hover,
.form-downloads-list li.active {
  background: #f15a22;
  color: #fff;
}

/* Right File List */
.form-downloads-files {
  flex: 3;
  min-width: 300px;
  background: #1a1a1a;
  border-radius: 10px;
  padding: 20px;
}

#form-downloads-file-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

#form-downloads-file-list li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #262626;
  padding: 12px 15px;
  border-radius: 6px;
  margin-bottom: 10px;
  cursor: pointer;
}

#form-downloads-file-list li span {
  color: #fff;
  font-size: 0.95rem;
}

#form-downloads-file-list li img {
  width: 22px;
  height: 22px;
}

.howworks-section-dark {
  background: #0f0f0f;
  padding: 60px 20px;
  color: #fff;
}

.howworks-container-dark {
  max-width: 1200px;
  margin: 0 auto;
  text-align: center;
}

.howworks-heading-dark {
  font-size: 2rem;
  margin-bottom: 40px;
  color: #fff;
  text-shadow: 0 0 6px rgba(255, 255, 255, 0.3);
}

.howworks-steps-dark {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 20px;
}

.howworks-step-dark {
  flex: 1;
  min-width: 240px;
  background: #1a1a1a;
  border-radius: 12px;
  padding: 20px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.6);
  text-align: center;
  transition: transform 0.3s;
}

.howworks-icon-dark {
  width: 60px;
  height: 60px;
  margin: 0 auto 15px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 1.5rem;
}

.howworks-icon-dark.green {
  background: #28a745;
}
.howworks-icon-dark.orange {
  background: #ff9800;
}
.howworks-icon-dark.blue {
  background: #2196f3;
}

.howworks-title-dark {
  font-size: 1.1rem;
  margin-bottom: 10px;
  color: #fff;
}

.howworks-desc-dark {
  font-size: 0.9rem;
  color: #ccc;
  margin-bottom: 12px;
}

.howworks-btn-dark {
  display: inline-block;
  padding: 8px 14px;
  border-radius: 6px;
  font-size: 0.9rem;
  color: #fff;
  text-decoration: none;
  font-weight: bold;
}

.howworks-btn-dark.green {
  background: #28a745;
}
.howworks-btn-dark.orange {
  background: #ff9800;
}

.howworks-contact-dark {
  font-size: 1rem;
  margin-top: 10px;
  font-weight: bold;
  color: #28a745;
}

.howworks-contact-dark i {
  margin-right: 6px;
}

/* Responsive */
@media (max-width: 768px) {
  .howworks-steps-dark {
    flex-direction: column;
    align-items: center;
  }

  .howworks-step-dark {
    max-width: 400px;
    width: 100%;
  }
}

.insurance-started-section {
  background: #0f0f0f; /* dark theme */
  padding: 60px 20px;
}

.insurance-started-container {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  max-width: 1200px;
  margin: 0 auto;
}

.insurance-started-image {
  flex: 1 1 45%;
}

.insurance-started-image img {
  width: 100%;
  border-radius: 12px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.5);
}

.insurance-started-content {
  flex: 1 1 50%;
  color: #fff;
}

.insurance-started-heading {
  font-size: 2rem;
  font-weight: 700;
  margin-bottom: 15px;
  color: #fff;
}

.insurance-started-text {
  font-size: 1rem;
  line-height: 1.6;
  margin-bottom: 25px;
  color: #ccc;
}

.insurance-products-list {
  display: grid;
  grid-template-columns: 1fr 1fr; /* two in a row */
  gap: 15px 30px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.insurance-products-list li {
  display: flex;
  align-items: center;
  font-size: 1rem;
  color: #fff;
}

.insurance-products-list li img {
  width: 18px;
  height: 18px;
  margin-right: 10px;
}

#pmsHeroChart {
  width: 100% !important;
  height: 400px !important;
}

@media (max-width: 768px) {
  #pmsHeroChart {
    height: 300px !important;
  }
}

#healthCheckChart,
#portfolioAdvisoryChart,
#transactionAdvisoryChart,
#fixedIncomeChart2 {
  width: 100% !important;
  height: 350px !important; /* Increase to 500px or 600px if needed */
}

.invest-info-graph2 {
  width: 460px; /* fixed width */
  height: 220px; /* fixed height */
}
.invest-info-card {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
}

.whychartdiv {
  width: 400px;
  height: 200px;
}

.dc-hero-trust {
  margin-top: 24px;
  width: 100%;
  color: #f3f4f6; /* light text on dark bg */
 
}

.dc-trust-grid {
  display: flex;
  gap: 12px;
  align-items: stretch;
  justify-content: flex-start;
  flex-wrap: wrap;
}

.dc-trust-card {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
  padding: 14px 18px;
  min-width: 140px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  border-radius: 10px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.45);
  transition:
    transform 0.18s ease,
    box-shadow 0.18s ease;
}

.dc-trust-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.6);
}

.dc-trust-value {
  font-size: 1.6rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: #ffffff;
  display: inline-block;
}

.dc-trust-value::after {
  content: "";
  display: block;
  height: 4px;
  width: 36px;
  margin-top: 8px;
  border-radius: 4px;
  background: linear-gradient(90deg, #f15a22, rgba(229, 94, 0, 0.85));
  opacity: 0.95;
}

.dc-trust-label {
  font-size: 0.9rem;
  color: rgba(243, 244, 246, 0.8);
  line-height: 1.2;
  margin-top: 2px;
}

@media (max-width: 640px) {
  .dc-trust-grid {
    gap: 10px;
  }
  .dc-trust-card {
    min-width: calc(50% - 8px);
    padding: 12px;
  }
  .dc-trust-value {
    font-size: 1.25rem;
  }
}

@media (max-width: 420px) {
  .dc-trust-grid {
    flex-direction: column;
  }
  .dc-trust-card {
    min-width: 100%;
  }
}

/* Floating search bar styles */
.dc-floating-search {
  position: fixed;
  bottom: 10px; /* sits at bottom of screen */
  right: 24px;
  z-index: 1000;
  display: flex;
  align-items: center;
  background: rgba(20, 20, 20, 0.95);
  border: 1px solid rgba(229, 94, 0, 0.6);
  padding: 8px 12px;
  border-radius: 50px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.5);
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}

.dc-floating-search:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.65);
}

/* Input box */
.dc-search-input {
  background: transparent;
  border: none;
  outline: none;
  padding: 8px 12px;
  color: #fff;
  font-size: 0.95rem;
  width: 220px;
}

.dc-search-input::placeholder {
  color: rgba(255, 255, 255, 0.6);
}

/* Button */
.dc-search-btn {
  background: #f15a22;
  color: #fff;
  border: none;
  border-radius: 40px;
  padding: 8px 16px;
  cursor: pointer;
  font-size: 0.9rem;
  font-weight: 600;
  transition: background 0.25s ease;
}

.dc-search-btn:hover {
  background: #ff6f0f;
}

/* Mobile tweaks */
@media (max-width: 640px) {
  .dc-floating-search {
    left: 50%;
    right: auto;
    bottom: 16px;
    transform: translateX(-50%);
    width: 90%;
    padding: 6px 10px;
  }
  .dc-search-input {
    width: 100%;
    font-size: 0.85rem;
  }
  .dc-search-btn {
    padding: 6px 12px;
    font-size: 0.85rem;
  }
}

/* Tile card container */
.dc-tile-card {
  background: rgb(240 240 240 / 90%);
  border: 1px solid rgba(229, 94, 0, 0.3);
  border-radius: 16px;
  padding: 10px;
  text-align: center;
  width: 100%;
  max-width: 400px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.5);
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
  margin: 6px;
}

.dc-tile-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.65);
}

/* Icon */
.dc-tile-icon img {
  width: 30px;
  height: auto;
  display: none;
  margin-bottom: 4px;
}

/* Summary text */
.dc-tile-summary {
  font-size: 0.9rem !important;
  color: rgb(44 44 44 / 90%);
  margin-bottom: 16px;
  line-height: 1.4;
}

/* Explore button */
.dc-tile-btn {
  display: inline-block;
  background: #f15a22;
  color: #fff;
  padding: 8px 18px;
  border-radius: 30px;
  font-size: 0.9rem;
  font-weight: 600;
  text-decoration: none;
  transition:
    background 0.25s ease,
    transform 0.2s ease;
}

.dc-tile-btn:hover {
  background: #ff6f0f;
  transform: translateY(-2px);
}

/* Responsive grid wrapper */
.dc-tile-wrapper {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  /* gap: 16px; */
}

/* Mobile adjustments */
@media (max-width: 640px) {
  .dc-tile-card {
    max-width: 90%;
    padding: 16px;
  }
  .dc-tile-icon img {
    width: 40px;
    height: 40px;
  }
  .dc-tile-summary {
    font-size: 0.9rem;
  }
  .dc-tile-btn {
    padding: 6px 16px;
    font-size: 0.85rem;
  }
}

/* IPO Section */
.ipo-section {
  background: #121212;
  color: #f3f4f6;
  padding: 50px 20px;
}

.ipo-header {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 30px;
}

.ipo-title {
  font-size: 1.8rem;
  font-weight: 600;
  margin-bottom: 10px;
}

.ipo-filters {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.ipo-search {
  padding: 10px 14px;
  border-radius: 8px;
  border: 1px solid rgba(229, 94, 0, 0.4);
  background: #1f1f1f;
  color: #fff;
  width: 220px;
}

.ipo-search::placeholder {
  color: #aaa;
}

.ipo-sort {
  padding: 10px 14px;
  border-radius: 8px;
  border: 1px solid rgba(229, 94, 0, 0.4);
  background: #1f1f1f;
  color: #fff;
}

/* IPO Cards */
.ipo-wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center;
}

.ipo-card {
  background: #1c1c1c;
  border: 1px solid #000;
  border-radius: 14px;
  padding: 24px;
  flex: 1 1 300px;
  max-width: 450px;
  box-shadow: 1px 1px 10px #000;
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}

.ipo-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 25px rgba(0, 0, 0, 0.55);
}

.ipo-card-title {
  font-size: 1.2rem;
  font-weight: 500;
  margin-bottom: 14px;
  color: #fff;
}

/* IPO Details */
.ipo-details {
  margin-bottom: 18px;
}

.ipo-details p {
  font-size: 18px;
  margin: 4px 0;
  color: rgba(243, 244, 246, 0.85);
  display: flex;
  justify-content: space-between;
}

/* Buttons */
.ipo-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.ipo-btn {
  text-decoration: none;
  padding: 8px 16px;
  border-radius: 30px;
  font-size: 0.9rem;
  font-weight: 600;
  transition:
    background 0.25s ease,
    transform 0.2s ease;
  color: #fff;
  background: #f15a22;
}

.ipo-btn:hover {
  background: #ff6f0f;
  transform: translateY(-2px);
}

/* Responsive */
@media (max-width: 768px) {
  .ipo-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 15px;
  }

  .ipo-search {
    width: 100%;
  }

  .ipo-wrapper {
    flex-direction: column;
    align-items: stretch;
  }

  .ipo-card {
    max-width: 100%;
  }
}

.ipo-collapsible-section {
  margin-top: 40px;
  padding: 20px;
  background: #151515;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35);
}

/* Title toggle box */
.ipo-main-toggle {
  width: 100%;
  background: #f15a22;
  color: #fff;
  font-size: 1.1rem;
  font-weight: 600;
  text-align: center;
  border: none;
  border-radius: 8px;
  padding: 14px;
  cursor: pointer;
  transition: background 0.3s ease;
}

.ipo-main-toggle:hover {
  background: #ff6a11;
}

.ipo-main-toggle::after {
  content: "▼";
  display: inline-block;
  margin-left: 10px;
  transition: transform 0.3s ease;
}
.ipo-main-toggle[aria-expanded="true"]::after {
  transform: rotate(-180deg);
}

/* Collapsible content wrapper */
.ipo-main-content {
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  transition:
    max-height 0.5s ease,
    opacity 0.4s ease;
  margin-top: 16px;
}

/* two-column layout */
.ipo-content-columns {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
}

.ipo-column {
  flex: 1 1 45%;
  min-width: 260px;
  background: #000;
  border: 1px solid rgba(229, 94, 0, 0.3);
  border-radius: 10px;
  padding: 16px;
  color: #e6e7e8;
  font-size: 0.95rem;
  line-height: 1.6;
}

.ipo-column h3 {
  color: #f15a22;
  font-size: 1rem;
  margin-bottom: 8px;
}

/* Responsive */
@media (max-width: 768px) {
  .ipo-content-columns {
    flex-direction: column;
  }
}

.research-tables-section {
  margin-top: 40px;
  display: flex;
  flex-direction: column;
  gap: 40px;
}

/* block for each narrative + table */
.research-table-block {
  background: #151515;
  border-radius: 12px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35);
  padding: 20px;
}

/* narrative text */
.research-narrative h3 {
  color: #f15a22;
  margin-bottom: 6px;
  font-size: 1.1rem;
}

.research-narrative p {
  color: #e6e7e8;
  font-size: 0.95rem;
  margin-bottom: 14px;
}

/* table wrapper for scroll */
.research-table-wrapper {
  overflow-x: auto;
  border-radius: 8px;
}

/* table */
.research-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 480px;
}

/* sticky header */
.research-table thead th {
  position: sticky;
  top: 0;
  background: #000;
  color: #fff;
  text-align: left;
  padding: 12px;
  font-size: 0.95rem;
  font-weight: 600;
  z-index: 2;
}

/* rows */
.research-table tbody td {
  padding: 10px 12px;
  font-size: 0.9rem;
  color: #e6e7e8;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

/* zebra striping */
.research-table tbody tr:nth-child(odd) {
  background: rgba(255, 255, 255, 0.02);
}
.research-table tbody tr:nth-child(even) {
  background: rgba(255, 255, 255, 0.04);
}

/* align numbers right */
.research-table td.num {
  /* text-align: right; */
  font-variant-numeric: tabular-nums;
}

/* responsive */
@media (max-width: 720px) {
  .research-table-block {
    padding: 16px;
  }
  .research-narrative h3 {
    font-size: 1rem;
  }
  .research-narrative p {
    font-size: 0.85rem;
  }
}

/* Section wrapper */
.fund-slider-section {
  /* background: #111; */
  padding: 50px 30px;
  color: #fff;
  max-width: 90%;
  margin: auto;
}

.fund-slider-heading {
  font-size: 28px;
  font-weight: bold;
  margin-bottom: 30px;
  color: #fff;
}

/* Swiper Card */
.fund-slide-card {
  background: #151515;
  border-radius: 25px;
  padding: 25px;
  cursor: pointer;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4);
  text-align: left;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 250px;
  border: 1px solid #343434;
}

.fund-slide-card h3 {
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 10px;
}

.fund-slide-card p {
  font-size: 15px;
  color: #ccc;
  margin-bottom: 20px;
}

/* Explore Button */
.fund-explore-btn {
  display: inline-block;
  padding: 10px 18px;
  border-radius: 8px;
  background: #f15a22;
  color: #fff;
  font-weight: bold;
  text-decoration: none;
  transition: all 0.3s ease;
  width: max-content;
  cursor: pointer;
  box-shadow: 0 0 12px rgba(229, 94, 0, 0.6);
}

.fund-explore-btn:hover {
  background: #ff6f1a;
  box-shadow: 0 0 20px rgba(229, 94, 0, 0.9);
}

/* Navigation Arrows */
.fund-slider-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
  padding: 10px 15px;
  border-radius: 50%;
  cursor: pointer;
  font-size: 24px;
  transition: 0.3s;
}
.fund-prev {
  left: -20px;
  background: #2f2f2f;
}
.fund-next {
  right: -20px;
  background: #2f2f2f;
}

.fund-slider-nav:hover {
  background: #fff;
  color: #000;
}

/* Pagination */
.fund-slider-pagination {
  text-align: center;
  margin-top: 20px;
}
.fund-slider-pagination .swiper-pagination-bullet {
  background: #555;
  opacity: 0.7;
}
.fund-slider-pagination .swiper-pagination-bullet-active {
  background: #f15a22;
  opacity: 1;
}

/* Responsive */
@media (max-width: 768px) {
  .fund-slide-card {
    padding: 20px;
  }
  .fund-slide-card h3 {
    font-size: 18px;
  }
  .fund-slide-card p {
    font-size: 14px;
  }
}

.fund-card-icon {
  width: 50px;
  height: 50px;
  background: #000; /* dark navy background */
  border-radius: 12px; /* rounded square */
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 15px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.4);
}

.fund-card-icon img {
  width: 40px;
  height: 40px;
  object-fit: contain;
}

/* Wrapper */
.ipo-reports-wrapper {
  margin: 20px auto;
  max-width: 86.5%;
  color: #fff;
}

/* Section */
.ipo-table-section {
  background: #121212;
  border: 1px solid #2a2a2a;
  border-radius: 12px;
  margin-bottom: 25px;
  padding: 20px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.4);
}

/* Section Title */
.ipo-table-title {
  margin-bottom: 15px;
  font-size: 20px;
  font-weight: bold;
}

/* Table */
.ipo-table {
  width: 100%;
  border-collapse: collapse;
}

.ipo-table thead {
  background: #1d1d1d;
}

.ipo-table th,
.ipo-table td {
  padding: 12px 14px;
  text-align: left;
  border-bottom: 1px solid #2a2a2a;
}

.ipo-table th {
  font-weight: 600;
  font-size: 14px;
}

.ipo-table td {
  font-size: 14px;
}

/* Buttons */
.ipo-btn {
  background: #1d1d1d;
  border: 1px solid #333;
  color: #fff;
  padding: 6px 14px;
  margin: 3px;
  border-radius: 8px;
  font-size: 13px;
  cursor: pointer;
  transition: 0.2s ease-in-out;
}

.ipo-btn:hover {
  background: #333;
}

.ipo-btn-primary {
  background: #ff6600;
  border: none;
}

.ipo-btn-primary:hover {
  background: #f15a22;
}

/* Search + Sort (Upcoming IPOs) */
.ipo-search-sort {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 15px;
}

.ipo-search-input {
  width: 300px;
  padding: 8px 12px;
  border-radius: 8px;
  border: 1px solid #333;
  background: #1d1d1d;
  color: #fff;
}

/* Responsive */
@media (max-width: 768px) {
  .ipo-table th,
  .ipo-table td {
    padding: 10px 8px;
    font-size: 12px;
  }

  .ipo-btn {
    padding: 5px 10px;
    font-size: 12px;
  }

  .ipo-search-sort {
    flex-direction: column;
    align-items: stretch;
  }
}

.tech-research-wrapper {
  margin: 50px auto;
  padding: 20px;
  max-width: 86.5%;
  color: #fff;
}

.tech-research-title {
  font-size: 28px;
  font-weight: bold;
  margin-bottom: 5px;
}

.tech-research-sub {
  font-size: 14px;
  color: #bbb;
  margin-bottom: 20px;
}

.tech-table-box {
  background: #111;
  border-radius: 12px;
  padding: 20px;
  margin-bottom: 30px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
}

.tech-table-heading {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 12px;
}

.tech-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}

.tech-table thead {
  position: sticky;
  top: 0;
  background: #1a1a1a;
  z-index: 2;
}

.tech-table th,
.tech-table td {
  padding: 12px 15px;
  text-align: left;
}

.tech-table th {
  font-weight: 600;
  color: #fff;
}

.tech-table tbody tr:nth-child(even) {
  background: #1b1b1b;
}

.tech-btn-primary {
  background: #ff6600;
  color: #fff;
  border: none;
  border-radius: 8px;
  padding: 6px 14px;
  margin-right: 6px;
  cursor: pointer;
  font-weight: bold;
}

.tech-btn-primary:hover {
  background: #ff8533;
}

.tech-btn-secondary {
  background: transparent;
  border: 1px solid #666;
  color: #ddd;
  border-radius: 8px;
  padding: 6px 14px;
  cursor: pointer;
}

.tech-btn-secondary:hover {
  border-color: #ff6600;
  color: #ff6600;
}

/* Responsive */
@media (max-width: 768px) {
  .tech-table th,
  .tech-table td {
    font-size: 12px;
    padding: 8px 10px;
  }
  .tech-btn-primary,
  .tech-btn-secondary {
    padding: 5px 10px;
    font-size: 12px;
  }
}

.about-sections-wrapper {
  max-width: 86.5%;
  margin: 50px auto;
  display: flex;
  flex-direction: column;
  gap: 25px;
  padding: 0 20px;
}

.about-section {
  display: flex;
  gap: 15px;
  flex-wrap: wrap;
  align-items: flex-start;
  width: max-content;
}

/* Talk to Expert button */
.expert-btn {
  background: #ff6600;
  color: #fff;
  border: none;
  padding: 12px 20px;
  font-size: 16px;
  border-radius: 10px;
  font-weight: bold;
  cursor: pointer;
  transition: background 0.3s ease;
  flex: 1;
  min-width: 180px;
}

.expert-btn:hover {
  background: #ff8533;
}

/* Collapsible Box */
.about-collapse-box {
  flex: 2;
  min-width: 420px;
  background: #121212;
  border-radius: 12px;
  border: 1px solid #222;
  overflow: hidden;
}

.about-collapse-btn {
  width: 100%;
  text-align: left;
  background: #1a1a1a;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  padding: 14px 20px;
  border: none;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  transition: background 0.3s ease;
}

.about-collapse-btn::after {
  content: "+";
  font-size: 20px;
  transition: transform 0.3s ease;
}

.about-collapse-btn.active::after {
  content: "-";
  transform: rotate(180deg);
}

.about-collapse-btn:hover {
  background: #222;
}

.about-collapse-content {
  max-height: 0;
  overflow: hidden;
  background: #000;
  transition:
    max-height 0.4s ease,
    padding 0.3s ease;
  padding: 0 20px;
}

.about-collapse-content ul {
  list-style: none;
  padding: 15px 0;
  margin: 0;
}

.about-collapse-content li {
  margin-bottom: 10px;
  color: #ccc;
  font-size: 14px;
  position: relative;
  padding-left: 20px;
}

.about-collapse-content li::before {
  content: "•";
  color: #ff6600;
  position: absolute;
  left: 0;
}

/* Responsive */
@media (max-width: 768px) {
  .about-section {
    flex-direction: column;
  }
}

.chaturAi_login-section {
  background: #000;
  padding: 60px 0;
}

.chaturAi_login-buttons {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px; /* spacing between buttons */
}

.chaturAi_login-link {
  text-decoration: none;
}

.my-btn {
  /* your existing button styles */
}

.chaturAi_popup-overlay {
  position: fixed;
  inset: 0;
  display: none; /* shown via JS */
  justify-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.75);
  z-index: 12000;
  padding: 20px;
}

.chaturAi_popup-overlay[aria-hidden="false"] {
  display: flex;
}

.chaturAi_popup-box {
  width: 100%;
  max-width: 520px;
  max-height: 90vh;
  overflow-y: auto;
  background: #0b0b0b; /* deep black */
  color: #fff;
  border-radius: 12px;
  padding: 22px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.7);
  position: relative;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}

.chaturAi_popup-close {
  position: absolute;
  top: 10px;
  right: 12px;
  background: transparent;
  border: none;
  color: #fff;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  padding: 6px;
}

.chaturAi_popup-title {
  margin: 4px 0 18px;
  font-size: 20px;
  font-weight: 600;
  text-align: left;
  color: #ffffff;
}

.chaturAi_popup-form {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.chaturAi_row {
  width: 100%;
}

.chaturAi_label {
  display: block;
  font-size: 13px;
  margin-bottom: 6px;
  color: #e6e6e6;
  font-weight: 600;
}

.chatur_input,
.chatur_select {
  width: 100%;
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.03);
  color: #fff;
  font-size: 14px;
  outline: none;
}

.chatur_select option {
  background: #000; /* black background */
  color: #fff;
}

.chatur_select optgroup,
.chatur_select {
  background-color: #000;
  color: #fff;
}

.chatur_input::placeholder {
  color: rgba(255, 255, 255, 0.5);
}
.chatur_select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}

.chaturAi_grid2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.chaturAi_options {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.chaturAi_option {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: #fff;
}
.chaturAi_option input {
  transform: scale(1.05);
}

.chaturAi_smallChecks {
  display: flex;
  gap: 12px;
  flex-direction: column;
}
.chaturAi_check {
  font-size: 13px;
  color: #ddd;
  display: flex;
  align-items: center;
  gap: 8px;
}

.chaturAi_actions {
  display: flex;
  gap: 12px;
  justify-content: center;
  align-items: center;
  margin-top: 6px;
}

.chaturAi_submit {
  min-width: 120px;
  margin-right: 0;
}
.chaturAi_cancel {
  /* background: transparent;
    border: 1px solid rgba(255,255,255,0.08);
    color: #fff;
    padding: 9px 12px;
    border-radius: 8px;
    cursor: pointer;
    font-size: 14px; */
}

/* responsive adjustments */
@media (max-width: 480px) {
  .chaturAi_popup-box {
    padding: 18px;
    max-width: 100%;
  }
  .chaturAi_grid2 {
    grid-template-columns: 1fr;
  }
  .chaturAi_actions {
    justify-content: stretch;
    flex-direction: column-reverse;
  }
  .chaturAi_submit {
    width: 100%;
  }
  .chaturAi_cancel {
    width: 100%;
  }
  .chaturAi_popup-close {
    top: 8px;
    right: 10px;
  }
}

/* Scrollbar styling for the popup box */
.chaturAi_popup-box::-webkit-scrollbar {
  width: 8px;
}

.chaturAi_popup-box::-webkit-scrollbar-track {
  background: #000; /* black background */
}

.chaturAi_popup-box::-webkit-scrollbar-thumb {
  background: #6f6f6f; /* grey scroller */
  border-radius: 10px;
}

/* Firefox support */
.chaturAi_popup-box {
  scrollbar-width: thin;
  scrollbar-color: #6f6f6f #000; /* thumb, track */
}

.chaturAi_verticalTable-wrapper {
  width: 100%;
  overflow-x: auto;
}

.chaturAi_verticalTable {
  width: 100%;
  border-collapse: collapse;
  min-width: 420px;
  color: #000; /* black text */
  font-size: 15px;
}

.chaturAi_verticalTable th,
.chaturAi_verticalTable td {
  padding: 14px 12px;
  border: 1px solid #cbcbcb; /* black borders */
  text-align: left;
  background-color: #000;
  color: #fff;
}

.chaturAi_verticalTable th {
  width: 60%;
  font-weight: 600;
  font-size: 15px;
}

.chaturAi_verticalTable td {
  width: 40%;
  font-weight: 700;
}

.chaturAi_gaugeWrapper {
  text-align: center;
  margin: 40px auto;
  width: 100%;
  max-width: 400px;
  color: white;
}

.chaturAi_gaugeTitle {
  font-size: 20px;
  margin-bottom: 10px;
}

.chaturAi_gaugeBox {
  position: relative;
}

/* Semicircle Gauge */
.chaturAi_gauge {
  width: 260px;
  height: 130px;
  background: linear-gradient(to right, #2ecc71, #f1c40f, #e67e22, #e74c3c);
  border-radius: 260px 260px 0 0;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
}

/* Inner background arch */
.chaturAi_gaugeFill {
  position: absolute;
  width: 200px;
  height: 100px;
  background: #222;
  border-radius: 200px 200px 0 0;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}

/* Needle */
.chaturAi_needle {
  position: absolute;
  width: 6px;
  height: 70px;
  background: #ff9800;
  bottom: 0;
  left: 50%;
  transform-origin: bottom center;
  transform: rotate(-90deg);
  border-radius: 5px;
}

/* Slider */
.chaturAi_gaugeSlider {
  width: 90%;
  margin-top: 20px;
}

.chaturAi_gaugeValue {
  margin-top: 10px;
  font-size: 18px;
  font-weight: bold;
}

.chaturAi_appetiteWrapper {
  text-align: center;
  margin: 40px auto;
  width: 100%;
  max-width: 400px;

  color: white;
}

.chaturAi_appetiteTitle {
  font-size: 20px;
  margin-bottom: 10px;
}

/* Gauge */
.chaturAi_appetiteGauge {
  width: 260px;
  height: 130px;
  margin: 0 auto;
  border-radius: 260px 260px 0 0;
  background: linear-gradient(to right, #2ecc71, #f1c40f, #e74c3c);
  position: relative;
  overflow: hidden;
}

/* Inner Arch */
.chaturAi_appetiteInner {
  position: absolute;
  width: 200px;
  height: 100px;
  background: #222;
  border-radius: 200px 200px 0 0;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}

/* Needle */
.chaturAi_appetiteNeedle {
  position: absolute;
  width: 6px;
  height: 70px;
  background: #ff9800;
  bottom: 0;
  left: 50%;
  transform-origin: bottom center;
  transform: rotate(-90deg);
  border-radius: 5px;
}

/* Slider */
.chaturAi_appetiteSlider {
  width: 90%;
  margin-top: 20px;
}

.chaturAi_appetiteValue {
  margin-top: 10px;
  font-size: 18px;
  font-weight: bold;
}

.chatur_risk {
  display: flex;
  justify-content: space-evenly;
  padding: 100px 0;
}

/* CARD WRAPPER */
.chaturAi_stockCard {
  padding: 20px;
  border-radius: 12px;
  background: #1e1e1e;
  color: #fff;
  width: 26vw;
  text-align: left;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3);
  transition: 0.3s ease;
}

.chaturAi_stockCard:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.45);
}

/* Icon */
.chaturAi_stockCard .fund-card-icon img {
  width: 50px;
  height: 50px;
}

/* Title */
.chaturAi_stockName {
  font-size: 20px;
  margin-top: 10px;
  font-weight: bold;
}

/* TAGS */
.chaturAi_stockTags {
  margin: 12px 0 8px;
  display: flex;
  gap: 8px;
}

.chaturAi_stockTags .tag {
  padding: 4px 12px;
  border-radius: 20px;
  font-size: 12px;
  color: #fff;
  font-weight: 600;
}

.tag.buy {
  background: #27ae60;
}
.tag.sell {
  background: #e74c3c;
}
.tag.open {
  background: #2980b9;
}
.tag.closed {
  background: #7f8c8d;
}

/* LIVE PRICE */
.chaturAi_stockLive {
  font-size: 15px;
  margin-bottom: 10px;
  font-weight: 600;
}

.chaturAi_stockDetails {
  display: flex;
  justify-content: space-between;
}

/* STOCK DETAILS */
.chaturAi_stockDetails p {
  margin: 4px 0;
  font-size: 14px;
  opacity: 0.9;
}

/* CTA BUTTONS AREA */
.chaturAi_cardBtns {
  margin-top: 15px;
  display: flex;
  /* flex-direction: column; */
  gap: 10px;
}

/* Buttons */
.chaturAi_cardBtns .fund-explore-btn {
  text-align: center;
  padding: 8px;
  border-radius: 8px;
  cursor: pointer;
  font-weight: 600;
  transition: 0.2s ease;
  font-size: 14px;
}

/* CTA Colors */
.chaturAi_cardBtns .action {
  background: #f39c12;
  color: #fff;
}
.chaturAi_cardBtns .lock {
  background: #8e44ad;
  color: #fff;
}
.chaturAi_cardBtns .talk {
  background: #16a085;
  color: #fff;
}

/* Hover */
.chaturAi_cardBtns .fund-explore-btn:hover {
  opacity: 0.85;
}

.stock_cards {
  display: grid;
  margin-bottom: 20px;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  max-width: 86.5%;
}

/* Section Wrapper */
.intraday-section {
  padding: 150px 0 100px;
  background: #111;
 
}

/* Container */
.intraday-container {
  width: 90%;
  max-width: 1200px;
  margin: auto;
}

/* Headings */
.intraday-title {
  color: #fff;
  font-size: 26px;
  font-weight: 600;
  margin-bottom: 10px;
}

.intraday-subtitle {
  color: #bbb;
  font-size: 15px;
  margin-bottom: 25px;
}

/* Table Wrapper */
.intraday-table-wrapper {
  background: #161616;
  border-radius: 10px;
  padding: 15px;
}

/* Table */
.intraday-table {
  width: 100%;
  border-collapse: collapse;
  color: #fff;
}

.intraday-table th {
  text-align: left;
  padding: 14px 10px;
  background: #1c1c1c;
  font-weight: 500;
  font-size: 15px;
  color: #e6e6e6;
}

.intraday-table td {
  padding: 14px 10px;
  font-size: 14px;
  border-bottom: 1px solid #222;
}

/* Row hover effect */
.intraday-table tbody tr:hover {
  background: #1e1e1e;
  transition: 0.2s ease;
}

/* Remove border for last row */
.intraday-table tbody tr:last-child td {
  border-bottom: none;
}

.corpdisc-section {
  padding: 100px 0 50px;
  background: #0f0f0f;
  
  color: #ddd;
}

.corpdisc-container {
  margin: auto;
}

.corpdisc-title {
  font-size: 26px;
  font-weight: 500;
  margin-bottom: 20px;
  color: #fff;
}

.mt-40 {
  margin-top: 40px;
}

.corpdisc-list p {
  margin-bottom: 12px;
  line-height: 1.6;
  font-size: 15px;
}

.corpdisc-reg-details p {
  margin-bottom: 10px;
  font-size: 15px;
}

/* Table Styles */
.corpdisc-table-wrapper {
  margin-top: 25px;
  background: #141414;
  padding: 20px;
  border-radius: 10px;
  overflow-x: auto;
}

.corpdisc-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 600px;
  color: #fff;
}

.corpdisc-table th {
  text-align: left;
  background: #1c1c1c;
  padding: 14px 10px;
  font-weight: 500;
  font-size: 15px;
}

.corpdisc-table td {
  padding: 14px 10px;
  border-bottom: 1px solid #262626;
  font-size: 14px;
}

.corpdisc-table tr:hover {
  background: #1c1c1c;
  transition: 0.2s ease;
}

.corpdisc-table tr:last-child td {
  border-bottom: none;
}

/* Responsive */
@media (max-width: 768px) {
  .corpdisc-title {
    font-size: 22px;
  }
  .corpdisc-list p,
  .corpdisc-reg-details p {
    font-size: 14px;
  }
  .corpdisc-table {
    min-width: 500px;
  }
}

/* Base Card Styling (Black and White Theme) */
.company-profile-card-bw {
  margin: 50px auto;
  padding: 20px 0px;

  box-shadow: 0 4px 10px rgba(255, 255, 255, 0.1);

  color: #fff; /* Pure white text */
  border-radius: 8px;
}

/* Section Titles (Company Names) */
.profile-section-title-bw {
  font-size: 1.4em;
  /* font-weight: bold; */
  color: #fff;
  padding: 10px 0;
  margin-top: 15px;
  border-bottom: 1px solid #fff; /* White line for separation */
}

/* Individual Detail Items */
.profile-detail-item-bw {
  display: flex;
  justify-content: space-between;
  padding: 8px 0;
  border-bottom: 1px dashed #333; /* Dark grey dashed line */
}

.detail-label-bw {
  font-weight: 600;
  color: #ccc; /* Slightly dimmer label */
}

.detail-value-bw {
  color: #fff;
}

/* Registration Segment Grouping */
.registration-segment-group-bw {
  margin-top: 20px;
}

.segment-group-header-bw {
  font-size: 1.1em;
  font-weight: 600;
  color: #fff;
  margin-bottom: 10px;
  border-left: 4px solid #fff; /* White emphasis bar */
  padding-left: 10px;
}

/* Table Layout for Registration Details */
.segment-table-container-bw {
  border: 1px solid #777;
  border-radius: 4px;
  overflow: hidden;
}

.segment-table-row-bw {
  display: flex;
  padding: 10px;
  border-bottom: 1px solid #333; /* Subtle separator */
}

.segment-table-header-bw {
  background-color: #111; /* Very dark grey header background */
  font-weight: bold;
  color: #fff;
}

.segment-table-row-bw:last-child {
  border-bottom: none;
}

.segment-header-cell-bw,
.segment-data-cell-bw {
  flex: 1;
  text-align: left;
  padding: 0 5px;
  word-break: break-word;
}

.segment-data-cell-bw {
  color: #fff;
}

/* Contact Information Section */
.contact-info-section-bw {
  margin-top: 30px;
  padding-top: 15px;
  border-top: 1px solid #777;
}

.contact-info-header-bw {
  font-size: 1em;
  font-weight: bold;
  color: #fff;
  margin-top: 10px;
}

.contact-info-address-bw,
.contact-info-helpdesk-bw,
.contact-info-grievance-bw {
  padding: 5px 0 10px 0;
  line-height: 1.5;
  color: #fff;
}

.helpdesk-item-email-bw {
  font-weight: bold;
  color: #fff;
}

.grievance-email-link-bw {
  color: #fff; /* Link color is white */
  text-decoration: underline; /* Use underline for differentiation */
  font-weight: bold;
}

.grievance-email-link-bw:hover {
  color: #ccc; /* Subtle hover effect */
}

/* Important Links Section */
.important-links-section-bw {
  margin-top: 30px;
  padding-top: 15px;
  border-top: 1px solid #777;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  margin-bottom: 20px;
}

.links-header-bw {
  font-size: 1.2em;
  font-weight: bold;
  color: #fff;
  margin-bottom: 10px;
}

.links-container-bw {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.important-link-item-bw {
  background-color: #333; /* Dark grey button background */
  color: #fff;
  padding: 8px 15px;
  border-radius: 4px;
  text-decoration: none;
  font-weight: 600;
  border: 1px solid #777;
  transition:
    background-color 0.3s,
    border-color 0.3s;
}

.important-link-item-bw:hover {
  background-color: #555; /* Slightly lighter on hover */
  border-color: #fff;
}

.advisory-container {
  margin: 0 auto;
  padding: 0; /* Remove padding */

  /* Removed borders and radius */
}

/* Title Styling - Simplified */
.advisory-title {
  font-size: 1.5em;
  text-align: left; /* Aligned left for simplicity */
  margin-bottom: 20px;
  font-weight: normal; /* Ensure not bold */
  /* Removed borders, padding, and unnecessary margins */
}

/* List Styling */
.advisory-list {
  /* list-style-type: none; */
  padding-left: 20px;
  margin: 0;
}

.advisory-list-item {
  margin-bottom: 15px;
  line-height: 1.5;
  font-size: 1em; /* Increased size slightly for better readability */
  font-weight: normal; /* Ensure not bold */
}

/* Specific link styling - keeping them white/subtle */
.advisory-list-item a {
  color: #fff;
  text-decoration: underline;
}

.advisory-list-item a:hover {
  color: #ccc;
}

/* Sub-list styling for nested details */
.advisory-sub-list {
  list-style-type: disc;
  padding-left: 20px;
  margin-top: 5px;
}

.advisory-sub-list-item {
  margin-bottom: 8px;
  line-height: 1.4;
}

.advisory-container {
  margin: 0 auto;
  padding: 20px;
}

/* Title Styling */
.advisory-title {
  font-size: 1.5em;
  text-align: left;
  margin-bottom: 20px;
  font-weight: normal;
}

/* Introduction paragraph style */
.advisory-intro {
  margin-top: 10px;
  margin-bottom: 25px;
  line-height: 1.6;
  font-size: 1em;
}

/* Numbered List Styling (for guidelines) */
.advisory-numbered-list {
  list-style-type: decimal;
  padding-left: 20px;
  margin-top: 0;
}

.advisory-list-item-numbered {
  margin-bottom: 20px;
  line-height: 1.6;
  font-weight: normal;
}

/* Sub-list styling for nested details (used for SEBI verification links) */
.advisory-sub-list {
  list-style-type: none; /* Removing bullet for nested links */
  padding-left: 20px;
  margin-top: 5px;
}

.advisory-sub-list-item {
  margin-bottom: 5px;
  line-height: 1.4;
}

/* Specific link styling - keeping them white/subtle */
.advisory-container a {
  color: #fff;
  text-decoration: underline;
}

.advisory-container a:hover {
  color: #ccc;
}

/* Footer details (Press Releases) */
.advisory-footer-details {
  margin-top: 30px;
  padding-top: 15px;
  border-top: 1px solid #333;
  font-size: 0.9em;
}
.advisory-footer-details p {
  margin: 5px 0;
}

/* Main Content Wrapper - No max-width or background */
.reminder-wrapper {
  /* No max-width, allows full width */
  padding: 20px; /* Add internal spacing */
}

/* Important Reminder Box */
.important-alert-box {
  padding: 20px;
  margin-bottom: 30px;
  /* border: 1px solid #fff;  */
  text-align: center;
}

.alert-text {
  color: #fff;
  font-size: 1.1em;
  line-height: 1.6;
  font-weight: normal;
}

/* Advisory Title */
.fraud-section-title {
  font-size: 1.5em;
  margin-bottom: 20px;
  font-weight: normal;
}

/* Introduction paragraph style */
.fraud-intro-text {
  margin-top: 10px;
  margin-bottom: 25px;
  line-height: 1.6;
  font-size: 1em;
}

/* Numbered List Styling (Guidelines) */
.guidelines-list {
  list-style-type: decimal;
  padding-left: 20px;
  margin-top: 0;
}

.guideline-item {
  margin-bottom: 20px;
  line-height: 1.6;
  font-weight: normal;
}

/* Sub-list styling for nested links */
.nested-links {
  list-style-type: none;
  padding-left: 20px;
  margin-top: 5px;
}

.nested-links-item {
  margin-bottom: 5px;
  line-height: 1.4;
}

/* Link and Strong Tag Styling */
.reminder-wrapper a {
  color: #fff;
  text-decoration: underline;
}

.reminder-wrapper a:hover {
  color: #ccc;
}

/* Footer details (Press Releases) */
.footer-press-release {
  margin-top: 30px;
  padding-top: 15px;
  border-top: 1px solid #333;
  font-size: 0.9em;
}
.footer-press-release p {
  margin: 5px 0;
}

.charter-table-wrapper {
  color: #fff;
  /* No max-width for responsiveness */
}

.charter-title {
  font-size: 1.5em;
  font-weight: bold;
  margin-bottom: 15px;
  color: #fff;
}

/* Using CSS Grid for a robust, responsive table structure */
.charter-grid {
  display: grid;
  grid-template-columns: 1fr 1fr; /* Two equal columns */
  border: 1px solid #ccc;
  border-radius: 4px;
  overflow: hidden; /* Ensures borders look clean */
}

/* Individual Cell Styling */
.charter-cell {
  padding: 15px 10px;
  text-align: center;
  border: 1px solid #ccc; /* Use #ccc border color */
  /* Overlap borders and use a background to ensure separation */
}

/* Styling for Header Cells */
.charter-header-cell {
  background-color: #111; /* Slightly visible dark grey background */
  font-weight: bold;
  font-size: 1.1em;
  color: #fff;
}

/* Styling for Data Cells */
.charter-data-cell {
  background-color: #000;
  font-weight: normal;
}

/* Link Styling */
.charter-link {
  color: #fff;
  text-decoration: underline;
  display: block; /* Make link fill the cell for easier clicking */
}

.charter-link:hover {
  color: #ccc;
  text-decoration: none;
}

/* Media query for smaller screens: stack columns */
@media (max-width: 600px) {
  .charter-grid {
    grid-template-columns: 1fr; /* Stack columns vertically */
  }

  /* Add a slightly thicker separator between the old columns when stacked */
  .charter-cell:nth-child(2n) {
    border-top: 2px solid #ccc;
  }

  /* Remove the top border on the first element of the stacked grid */
  .charter-cell:first-child {
    border-top: none;
  }
  .important-links-section-bw {
    flex-direction: column;
    flex-wrap: nowrap;
  }
}

/* Main Wrapper for the Matrix Table */
.matrix-table-wrapper {
  color: #fff;
  margin-top: 100px;
  font-size: 0.9em;
}

.matrix-main-header {
  font-size: 1.2em;
  font-weight: bold;
  padding: 15px 10px;
  background-color: #1a1a1a; /* Darker background for main title */
  color: #fff;
  text-align: center;
  border: 1px solid #ccc;
  border-bottom: none;
  border-radius: 4px 4px 0 0;
}

/* Using CSS Grid for the table structure (Desktop View) */
.matrix-grid-container {
  display: grid;
  /* Define 6 columns: Designation, Name, Email, Address, Hours, Contact No. */
  grid-template-columns: 1.5fr 1.5fr 2fr 2.5fr 1.5fr 1.5fr;
  border: 1px solid #ccc;
  border-top: none;
}

/* Individual Cell Styling */
.matrix-cell {
  padding: 12px 8px;
  color: #fff;
  background-color: #000;
  text-align: left;
  border-bottom: 1px solid #ccc;
  border-right: 1px solid #ccc;
}

/* Remove border-right on last column cells */
.matrix-cell:nth-child(6n) {
  border-right: none;
}

/* Header Cell Styling */
.matrix-header {
  background-color: #333; /* Header background */
  font-weight: bold;
  text-align: center;
  padding: 15px 8px;
  border-top: none;
}

/* Spanning Logic (Applies to Address, Working Hours, and Contact No.) */

/* The Address column spans down rows 1-5 (Starts at grid row 2, spans 5 rows) */
.matrix-address {
  grid-row: 2 / 7;
  grid-column: 4 / 5; /* 4th column */
  display: flex;
  align-items: center;
  text-align: center;
  justify-content: center;
  font-size: 0.9em;
}

/* The Working Hours column spans down rows 1-5 */
.matrix-working-hours {
  grid-row: 2 / 7;
  grid-column: 5 / 6; /* 5th column */
  display: flex;
  align-items: center;
  text-align: center;
  justify-content: center;
}

/* The Contact No. column spans down rows 1-5 */
.matrix-contact-no {
  grid-row: 2 / 7;
  grid-column: 6 / 7; /* 6th column */
  display: flex;
  align-items: center;
  text-align: center;
  justify-content: center;
  word-break: break-word;
  border-right: none; /* Last column has no right border */
}

/* Remove the bottom border on the last data row's non-spanning cells */
.matrix-cell:nth-last-child(-n + 3):not(.matrix-spanning-cell) {
  border-bottom: none;
}

/* Remove bottom border on spanning cells, as they are part of the main container border */
.matrix-address,
.matrix-working-hours,
.matrix-contact-no {
  border-bottom: none;
}

/* Link Styling */
.matrix-link {
  color: #fff;
  text-decoration: underline;
}

.matrix-link:hover {
  color: #ccc;
}

/* =================================================== */
/* Responsive adjustments for small screens (Mobile View) */
/* =================================================== */
@media (max-width: 768px) {
  .matrix-main-header {
    border-radius: 4px;
    margin-bottom: 10px;
  }

  .matrix-grid-container {
    display: block; /* Switch to block layout for stacking */
    border: none;
  }

  /* Hide the original header cells on mobile */
  .matrix-header {
    display: none;
  }

  /* Style for each stacked block of data */
  .escalation-row {
    border: 1px solid #ccc;
    margin-bottom: 15px;
    padding: 10px;
    border-radius: 4px;
  }

  /* Style for each data point within the row */
  .data-point {
    padding: 5px 0;
    line-height: 1.4;
  }

  /* Use before pseudo-elements to label the data */
  .data-point::before {
    content: attr(data-label) ": ";
    font-weight: bold;
    color: #ccc;
    display: inline;
  }

  /* The spanning columns should only appear once at the end of the first block */
  .matrix-address,
  .matrix-working-hours,
  .matrix-contact-no {
    display: block !important;
    grid-row: auto;
    grid-column: auto;
    text-align: left;
    padding: 5px 0;
  }
}

/* Main Wrapper */
.registration-wrapper {
  color: #fff;
  font-size: 0.9em;
}

.registration-title {
  font-size: 1.2em;
  font-weight: bold;
  padding: 10px 0;
  color: #fff;
  margin-bottom: 15px;
}

/* Using CSS Grid for the table structure (Desktop View) */
.registration-grid {
  display: grid;
  grid-template-columns: 2fr 1.5fr 2fr; /* Three columns */
  border: 1px solid #ccc;
  border-radius: 4px;
  overflow: hidden;
}

/* Individual Cell Styling */
.reg-cell {
  padding: 12px 10px;
  color: #fff;
  background-color: #000;
  text-align: center;
  border-bottom: 1px solid #ccc;
  border-right: 1px solid #ccc;
  word-break: break-word;
}

/* Header Cell Styling */
.reg-header-cell {
  background-color: #333; /* Header background */
  font-weight: bold;
  text-align: center;
  padding: 15px 10px;
  border-top: none;
}

/* Remove border-right on last column cells */
.reg-cell:nth-child(3n) {
  border-right: none;
}

/* Remove bottom border on last row cells */
.registration-grid > .reg-cell:nth-last-child(-n + 3) {
  border-bottom: none;
}

/* Responsive adjustments for small screens (Mobile View) */
@media (max-width: 600px) {
  .registration-grid {
    display: block; /* Stack everything vertically */
    border: none;
  }

  .reg-header-cell {
    display: none; /* Hide original headers */
  }

  /* Style for each conceptual row block */
  .reg-cell {
    border: 1px solid #ccc;
    margin-bottom: 15px;
    padding: 10px;
    border-radius: 4px;
    display: block;
  }

  /* Style for each data point within the row */
  .reg-data-point {
    padding: 5px 0;
    line-height: 1.4;
  }

  /* Use before pseudo-elements to label the data */
  .reg-data-point::before {
    content: attr(data-label) ": ";
    font-weight: bold;
    color: #ccc;
    display: inline;
  }

  /* Since the grid is converted to block, we need to create the mobile row grouping manually */

  /* The mobile display requires repeating headers. We will achieve this by wrapping each logical row in a div 
               and applying the mobile styling to those wrappers instead of the grid. 
               Since we are in the main grid container, we'll revert to the original cell structure and rely on the mobile view below. 
               The code below is fixed to remove the redundant block and keep the grid structure clean.
            */

  /* Re-implementing the data structure for mobile view only using CSS to show labels */
  .registration-grid {
    display: flex;
    flex-direction: column;
    gap: 15px;
    border: none;
  }

  /* Cells now act as the labeled data points */
  .reg-cell {
    display: flex;
    justify-content: space-between;
    border: none;
    border-bottom: 1px solid #ccc;
    padding: 10px 0;
  }

  /* Add labels using attributes if needed, but for this simple table, we will hardcode the labels for clarity */

  .reg-cell:nth-child(4)::before {
    content: "Segment: ";
    font-weight: bold;
    color: #ccc;
  }
  .reg-cell:nth-child(5)::before {
    content: "Registration No.: ";
    font-weight: bold;
    color: #ccc;
  }
  .reg-cell:nth-child(6)::before {
    content: "Validity: ";
    font-weight: bold;
    color: #ccc;
  }

  .reg-cell:nth-child(7)::before {
    content: "Segment: ";
    font-weight: bold;
    color: #ccc;
  }
  .reg-cell:nth-child(8)::before {
    content: "Registration No.: ";
    font-weight: bold;
    color: #ccc;
  }
  .reg-cell:nth-child(9)::before {
    content: "Validity: ";
    font-weight: bold;
    color: #ccc;
  }

  /* Reset specific border issues when using flex/block */
  .reg-cell {
    border-right: none;
    border-bottom: 1px solid #ccc;
  }
}

/* Main Wrapper */
.audit-wrapper {
  color: #fff;
  font-size: 0.9em;
}

/* Header Block */
.audit-header-block {
  margin-bottom: 20px;
  padding-bottom: 10px;
  border-bottom: 1px solid #333;
}

.principal-officer-info {
  font-size: 1.1em;
  font-weight: bold;
  margin-bottom: 8px;
}

.disclosure-text {
  line-height: 1.5;
  color: #ccc;
}

/* =================================================== */
/* Desktop Grid Structure */
/* =================================================== */

.compliance-grid {
  display: grid;
  /* 5 columns: Sr. No, Financial Year, Status, Remarks, Audit Reports */
  grid-template-columns: 0.5fr 1fr 2.5fr 1.5fr 1fr;
  border: 1px solid #ccc;
  border-radius: 4px;
  overflow: hidden;
  /* Hide the separate data rows in desktop view to avoid visual noise */
}

/* Data Row Wrapper (Desktop only) */
.audit-data-row {
  display: contents; /* Makes the children participate directly in the grid */
}

/* Individual Cell Styling */
.audit-cell {
  padding: 12px 10px;
  color: #fff;
  background-color: #000;
  text-align: center;
  border-bottom: 1px solid #ccc;
  border-right: 1px solid #ccc;
  word-break: break-word;
}

/* Header Cell Styling */
.audit-header-cell {
  background-color: #333; /* Header background */
  font-weight: bold;
  text-align: center;
  padding: 15px 10px;
  border-top: none;
}

/* Remove border-right on last column cells */
.audit-cell:nth-child(5n) {
  border-right: none;
}

/* Remove bottom border on cells in the last data row */
.audit-data-row:last-of-type .audit-cell {
  border-bottom: none;
}

/* Link Styling for Audit Reports */
.audit-link {
  color: #fff;
  text-decoration: underline;
}

.audit-link:hover {
  color: #ccc;
}

/* =================================================== */
/* Responsive adjustments for small screens (Mobile View) */
/* =================================================== */
@media (max-width: 768px) {
  .compliance-grid {
    display: block; /* Stack everything vertically */
    border: none;
    padding-top: 5px;
  }

  .audit-header-cell {
    display: none; /* Hide original headers */
  }

  /* Each data row wrapper becomes a visible block with a border */
  .audit-data-row {
    display: block;
    border: 1px solid #ccc;
    margin-bottom: 15px;
    padding: 10px;
    border-radius: 4px;
    background-color: #111;
  }

  /* Individual cells stack within the row block */
  .audit-cell {
    display: block;
    padding: 5px 0;
    text-align: left;
    background-color: transparent;
    border: none !important; /* Remove all cell borders */
  }

  /* Use data-label based on cell position within the 5-cell row */
  .audit-data-row .audit-cell:nth-child(1)::before {
    content: "Sr. No.: ";
  }
  .audit-data-row .audit-cell:nth-child(2)::before {
    content: "Financial Year: ";
  }
  .audit-data-row .audit-cell:nth-child(3)::before {
    content: "Compliance Audit Status: ";
  }
  .audit-data-row .audit-cell:nth-child(4)::before {
    content: "Remarks: ";
  }
  .audit-data-row .audit-cell:nth-child(5)::before {
    content: "Audit Reports: ";
  }

  /* Apply label styling */
  .audit-data-row .audit-cell::before {
    font-weight: bold;
    color: #fff;
    display: inline-block;
    min-width: 120px;
  }
}

/* Container */
.fk-dropdown-container {
  position: relative;
  display: inline-block;
  cursor: pointer;
  margin-right: 5px;
  /* margin-left: 20px; */
}

/* Trigger button */
.fk-dropdown-trigger {
  color: white;
  font-size: 20px;
  padding: 6px 0;
  font-weight: 500;
}

/* Dropdown menu */
.fk-dropdown-menu {
  position: absolute;
  top: 100%; /* no gap now */
  left: 0;
  background: #f3f3f3;
  padding: 8px 0;
  border-radius: 8px;
  width: 150px;
  display: none;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  z-index: 20;

  /* Fix flicker by creating a hover buffer zone */
  padding-top: 6px;
}

/* Dropdown items */
.fk-dropdown-item {
  display: block;
  padding: 10px 14px;
  font-size: 14px;
  text-decoration: none;
  color: #111;
  transition: 0.25s ease;
}

.fk-dropdown-item:hover {
  background: #e6e6e6;
}

/* Show dropdown on hover OR while dropdown itself is hovered */
.fk-dropdown-container:hover .fk-dropdown-menu,
.fk-dropdown-menu:hover {
  display: block;
}

.fk-ndpms-section {
  background: transparent; /* keep your page background */
  padding: 20px 0;

  color: white;
}

.fk-ndpms-title {
  font-size: 26px;
  margin-bottom: 12px;
  font-weight: 600;
  color: white;
  text-align: left;
}

.fk-ndpms-text {
  font-size: 16px;
  line-height: 1.6;
  color: white;
  text-align: left;
}

.fk-kyc-section {
  color: white;
}

.fk-kyc-title {
  font-size: 24px;
  font-weight: 600;
  margin: 25px 0 12px;
  color: white;
}

.fk-kyc-list {
  list-style: none;
  padding-left: 0;
  margin-bottom: 25px;
}

.fk-kyc-item {
  font-size: 16px;
  line-height: 1.7;
  margin-bottom: 8px;
  color: white;
}

.fk-kyc-item a {
  color: #fff;
  text-decoration: underline;
}

.fk-kyc-link {
  color: #ffd700; /* gold highlight */
  text-decoration: underline;
}

.fk-kyc-link:hover {
  opacity: 0.8;
}

.darkReportsSection {
  background: #000;
  padding: 60px 0;
  color: white;
  padding: 150px 0;
}

.darkReportsContainer {
  margin: 0 auto;
}

.darkReportsHeading {
  text-align: center;
  font-size: 32px;
  margin-bottom: 40px;
  color: #f15a22;
}

.darkReportsColumns {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  place-items: center;
  align-items: start;
  gap: 40px;
}

.darkReportColumn {
  padding: 10px;
}

.darkReportColTitle {
  font-size: 20px;
  margin-bottom: 20px;
  color: #f15a22;
  font-weight: 600;
}

.darkReportList {
  list-style: none;
  padding: 0;
  margin: 0;
}

.darkReportList li {
  margin-bottom: 14px;
}

.darkReportList a {
  color: white;
  text-decoration: none;
  font-size: 15px;
  transition: 0.25s ease;
}

.darkReportList a:hover {
  color: #f15a22;
  padding-left: 6px;
}

/* Wrapper */
.swgSection {
  /* background: #0a0a0a; */
  color: #fff;
  padding: 100px 0;
}

/* Title */
.swgTitle {
  font-size: 32px;
  font-weight: 700;
  color: #fff;
  display: flex;
  align-items: center;
  gap: 8px;
}

.swgCallLeft {
  width: 200px;
}

.swgTitleIcon {
  color: #f15a22;
  font-size: 30px;
}

.swgSubtitle {
  margin-top: 5px;
  color: #c7c7c7;
  font-size: 14px;
}

/* Stats Container */
.swgStatsWrapper {
  margin-top: 25px;
  background: #111;
  border-radius: 10px;
  padding: 20px 25px;
  display: flex;
  gap: 50px;
  justify-content: space-between;
}

.swgStatBox {
  flex: 1;
}

.swgStatLabel {
  color: #c7c7c7;
  font-size: 13px;
}

.swgStatValue {
  font-size: 20px;
  margin-top: 4px;
}

.swgGreen {
  color: #24d46b;
}

.swgOrange {
  color: #f15a22;
}

/* Active Calls Title */
.swgActiveTitle {
  margin: 30px 0 15px;
  font-size: 30px;
}

/* Call Row */
.swgCallRow {
  background: #131313;
  border-radius: 10px;
  padding: 20px 25px;
  margin-bottom: 15px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
}

.swgStockName {
  font-size: 18px;
  margin-bottom: 5px;
}

.swgStatus {
  font-size: 12px;
  background: #0f7a37;
  padding: 4px 10px;
  border-radius: 20px;
  color: #fff;
}

.swgCallData {
  display: flex;
  gap: 80px;
}

.swgDataBlock {
  text-align: left;
}

.swgDataLabel {
  font-size: 12px;
  color: #c7c7c7;
}

.swgDataValue {
  margin-top: 3px;
  font-size: 15px;
  color: #fff;
}

.swgCallRight {
  display: flex;
  gap: 10px;
}

/* Button */
.swgDetailsBtn {
  background: transparent;
  border: 1px solid #f15a22;
  padding: 7px 14px;
  color: #f15a22;
  font-size: 13px;
  border-radius: 8px;
  text-decoration: none;
  transition: 0.2s;
}

.swgDetailsBtn:hover {
  background: #f15a22;
  color: #000;
}

/* Responsive */
@media (max-width: 900px) {
  .swgCallRow {
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
  }

  .swgCallData {
    flex-wrap: wrap;
    gap: 20px;
  }

  .swgStatsWrapper {
    flex-wrap: wrap;
    gap: 20px;
  }
}

/* Locked row container (NO BLUR here) */
.swgLockedRow {
  position: relative;
  opacity: 0.5;
  pointer-events: none;
}

/* Apply blur only on internal content */
.swgLockedBlur {
  filter: blur(4px);
}

/* Center Overlay — fully visible, clear, no blur */
.swgLockedOverlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(3px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 1px solid #f15a22;
  border-radius: 12px;
  pointer-events: auto; /* So button is clickable */
  opacity: 1; /* Make sure it is not dimmed */
}

/* Visible and sharp text */
.swgLockedText {
  color: white;
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 10px;
}

/* Visible and sharp button */
.swgLockedBtn {
  background: #f15a22;
  color: white;
  border: none;
  padding: 10px 26px;
  font-size: 16px;
  border-radius: 8px;
  cursor: pointer;
}

.swgLockedBtn:hover {
  opacity: 0.9;
}

.report-wrapper {
  max-width: 1024px;
  margin: 0 auto;
  border-radius: 12px;
  box-shadow:
    0 10px 15px -3px rgba(0, 0, 0, 0.2),
    0 4px 6px -2px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  padding-top: 100px;
}

/* Header Styling */
.report-header {
  padding: 24px;
}
.trade-status-tag {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 9999px;
  font-size: 0.75rem;
  font-weight: 500;
  background-color: #14532d; /* --color-tag-bg */
  color: #6ee7b7; /* --color-tag-text */
  margin-bottom: 8px;
}
.header-title {
  font-size: 2rem;
  font-weight: 800;
  color: white;
  margin-bottom: 12px;
}
.header-meta {
  display: flex;
  flex-wrap: wrap;
  color: #a0a0a0; /* --color-text-muted */
  font-size: 0.875rem;
  gap: 16px;
}
.meta-item {
  display: flex;
  align-items: center;
}
.meta-dot {
  width: 6px;
  height: 6px;
  background-color: #a0a0a0; /* --color-text-muted */
  border-radius: 50%;
  margin-right: 8px;
}

/* Section Styling */
.section-card {
  padding: 32px;
  background-color: #242424; /* --color-card-dark */
  border-radius: 12px;
  margin-bottom: 24px;
  box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.3);
}
.section-card:first-of-type {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.section-title {
  font-size: 1.5rem;
  font-weight: 500;
  margin-bottom: 24px;
}

/* Trade Parameters Grid */
.trade-parameters-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}
.parameter-label {
  font-size: 0.875rem;
  color: #a0a0a0; /* --color-text-muted */
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 8px;
}
.parameter-value {
  font-size: 1.5rem;
  font-weight: 700;
}
.parameter-subtext {
  font-size: 0.75rem;
  margin-top: 4px;
}
.value-entry,
.value-target {
  color: #f15a22; /* --color-trade-orange */
  margin-bottom: 10px;
}
.value-current {
  color: #4ade80; /* --color-success */
  margin-bottom: 10px;
}
.value-stop {
  color: #f87171; /* --color-risk */
  margin-bottom: 10px;
}
.subtext-current {
  color: #4ade80; /* --color-success */
}
.subtext-stop {
  color: #f87171; /* --color-risk */
}

/* CTA Section */
.cta-section {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 20px;
  border: 1px solid #374151; /* Gray-700 equivalent */
  border-radius: 12px;
  background-color: #242424; /* --color-card-dark */
  margin-bottom: 24px;
}
.cta-content {
  display: flex;
  align-items: flex-start;
  width: 100%;
  margin-bottom: 16px;
}
.cta-icon {
  color: #f15a22; /* --color-trade-orange */
  font-size: 1.5rem;
  margin-right: 12px;
}
.cta-heading {
  font-weight: 600;
  color: #e0e0e0; /* --color-text-light */
  margin-bottom: 4px;
}
.cta-subtext {
  font-size: 0.875rem;
  color: #a0a0a0; /* --color-text-muted */
}
.cta-button {
  width: 100%;
  padding: 10px 20px;
  font-size: 0.875rem;
  font-weight: 600;
  border-radius: 8px;
  background-color: #f15a22; /* --color-trade-orange */
  color: white;
  border: none;
  cursor: pointer;
  transition: background-color 0.15s ease;
  box-shadow: 0 4px 6px -1px rgba(229, 94, 0, 0.3);
}
.cta-button:hover {
  background-color: #c95100; /* Slightly darker orange */
}

/* Analysis Section */
.analysis-point {
  margin-bottom: 24px;
  line-height: 1.6;
}
.analysis-point p {
  color: #a0a0a0; /* --color-text-muted */
}
.analysis-point strong {
  color: #e0e0e0; /* --color-text-light */
  font-weight: 600;
  /* display: block; */
  margin-bottom: 4px;
}

/* Key Levels Section */
.level-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 0;
  border-bottom: 1px solid #374151; /* Gray-700 equivalent */
}
.level-item:last-child {
  border-bottom: none;
}
.level-label {
  color: #a0a0a0;
  font-weight: 500;
  margin-bottom: 0px;
}
.level-value {
  font-size: 1.125rem;
  font-weight: 700;
  color: #e0e0e0;
  margin-bottom: 0;
}

/* Responsive Adjustments (Tablet/Desktop) */
@media (min-width: 640px) {
  .header-title {
    font-size: 2.25rem;
  }
  .cta-section {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }
  .cta-content {
    margin-bottom: 0;
    width: auto;
  }
  .cta-button {
    width: auto;
  }
}

/* Responsive Adjustments (Desktop) */
@media (min-width: 768px) {
  .trade-parameters-grid {
    grid-template-columns: repeat(4, 1fr);
  }
  .section-card {
    padding: 32px 48px;
  }
  .report-header {
    padding: 32px 48px;
  }
}

.tmSectionWrapper {
  margin-top: 20px;
  color: #fff;
}

/* GRID */
.tmTopGrid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(330px, 1fr));
  gap: 20px;
  margin-bottom: 25px;
}

/* SMALL BOXES */
.tmBox {
  background: #111;
  border-radius: 12px;
  padding: 22px 25px;
  border: 1px solid #202020;
}

.tmBoxTitle {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 12px;
}

.tmIcon {
  color: #f15a22;
  margin-right: 6px;
}

.tmList {
  list-style: disc;
  padding-left: 20px;
  margin: 0;
}

.tmList li {
  margin-bottom: 6px;
  color: #d4d4d4;
}

/* BIG BOX */
.tmBigBox {
  background: #111;
  border-radius: 12px;
  padding: 25px 28px;
  border: 1px solid #202020;
  margin-bottom: 30px;
}

.tmBigTitle {
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 14px;
}

.tmBigBox p {
  font-size: 15px;
  line-height: 1.6;
  color: #dcdcdc;
  margin-bottom: 12px;
}

.tmBigBox strong {
  color: #fff;
}

/* BUTTON ROW */
.tmButtonRow {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 10px;
}

.tmBtn {
  padding: 12px 20px;
  border-radius: 10px;
  border: 1px solid #f15a22;
  font-size: 15px;
  font-weight: 500;
  cursor: pointer;
  transition: 0.2s ease;
  background: transparent;
}

.tmDownloadBtn {
  background: #f15a22;
  color: #fff;
  border-color: #f15a22;
}

.tmChatBtn {
  background: transparent;
  color: #f15a22;
}

.tmBtn:hover {
  opacity: 0.85;
}

/* RESPONSIVE */
@media (max-width: 600px) {
  .tmBigTitle {
    font-size: 20px;
  }
  .tmBoxTitle {
    font-size: 18px;
  }
}

.act_div {
  display: flex;
}

/* General dark theme colors */
.chat-container {
  position: fixed;
  bottom: 80px; /* Above the toggle button */
  right: 20px;
  width: 380px; /* Fixed width for desktop */
  height: 550px; /* Fixed height for desktop */
  background-color: #1c1c1c; /* Dark background */
  border-radius: 16px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  z-index: 1000;
  opacity: 0;
  visibility: hidden;
  transform: scale(0.95);
  transition:
    opacity 0.3s ease,
    visibility 0.3s ease,
    transform 0.3s ease;
}

.chat-container.is-open {
  opacity: 1;
  visibility: visible;
  transform: scale(1);
}

/* Mobile Responsiveness */
@media (max-width: 600px) {
  .chat-container {
    width: 90%;
    height: 90vh;
    bottom: 10px;
    right: 5%;
    left: 5%;
  }
}
@media (max-width: 450px) {
  .chat-container {
    width: 100%;
    height: 100vh;
    bottom: 0;
    right: 0;
    left: 0;
    border-radius: 0;
  }
}

/* ---------------------------------- */
/* HEADER STYLES */
/* ---------------------------------- */

.chat-header {
  padding: 20px;
  background-color: #242424; /* Header background */
  border-bottom: 1px solid #333333;
  display: flex;
  align-items: flex-start;
  flex-shrink: 0;
}

.header-icon {
  color: #f15a22; /* Orange color */
  font-size: 1.5rem;
  margin-right: 12px;
  line-height: 1;
}

.header-text h3 {
  color: #e0e0e0;
  font-size: 1.1rem;
  font-weight: 600;
  margin: 0;
}

.header-text p {
  color: #a0a0a0;
  font-size: 0.8rem;
  margin: 2px 0 0 0;
}

/* ---------------------------------- */
/* BODY AND MESSAGE STYLES */
/* ---------------------------------- */

.chat-body {
  flex-grow: 1;
  padding: 16px;
  overflow-y: auto;
  background-color: #1a1a1a; /* Chat body background */
}

/* Scrollbar styling for better look on dark theme */
.chat-body::-webkit-scrollbar {
  width: 8px;
}

.chat-body::-webkit-scrollbar-thumb {
  background-color: #444444;
  border-radius: 4px;
}

.chat-body::-webkit-scrollbar-track {
  background-color: #242424;
}

.message-bubble {
  background-color: #333333; /* Bubble background */
  color: #e0e0e0;
  padding: 12px 16px;
  border-radius: 18px 18px 18px 4px;
  max-width: 85%;
  margin-bottom: 16px;
  line-height: 1.5;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

/* ---------------------------------- */
/* QUICK SUGGESTIONS */
/* ---------------------------------- */

.suggestion-title {
  color: #a0a0a0;
  font-size: 0.85rem;
  font-weight: 500;
  margin-top: 10px;
  margin-bottom: 8px;
}

.suggestion-button {
  display: block;
  width: 100%;
  background-color: #333333;
  color: #e0e0e0;
  padding: 10px 15px;
  border: none;
  border-radius: 8px;
  text-align: left;
  font-size: 0.9rem;
  cursor: pointer;
  margin-bottom: 8px;
  transition: background-color 0.2s ease;
}

.suggestion-button:hover {
  background-color: #444444;
}

/* ---------------------------------- */
/* FOOTER & INPUT STYLES */
/* ---------------------------------- */

.chat-footer {
  padding: 12px 16px;
  background-color: #242424; /* Footer background */
  border-top: 1px solid #333333;
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

.question-input {
  flex-grow: 1;
  padding: 10px;
  margin-right: 10px;
  border: 1px solid #555555;
  border-radius: 8px;
  background-color: #333333;
  color: #e0e0e0;
  font-size: 0.9rem;
  outline: none;
  transition: border-color 0.2s ease;
}

.question-input::placeholder {
  color: #888888;
}

.question-input:focus {
  border-color: #f15a22;
}

.send-button {
  width: 40px;
  height: 40px;
  background-color: #f15a22; /* Orange color */
  border: none;
  border-radius: 8px;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  transition:
    background-color 0.2s ease,
    transform 0.1s ease;
  box-shadow: 0 4px 8px rgba(229, 94, 0, 0.4);
}

.send-button:hover {
  background-color: #c95100; /* Slightly darker orange */
}

.send-button:active {
  transform: scale(0.98);
}

.send-icon {
  color: white;
  font-size: 1.1rem;
  transform: rotate(-10deg);
}

/* ---------------------------------- */
/* TOGGLE BUTTON STYLES (Floating Icon) */
/* ---------------------------------- */

.chat-toggle-btn {
  position: fixed;
  bottom: 20px;
  right: 20px;
  width: 50px;
  height: 50px;
  background-color: #f15a22; /* Orange color */
  border: none;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1001;
  box-shadow: 0 4px 12px rgba(229, 94, 0, 0.6);
  transition:
    transform 0.3s ease,
    background-color 0.2s ease;
}

.chat-toggle-btn:hover {
  background-color: #c95100;
}

.toggle-icon {
  font-size: 1.5rem;
  color: white;
  transition: transform 0.3s ease;
}

/* Styling for the close (X) icon when chat is open */
.chat-container.is-open ~ .chat-toggle-btn .toggle-icon {
  transform: rotate(45deg); /* Spin the icon to look like a close 'X' */
}

.ipo_main_container {
  /* max-width: 900px; */
  margin: 0 auto;
  padding: 100px 0;
}

/* Orange color definition */
.color_accent_orange {
  color: #f15a22;
}
.bg_accent_orange {
  background-color: #f15a22;
}

/* ---------------------------------- */
/* HEADER STYLES */
/* ---------------------------------- */
.ipo_section_header {
  margin-bottom: 24px;
}

.header_main_icon {
  font-size: 1.5rem;
  margin-right: 10px;
  vertical-align: middle;
}

.header_title_text {
  font-size: 2rem;
  font-weight: 800;
  margin: 0 0 8px 0;
  display: inline-block;
}

.header_subtitle_text {
  color: #a0a0a0; /* Muted text color */
  font-size: 0.9rem;
  margin: 0;
}

/* ---------------------------------- */
/* TAB NAVIGATION STYLES */
/* ---------------------------------- */
.tab_navigation_bar {
  display: flex;
  margin-bottom: 20px;
  border-bottom: 1px solid #333333; /* Separator */
}

.tab_control_button {
  padding: 10px 18px;
  font-size: 1rem;
  font-weight: 500;
  color: #a0a0a0;
  background-color: transparent;
  border: none;
  border-bottom: 2px solid transparent;
  cursor: pointer;
  transition:
    color 0.2s,
    border-color 0.2s;
  margin-right: 8px; /* Space between tabs */
}

.tab_control_button.is_active_tab {
  color: #f15a22; /* Orange for active tab text */
  border-bottom: 2px solid #f15a22; /* Orange underline for active tab */
}

.tab_control_button:hover:not(.is_active_tab) {
  color: #e0e0e0; /* Light hover color */
}

/* ---------------------------------- */
/* TAB CONTENT STYLES */
/* ---------------------------------- */
.tab_content_view {
  display: none; /* Hidden by default */
}

.tab_content_view.is_active_tab {
  display: block; /* Shown when active */
}

/* ---------------------------------- */
/* IPO REPORT CARD STYLES */
/* ---------------------------------- */
.ipo_report_card {
  background-color: #242424; /* Card background color */
  border-radius: 12px;
  padding: 20px;
  margin-bottom: 16px;
  display: flex;
  flex-direction: column;
  border: 1px solid #2e2e2e;
  transition: border-color 0.2s;
}

.ipo_report_card:hover {
  border-color: #3f3f3f;
}

.card_detail_row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  margin-bottom: 15px;
}

.company_info_block {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  margin-right: 15px;
  min-width: 150px; /* Ensures name is readable */
}

.company_name_heading {
  font-size: 1.1rem;
  font-weight: 700;
  margin-bottom: 4px;
}

.sector_tag_pill {
  display: inline-block;
  background-color: #333333;
  color: #e0e0e0;
  font-size: 0.75rem;
  padding: 4px 8px;
  border-radius: 6px;
  font-weight: 500;
  margin-top: 4px;
  width: max-content;
}

/* Column Data (Price Range, Subscription) */
.ipo_data_columns {
  display: flex;
  gap: 20px;
  align-items: center;
}

.data_column_item {
  display: flex;
  flex-direction: column;
  text-align: right;
  min-width: 100px;
}

.column_label_header {
  color: #a0a0a0;
  font-size: 0.8rem;
  font-weight: 500;
  margin-bottom: 4px;
}

.column_value_data {
  font-size: 1rem;
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.date_calendar_icon {
  font-size: 1rem;
  margin-right: 5px;
}

/* Actions Row */
.card_action_buttons {
  display: flex;
  gap: 10px;
}

.action_button_base {
  padding: 8px 15px;
  border-radius: 8px;
  font-size: 0.85rem;
  font-weight: 600;
  cursor: pointer;
  border: none;
  transition: opacity 0.2s;
}

.action_button_base:hover {
  opacity: 0.85;
}

.btn_subscribe_primary {
  background-color: #16a34a; /* Green */
  color: white;
}

.btn_view_secondary {
  background-color: #333333;
  color: #e0e0e0;
}

/* ---------------------------------- */
/* RESPONSIVENESS */
/* ---------------------------------- */
@media (max-width: 600px) {
  .card_detail_row {
    flex-direction: column;
    align-items: stretch;
  }

  .company_info_block {
    margin-right: 0;
    margin-bottom: 15px;
  }

  .ipo_data_columns {
    justify-content: space-between;
    width: 100%;
    gap: 10px;
  }

  .data_column_item {
    text-align: left;
    min-width: unset;
    flex: 1; /* Distribute space evenly */
  }

  .column_value_data {
    justify-content: flex-start;
  }
}

@media (max-width: 400px) {
  .card_action_buttons {
    flex-direction: column;
  }
  .action_button_base {
    width: 100%;
    text-align: center;
  }
}

.table_main_container {
  margin: 0 auto 20px;
  background-color: #242424; /* Background for the content area */
  border-radius: 12px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
  overflow: hidden; /* Ensures rounded corners clip table content */
}

/* Color definitions */
.color_positive {
  color: #4ade80;
} /* Green for positive returns/Buy */
.color_negative {
  color: #f87171;
} /* Red for negative returns */
.bg_buy {
  background-color: #16a34a;
} /* Darker green background for Buy tag */
.bg_hold {
  background-color: #fbbf24;
} /* Yellow/Amber background for Hold tag */
.text_dark {
  color: #1c1c1c;
} /* Dark text for light tags */

/* ---------------------------------- */
/* HEADER STYLES */
/* ---------------------------------- */
.table_title_header {
  padding: 20px;
  font-size: 1.8rem;
  font-weight: 800;
  border-bottom: 1px solid #333333;
  margin: 0;
  color: white;
}

/* ---------------------------------- */
/* TABLE STYLES (Grid Layout for responsiveness) */
/* ---------------------------------- */

.market_data_table {
  width: 100%;
  border-collapse: collapse;
  display: grid;
  /* Define 6 columns for desktop layout */
  grid-template-columns: 2fr repeat(4, 1fr) 0.5fr;
  font-size: 0.95rem;
}

/* Table Headings */
.table_row_header,
.table_row_data {
  display: contents; /* Allows grid items to flow across the row */
}

.table_row_header {
  background-color: #242424; /* Same as container for seamless look */
  color: #a0a0a0;
  font-weight: 600;
  font-size: 0.85rem;
  text-align: left;
  padding: 15px 20px;
  position: sticky;
  top: 0;
  z-index: 10;
}

/* Common cell styling */
.table_row_header > div,
.table_row_data > div {
  padding: 15px 20px;
  border-bottom: 1px solid #333333;
}

/* Data Row Styling */
.table_row_data {
  background-color: #2e2e2e;
  transition: background-color 0.2s;
}

.table_row_data:hover {
  background-color: #383838;
}

/* Specific Cell Alignment (Data columns centered/right) */
.table_row_data > div:nth-child(2),
.table_row_data > div:nth-child(3),
.table_row_data > div:nth-child(4),
.table_row_data > div:nth-child(5) {
  justify-content: flex-end; /* Right align data */
}

/* Rating Tag Style */
.rating_tag {
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 6px;
  text-align: center;
  line-height: 1;
}

/* Fix for last row border */
.table_row_data:last-child > div {
  border-bottom: none;
}

/* ---------------------------------- */
/* RESPONSIVENESS (Turning the table into stacked cards on mobile) */
/* ---------------------------------- */
@media (max-width: 768px) {
  .table_main_container {
    padding: 10px;
    border-radius: 0;
    box-shadow: none;
    background-color: transparent;
  }

  .table_title_header {
    font-size: 1.5rem;
    padding: 10px 0;
    border-bottom: 0;
    margin-bottom: 15px;
  }

  .market_data_table {
    /* Reset grid and use block/flex for stacking */
    display: block;
    font-size: 1rem;
  }

  /* Hide the main header row on mobile */
  .table_row_header {
    display: none;
  }

  .table_row_data {
    display: flex;
    flex-direction: column;
    margin-bottom: 15px;
    border-radius: 8px;
    background-color: #2e2e2e;
    padding: 0;
    border: 1px solid #333333;
  }

  .table_row_data > div {
    padding: 12px 15px;
    border-bottom: 1px solid #333333;
    justify-content: space-between;
  }

  .table_row_data > div:last-child {
    border-bottom: none;
  }

  /* Add a pseudo-header label to each row item on mobile */
  .table_row_data > div::before {
    content: attr(data-label);
    color: #a0a0a0;
    font-weight: 500;
    margin-right: 15px;
    min-width: 100px;
    text-align: left;
  }

  /* Special styling for the company name row */
  .table_row_data > div:first-child {
    font-weight: 700;
    font-size: 1.1rem;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    background-color: #383838;
    border-bottom: 1px solid #444;
  }
  .table_row_data > div:first-child::before {
    content: ""; /* Hide label on company name */
  }

  /* Center rating tag on mobile */
  .rating_tag {
    width: auto;
  }
}
/* Orange accent color */
.color_accent_orange {
  color: #f15a22;
}

/* ---------------------------------- */
/* CONTAINER LAYOUT */
/* ---------------------------------- */
.cards_outer_wrapper {
  padding: 0px 0 100px;
  margin: 0 auto;
  /* Flexbox for side-by-side alignment and wrapping */
  display: flex;
  gap: 20px;

  flex-wrap: wrap; /* Allows cards to wrap on smaller screens */
}

/* ---------------------------------- */
/* INDIVIDUAL CARD STYLES */
/* ---------------------------------- */
.feature_update_card {
  /* Ensures cards take up equal space and grow/shrink */
  flex: 1 1 300px; /* Base width of ~300px, but flexible */

  background-color: #0b0b0b; /* Card background color */
  border-radius: 12px;
  padding: 25px;
  /* UPDATED: Border is 2px solid orange permanently */
  border: 1px solid #151515;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
  transition: all 0.3s ease-in-out;
  cursor: pointer;
  min-height: 150px; /* Minimum height for consistency */

  /* Inner content alignment */
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.feature_update_card:hover {
  /* Border color remains orange, but we keep the hover effects */
  transform: translateY(-3px); /* Subtle lift effect */
  box-shadow: 0 6px 15px rgba(229, 94, 0, 0.2);
}

.card_title_heading {
  font-size: 1.25rem;
  font-weight: 700;
  margin: 0;
  color: #f15a22;
}

.card_content_description {
  font-size: 0.9rem;
  color: #a0a0a0;
  margin-top: 10px;
}

.card_icon_placeholder {
  font-size: 2rem;
  width: 40px;
  height: 40px;
  border-radius: 8px;
  background-color: #333333;
  color: #f15a22;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 10px;
}

/* ---------------------------------- */
/* RESPONSIVENESS */
/* ---------------------------------- */
/* On small screens (less than 640px), cards stack vertically */
@media (max-width: 640px) {
  .cards_outer_wrapper {
    flex-direction: column;
    gap: 15px;
  }
  .feature_update_card {
    flex: 1 1 100%; /* Take full width */
    min-height: unset;
  }
}
.products_list_container {
  max-width: 600px;
  margin: 0 auto;
  padding: 20px;
  background-color: #242424; /* Background for the list area */
  border-radius: 12px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
}

.list_heading_title {
  font-size: 1.5rem;
  font-weight: 700;
  color: white;
  margin-bottom: 20px;
  padding-bottom: 10px;
  border-bottom: 2px solid #333333;
}

/* Unordered List */
.product_ul_list {
  list-style: none; /* Remove default bullets */
  padding: 0;
  margin: 0;
}

/* List Item Styling */
.product_li_item {
  padding: 15px 15px;
  margin-bottom: 10px;
  background-color: #2e2e2e; /* Item background */
  border-radius: 8px;
  display: flex;
  align-items: center;
  font-size: 1.1rem;
  font-weight: 500;
  border-left: 5px solid transparent;
  transition: all 0.2s ease-in-out;
}

.product_li_item:hover {
  background-color: #383838;
  border-left-color: #f15a22; /* Orange highlight on hover */
}

/* Styling for the numeric prefix (1, 2, 3) */
.item_prefix_number {
  font-weight: 700;
  font-size: 1.2rem;
  color: #f15a22; /* Orange number */
  margin-right: 15px;
  width: 25px;
  text-align: center;
}

/* Styling for the main product name */
.item_name_text {
  flex-grow: 1;
  color: #fff;
}

/* Styling the 'Chatur' part for consistency (optional emphasis) */
.item_name_text strong {
  color: white;
  font-weight: 700;
}

.ipo_data_page_wrapper {
  background-color: #1c1c1c; /* --dark-bg */
  color: #e0e0e0; /* --text-color */
  padding: 100px 16px;
}

.ipo_section_main {
  max-width: 1100px;
  margin: 0 auto 40px auto;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
  background-color: #242424; /* --card-bg */
}

/* Section Title Styling */
.ipo_section_header_title {
  font-size: 1.6rem;
  font-weight: 700;
  padding: 20px 20px 15px 20px;
  color: white;
  border-bottom: 1px solid #333333; /* --border-color */
  margin: 0;
  display: flex;
  align-items: center;
}

.ipo_section_header_title span {
  color: #f15a22; /* --accent-orange */
  margin-right: 10px;
  font-size: 1.8rem;
}

/* ---------------------------------- */
/* COMMON TABLE STYLES */
/* ---------------------------------- */
.ipo_common_table {
  width: 100%;
  border-collapse: collapse;
  display: grid;
  font-size: 0.95rem;
}

/* Table Header Row */
.ipo_table_header_row,
.ipo_table_data_row {
  display: contents; /* Allows grid items to flow across the row */
}

.ipo_table_header_row {
  color: #a0a0a0; /* --muted-text */
  font-weight: 600;
  font-size: 0.85rem;
  text-align: left;
}

/* Common Cell Styling */
.ipo_table_header_row > div,
.ipo_table_data_row > div {
  padding: 15px 20px;
  border-bottom: 1px solid #333333; /* --border-color */
  display: flex;
  align-items: center;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

/* Data Row Styling */
.ipo_table_data_row {
  background-color: #2e2e2e; /* --row-bg */
  transition: background-color 0.2s;
}

.ipo_table_data_row:hover {
  background-color: #383838;
}

/* Special text coloring for status/returns */
.text_live_green {
  color: #4ade80;
} /* --positive-color */
.text_live_red {
  color: #f15a22;
} /* --accent-orange */
.text_status_tag {
  font-weight: 700;
  padding: 4px 8px;
  border-radius: 6px;
  font-size: 0.75rem;
  line-height: 1;
}

/* ---------------------------------- */
/* LIVE IPO TABLE STYLES */
/* ---------------------------------- */
.live_ipo_data_table {
  grid-template-columns: 2fr 1.5fr 1fr 1fr 1.2fr 1fr; /* 6 Columns */
}

.live_table_data_status {
  display: flex;
  justify-content: center;
}

.live_table_data_status .text_status_tag {
  background-color: #4ade80; /* --positive-color */
  color: #1c1c1c; /* --dark-bg */
}

.live_table_data_status .closed_tag {
  background-color: #a0a0a0; /* --muted-text */
  color: #1c1c1c; /* --dark-bg */
}

/* ---------------------------------- */
/* UPCOMING IPO TABLE STYLES */
/* ---------------------------------- */
.upcoming_ipo_data_table {
  grid-template-columns: 2fr 1.5fr 1.5fr 1fr 1fr; /* 5 Columns */
}

.upcoming_data_tag {
  background-color: #f15a22; /* --accent-orange */
  color: white;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 0.8rem;
  margin-left: 10px;
}

.upcoming_data_date {
  font-weight: 600;
}

/* ---------------------------------- */
/* RESPONSIVENESS */
/* ---------------------------------- */
@media (max-width: 900px) {
  /* On medium screens, simplify the layout for both tables */
  .live_ipo_data_table {
    grid-template-columns: 2fr repeat(3, 1fr); /* Company, Price, Subscribed, Status/Return */
  }
  .upcoming_ipo_data_table {
    grid-template-columns: 2fr repeat(2, 1fr); /* Company, Price, Date */
  }

  /* Hide less critical columns */
  .live_ipo_data_table .ipo_table_header_row div:nth-child(4), /* Issue Size */
            .live_ipo_data_table .ipo_table_data_row div:nth-child(4),
            .live_ipo_data_table .ipo_table_header_row div:nth-child(5), /* Listing Date */
            .live_ipo_data_table .ipo_table_data_row div:nth-child(5) {
    display: none;
  }

  .upcoming_ipo_data_table .ipo_table_header_row div:nth-child(4), /* Lot Size */
            .upcoming_ipo_data_table .ipo_table_data_row div:nth-child(4),
            .upcoming_ipo_data_table .ipo_table_header_row div:nth-child(5), /* Issue Size */
            .upcoming_ipo_data_table .ipo_table_data_row div:nth-child(5) {
    display: none;
  }
}

@media (max-width: 650px) {
  /* On small screens, collapse to stacked cards */
  .ipo_section_main {
    border-radius: 0;
    box-shadow: none;
    background-color: transparent;
  }

  .ipo_section_header_title {
    background-color: #1c1c1c; /* --dark-bg */
    padding: 10px 0;
    margin-bottom: 15px;
    border-bottom: 0;
  }

  .ipo_common_table {
    display: block;
  }

  /* Hide the main header row on mobile */
  .ipo_table_header_row {
    display: none;
  }

  .ipo_table_data_row {
    display: flex;
    flex-direction: column;
    margin-bottom: 20px;
    border-radius: 8px;
    background-color: #2e2e2e; /* --row-bg */
    padding: 0;
    border: 1px solid #333333; /* --border-color */
  }

  .ipo_table_data_row > div {
    padding: 12px 15px;
    border-bottom: 1px solid #333333; /* --border-color */
    justify-content: space-between;
    white-space: normal;
    text-overflow: clip;
  }

  .ipo_table_data_row > div:last-child {
    border-bottom: none;
  }

  /* Add a pseudo-header label to each row item on mobile */
  .ipo_table_data_row > div::before {
    content: attr(data-label);
    color: #a0a0a0; /* --muted-text */
    font-weight: 500;
    margin-right: 15px;
    min-width: 100px;
    text-align: left;
  }

  /* Special styling for the company name row */
  .ipo_table_data_row > div:first-child {
    font-weight: 700;
    font-size: 1.1rem;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    background-color: #383838;
    border-bottom: 1px solid #444;
  }
  .ipo_table_data_row > div:first-child::before {
    content: ""; /* Hide label on company name */
  }
}

#annualReport_wrapper {
  justify-content: space-around;
}

#annual_card {
  flex: none;
  width: 300px;
}

/* Container for alignment */
.back_button_container {
  margin: 0 auto 20px auto;
}

.back_nav_button {
  display: inline-flex;
  align-items: center;
  padding: 10px 15px;
  background-color: #383838; /* Darker button background */
  color: #e0e0e0;
  border: 2px solid #383838;
  border-radius: 8px;
  cursor: pointer;
  font-size: 1rem;
  font-weight: 600;
  transition: all 0.2s ease;
}

.back_nav_button:hover {
  background-color: #f15a22; /* Orange on hover */
  border-color: #f15a22;
  color: white;
  box-shadow: 0 2px 8px rgba(229, 94, 0, 0.4);
}

.back_nav_button:focus {
  outline: none;
  box-shadow: 0 0 0 3px rgba(229, 94, 0, 0.5);
}

/* Styling for the arrow/icon */
.back_nav_button::before {
  content: "\2190"; /* Left arrow Unicode */
  margin-right: 8px;
  font-size: 1.2rem;
  margin-bottom: 8px;
}

.ipo_report_page_container {
  background-color: #1c1c1c; /* Very dark background */
  padding: 30px 20px;
  color: #e0e0e0; /* Default light text */
  min-height: 100vh;
}

.report_content_area {
  max-width: 82%;
  margin: 0 auto;
}

/* ---------------------------------- */
/* HEADER SECTION */
/* ---------------------------------- */
.header_main_title {
  font-size: 2.5rem;
  font-weight: 800;
  color: white;
  margin-bottom: 10px;
  line-height: 1.1;
}

.header_tldr_summary {
  font-size: 0.95rem;
  color: #a0a0a0; /* Muted text */
  margin-bottom: 30px;
  max-width: 800px;
}

.tldr_highlight {
  font-weight: 600;
  color: #e0e0e0; /* Slightly brighter for emphasis */
}

/* ---------------------------------- */
/* LIVE IPOS TABLE SECTION */
/* ---------------------------------- */
.live_ipo_card_section {
  background-color: #242424; /* Dark card background */
  border-radius: 12px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.5);
  padding: 20px;
  max-width: 80%;
  margin: 0 auto 0px;
}

.section_heading_title {
  font-size: 1.5rem;
  font-weight: 700;
  color: white;
  margin-bottom: 20px;
  padding-bottom: 10px;
  border-bottom: 1px solid #333333;
}

/* ---------------------------------- */
/* TABLE STYLES (GRID LAYOUT) */
/* ---------------------------------- */
.ipo_data_grid {
  display: grid;
  /* Define 4 columns: Company, Window, Price Band, Actions */
  grid-template-columns: 2fr 1.5fr 1.5fr 2fr;
  gap: 0;
}

/* Header Styling */
.ipo_grid_header {
  font-weight: 600;
  font-size: 0.9rem;
  color: #a0a0a0;
  padding: 15px 10px;
  border-bottom: 1px solid #383838;
}

/* Data Row Styling */
.ipo_grid_row {
  display: contents; /* Allows children to participate in the main grid */
}

/* Data Cell Styling */
.ipo_grid_cell {
  padding: 20px 10px;
  border-bottom: 1px solid #333333;
  color: #e0e0e0;
  display: flex;
  align-items: center;
  font-size: 0.95rem;
}

/* Remove border from the last row */
.ipo_grid_row:last-of-type .ipo_grid_cell {
  border-bottom: none;
}

/* First cell in the row (Company name) */
.ipo_grid_row .ipo_grid_cell:first-child {
  font-weight: 600;
}

/* ---------------------------------- */
/* ACTION BUTTONS */
/* ---------------------------------- */
.action_buttons_group {
  display: flex;
  gap: 15px;
  align-items: center;
}

.action_button_base {
  padding: 10px 18px;
  border-radius: 6px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  white-space: nowrap;
  text-align: center;
  min-width: 120px;
}

/* Apply for IPO Button (Orange Primary) */
.button_apply_primary {
  background-color: #f15a22; /* Orange */
  color: white;
  border: none;
  box-shadow: 0 4px 8px rgba(229, 94, 0, 0.4);
}

.button_apply_primary:hover {
  background-color: #ff751a; /* Lighter orange */
}

/* View Report Button (Outline Secondary) */
.button_view_secondary {
  background-color: transparent;
  color: #f15a22; /* Orange text */
  border: 1px solid #f15a22;
}

.button_view_secondary:hover {
  background-color: #383838; /* Dark hover */
  color: white;
  border-color: #ff751a;
}

/* ---------------------------------- */
/* RESPONSIVENESS (Mobile/Tablet) */
/* ---------------------------------- */
@media (max-width: 768px) {
  .header_main_title {
    font-size: 2rem;
  }

  .ipo_data_grid {
    /* On smaller screens, simplify the layout */
    grid-template-columns: 1fr; /* Stack columns vertically */
  }

  .ipo_grid_header {
    display: none; /* Hide header row on mobile */
  }

  .ipo_grid_row {
    display: block; /* Treat row as a block container for stacking */
    margin-bottom: 20px;
    border: 1px solid #333333;
    border-radius: 8px;
    overflow: hidden;
  }

  .ipo_grid_cell {
    display: flex;
    justify-content: space-between;
    padding: 12px 15px;
    border-bottom: 1px solid #383838;
  }

  .ipo_grid_cell:last-child {
    border-bottom: none;
  }

  /* Add labels to cells for context on mobile */
  .ipo_grid_cell::before {
    content: attr(data-label);
    font-weight: 500;
    color: #a0a0a0;
    margin-right: 15px;
  }

  /* Special styling for the Company Name (first cell) */
  .ipo_grid_cell[data-label="Company"] {
    font-size: 1.1rem;
    font-weight: 700;
    background-color: #2e2e2e;
    justify-content: flex-start;
  }
  .ipo_grid_cell[data-label="Company"]::before {
    content: "";
    display: none;
  }

  /* Actions button group takes full width, stacked */
  .action_buttons_group {
    flex-direction: column;
    width: 100%;
    gap: 10px;
  }
  .action_button_base {
    width: 100%;
    min-width: unset;
    padding: 12px 0;
  }
}

.report_card_section {
  background-color: #242424; /* Dark card background */
  border-radius: 12px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.5);
  padding: 20px;
  margin-bottom: 30px; /* Space between sections */
}

.upcoming_ipo_data_grid {
  display: grid;
  grid-template-columns: 2fr 1.5fr 1.5fr 2fr; /* Company, Sector, Expected, Actions */
  gap: 0;
}

/* Header Styling */
.ipo_grid_header,
.upcoming_grid_header {
  font-weight: 600;
  font-size: 0.9rem;
  color: #a0a0a0;
  padding: 15px 10px;
  border-bottom: 1px solid #383838;
}

/* Data Row Styling */
.ipo_grid_row,
.upcoming_grid_row {
  display: contents; /* Allows children to participate in the main grid */
}

/* Data Cell Styling */
.ipo_grid_cell,
.upcoming_grid_cell {
  padding: 20px 10px;
  border-bottom: 1px solid #333333;
  color: #e0e0e0;
  display: flex;
  align-items: center;
  font-size: 0.95rem;
}

/* Remove border from the last row of each grid */
.live_ipo_data_grid .ipo_grid_row:last-of-type .ipo_grid_cell {
  border-bottom: none;
}
.upcoming_ipo_data_grid .upcoming_grid_row:last-of-type .upcoming_grid_cell {
  border-bottom: none;
}

/* First cell in the row (Company name) */
.ipo_grid_row .ipo_grid_cell:first-child,
.upcoming_grid_row .upcoming_grid_cell:first-child {
  font-weight: 600;
}

/* ---------------------------------- */
/* ACTION BUTTONS (Live IPO) */
/* ---------------------------------- */
.action_buttons_group {
  display: flex;
  gap: 15px;
  align-items: center;
}

.action_button_base {
  padding: 10px 18px;
  border-radius: 6px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  white-space: nowrap;
  text-align: center;
  min-width: 120px;
}

/* Live IPO - Apply Button (Orange Primary) */
.button_apply_primary {
  background-color: #f15a22; /* Orange */
  color: white;
  border: none;
  box-shadow: 0 4px 8px rgba(229, 94, 0, 0.4);
}

.button_apply_primary:hover {
  background-color: #ff751a; /* Lighter orange */
}

/* Live IPO - View Report Button (Outline Secondary) */
.button_view_secondary {
  background-color: transparent;
  color: #f15a22; /* Orange text */
  border: 1px solid #f15a22;
}

.button_view_secondary:hover {
  background-color: #383838; /* Dark hover */
  color: white;
  border-color: #ff751a;
}

/* ---------------------------------- */
/* ACTION BUTTONS (Upcoming IPO - Unique Classes) */
/* ---------------------------------- */
.upcoming_action_group {
  display: flex;
  gap: 15px;
  align-items: center;
}

.upcoming_button_base {
  padding: 10px 18px;
  border-radius: 6px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  white-space: nowrap;
  text-align: center;
  min-width: 120px;
}

/* Upcoming IPO - Set Reminder Button (Orange Primary) */
.button_reminder_upcoming {
  background-color: #f15a22; /* Orange */
  color: white;
  border: none;
  box-shadow: 0 4px 8px rgba(229, 94, 0, 0.4);
}

.button_reminder_upcoming:hover {
  background-color: #ff751a;
}

/* Upcoming IPO - View Report Button (Outline Secondary) */
.button_view_upcoming {
  background-color: transparent;
  color: #e0e0e0; /* Light text */
  border: 1px solid #a0a0a0; /* Muted border */
}

.button_view_upcoming:hover {
  background-color: #383838;
  border-color: #e0e0e0;
}

/* ---------------------------------- */
/* CLOSED IPO TABLE STYLES (Unique Classes) */
/* ---------------------------------- */

/* Grid container for Closed IPOs */
.closed_ipo_data_layout {
  /* Unique Grid */
  display: grid;
  grid-template-columns: 2fr 1.5fr 1.5fr 2fr; /* Company, Listed On, List Price, Actions */
  gap: 0;
}

/* Header Styling */
.closed_ipo_header_item {
  /* Unique Header */
  font-weight: 600;
  font-size: 0.9rem;
  color: #a0a0a0;
  padding: 15px 10px;
  border-bottom: 1px solid #383838;
}

/* Data Row Styling */
.closed_ipo_data_row {
  /* Unique Row */
  display: contents;
}

/* Data Cell Styling */
.closed_ipo_data_cell {
  /* Unique Cell */
  padding: 20px 10px;
  border-bottom: 1px solid #333333;
  color: #e0e0e0;
  display: flex;
  align-items: center;
  font-size: 0.95rem;
}

/* Remove border from the last row of Closed IPO grid */
.closed_ipo_data_layout
  .closed_ipo_data_row:last-of-type
  .closed_ipo_data_cell {
  border-bottom: none;
}

/* First cell in the row (Company name) */
.closed_ipo_data_row .closed_ipo_data_cell:first-child {
  font-weight: 600;
}

/* ---------------------------------- */
/* ACTION BUTTONS (Closed IPO - Unique Classes) */
/* ---------------------------------- */
.closed_ipo_action_group {
  display: flex;
  gap: 15px;
  align-items: center;
}

.closed_ipo_button_base {
  padding: 10px 18px;
  border-radius: 6px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  white-space: nowrap;
  text-align: center;
  min-width: 120px;
}

/* Closed IPO - View Report Button (Muted Outline) */
.button_closed_view {
  background-color: transparent;
  color: #f15a22; /* Orange text */
  border: 1px solid #f15a22;
}

.button_closed_view:hover {
  background-color: #383838;
  color: white;
  border-color: #ff751a;
}

/* ---------------------------------- */
/* RESPONSIVENESS (Mobile/Tablet) */
/* ---------------------------------- */
@media (max-width: 768px) {
  .header_main_title {
    font-size: 2rem;
  }

  /* Add closed IPO grid layout */
  .live_ipo_data_grid,
  .upcoming_ipo_data_grid,
  .closed_ipo_data_layout {
    grid-template-columns: 1fr;
  }

  /* Add closed IPO header */
  .ipo_grid_header,
  .upcoming_grid_header,
  .closed_ipo_header_item {
    display: none;
  }

  /* Add closed IPO row */
  .ipo_grid_row,
  .upcoming_grid_row,
  .closed_ipo_data_row {
    display: block;
    margin-bottom: 20px;
    border: 1px solid #333333;
    border-radius: 8px;
    overflow: hidden;
  }

  /* Add closed IPO cell */
  .ipo_grid_cell,
  .upcoming_grid_cell,
  .closed_ipo_data_cell {
    display: flex;
    justify-content: space-between;
    padding: 12px 15px;
    border-bottom: 1px solid #383838;
  }

  /* Remove last border for closed IPO cell */
  .ipo_grid_cell:last-child,
  .upcoming_grid_cell:last-child,
  .closed_ipo_data_cell:last-child {
    border-bottom: none;
  }

  /* Add labels to cells for context on mobile */
  .ipo_grid_cell::before,
  .upcoming_grid_cell::before,
  .closed_ipo_data_cell::before {
    content: attr(data-label);
    font-weight: 500;
    color: #a0a0a0;
    margin-right: 15px;
  }

  /* Special styling for the Company Name (first cell) */
  .ipo_grid_cell[data-label="Company"],
  .upcoming_grid_cell[data-label="Company"],
  .closed_ipo_data_cell[data-label="Company"] {
    font-size: 1.1rem;
    font-weight: 700;
    background-color: #2e2e2e;
    justify-content: flex-start;
  }
  .ipo_grid_cell[data-label="Company"]::before,
  .upcoming_grid_cell[data-label="Company"]::before,
  .closed_ipo_data_cell[data-label="Company"]::before {
    content: "";
    display: none;
  }

  /* Actions button group takes full width, stacked */
  .action_buttons_group,
  .upcoming_action_group,
  .closed_ipo_action_group {
    flex-direction: column;
    width: 100%;
    gap: 10px;
  }
  .action_button_base,
  .upcoming_button_base,
  .closed_ipo_button_base {
    width: 100%;
    min-width: unset;
    padding: 12px 0;
  }
}

#pas-right-image img {
  width: 550px;
  height: 440px;
  object-fit: cover;
}

/* alpha invest popup */

.alphaInvest_popup-overlay {
  position: fixed;
  inset: 0;
  display: none; /* shown via JS */
  justify-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.75);
  z-index: 12000;
  padding: 20px;
}

.alphaInvest_popup-overlay[aria-hidden="false"] {
  display: flex;
}

.alphaInvest_popup-box {
  width: 100%;
  max-width: 520px;
  max-height: 90vh;
  overflow-y: auto;
  background: #0b0b0b; /* deep black */
  color: #fff;
  border-radius: 12px;
  padding: 22px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.7);
  position: relative;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}

.alphaInvest_popup-close {
  position: absolute;
  top: 10px;
  right: 12px;
  background: transparent;
  border: none;
  color: #fff;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  padding: 6px;
}

.alphaInvest_popup-title {
  margin: 4px 0 18px;
  font-size: 20px;
  font-weight: 600;
  text-align: left;
  color: #ffffff;
}

.alphaInvest_popup-form {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.alphaInvest_row {
  width: 100%;
}

.alphaInvest_label {
  display: block;
  font-size: 13px;
  margin-bottom: 6px;
  color: #e6e6e6;
  font-weight: 600;
}

.alpha_input,
.alpha_select {
  width: 100%;
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.03);
  color: #fff;
  font-size: 14px;
  outline: none;
}

.alpha_select option {
  background: #000; /* black background */
  color: #fff;
}

.alpha_select optgroup,
.alpha_select {
  background-color: #000;
  color: #fff;
}

.alpha_input::placeholder {
  color: rgba(255, 255, 255, 0.5);
}
.alpha_select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}

.alphaInvest_grid2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.alphaInvest_options {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.alphaInvest_option {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: #fff;
}
.alphaInvest_option input {
  transform: scale(1.05);
}

.alphaInvest_smallChecks {
  display: flex;
  gap: 12px;
  flex-direction: column;
}
.alphaInvest_check {
  font-size: 13px;
  color: #ddd;
  display: flex;
  align-items: center;
  gap: 8px;
}

.alphaInvest_actions {
  display: flex;
  gap: 12px;
  justify-content: center;
  align-items: center;
  margin-top: 6px;
}

.alphaInvest_submit {
  min-width: 120px;
  margin-right: 0;
}
/* The .alphaInvest_cancel style is commented out in the original, so keeping it that way */
/* .alphaInvest_cancel { } */

/* responsive adjustments */
@media (max-width: 480px) {
  .alphaInvest_popup-box {
    padding: 18px;
    max-width: 100%;
  }
  .alphaInvest_grid2 {
    grid-template-columns: 1fr;
  }
  .alphaInvest_actions {
    justify-content: stretch;
    flex-direction: column-reverse;
  }
  .alphaInvest_submit {
    width: 100%;
  }
  .alphaInvest_cancel {
    width: 100%;
  }
  .alphaInvest_popup-close {
    top: 8px;
    right: 10px;
  }
}

/* Scrollbar styling for the popup box */
.alphaInvest_popup-box::-webkit-scrollbar {
  width: 8px;
}

.alphaInvest_popup-box::-webkit-scrollbar-track {
  background: #000; /* black background */
}

.alphaInvest_popup-box::-webkit-scrollbar-thumb {
  background: #6f6f6f; /* grey scroller */
  border-radius: 10px;
}

/* expert call css */

.expertCall_popup-overlay {
  position: fixed;
  inset: 0;
  display: none; /* shown via JS */
  justify-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.75);
  z-index: 12000;
  padding: 20px;
}

.expertCall_popup-overlay[aria-hidden="false"] {
  display: flex;
}

.expertCall_popup-box {
  width: 100%;
  max-width: 520px;
  max-height: 90vh;
  overflow-y: auto;
  background: #0b0b0b; /* deep black */
  color: #fff;
  border-radius: 12px;
  padding: 22px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.7);
  position: relative;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}

.expertCall_popup-close {
  position: absolute;
  top: 10px;
  right: 12px;
  background: transparent;
  border: none;
  color: #fff;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  padding: 6px;
}

.expertCall_popup-title {
  margin: 4px 0 18px;
  font-size: 20px;
  font-weight: 600;
  text-align: left;
  color: #ffffff;
}

.expertCall_popup-form {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.expertCall_row {
  width: 100%;
}

.expertCall_label {
  display: block;
  font-size: 13px;
  margin-bottom: 6px;
  color: #e6e6e6;
  font-weight: 600;
}

.expert_input,
.expert_select {
  width: 100%;
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.03);
  color: #fff;
  font-size: 14px;
  outline: none;
}

.expert_select option {
  background: #000; /* black background */
  color: #fff;
}

.expert_select optgroup,
.expert_select {
  background-color: #000;
  color: #fff;
}

.expert_input::placeholder {
  color: rgba(255, 255, 255, 0.5);
}
.expert_select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}

.expertCall_grid2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.expertCall_options {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.expertCall_option {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: #fff;
}
.expertCall_option input {
  transform: scale(1.05);
}

.expertCall_smallChecks {
  display: flex;
  gap: 12px;
  flex-direction: column;
}
.expertCall_check {
  font-size: 13px;
  color: #ddd;
  display: flex;
  align-items: center;
  gap: 8px;
}

.expertCall_actions {
  display: flex;
  gap: 12px;
  justify-content: center;
  align-items: center;
  margin-top: 6px;
}

.expertCall_submit {
  min-width: 120px;
  margin-right: 0;
}
/* The .expertCall_cancel style is commented out in the original, so keeping it that way */
/* .expertCall_cancel { } */

/* responsive adjustments */
@media (max-width: 480px) {
  .expertCall_popup-box {
    padding: 18px;
    max-width: 100%;
  }
  .expertCall_grid2 {
    grid-template-columns: 1fr;
  }
  .expertCall_actions {
    justify-content: stretch;
    flex-direction: column-reverse;
  }
  .expertCall_submit {
    width: 100%;
  }
  .expertCall_cancel {
    width: 100%;
  }
  .expertCall_popup-close {
    top: 8px;
    right: 10px;
  }
}

/* Scrollbar styling for the popup box */
.expertCall_popup-box::-webkit-scrollbar {
  width: 8px;
}

.expertCall_popup-box::-webkit-scrollbar-track {
  background: #000; /* black background */
}

.expertCall_popup-box::-webkit-scrollbar-thumb {
  background: #6f6f6f; /* grey scroller */
  border-radius: 10px;
}

/* focused invest popup */

.focusedInvest_popup-overlay {
  position: fixed;
  inset: 0;
  display: none; /* shown via JS */
  justify-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.75);
  z-index: 12000;
  padding: 20px;
}

.focusedInvest_popup-overlay[aria-hidden="false"] {
  display: flex;
}

.focusedInvest_popup-box {
  width: 100%;
  max-width: 520px;
  max-height: 90vh;
  overflow-y: auto;
  background: #0b0b0b; /* deep black */
  color: #fff;
  border-radius: 12px;
  padding: 22px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.7);
  position: relative;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}

.focusedInvest_popup-close {
  position: absolute;
  top: 10px;
  right: 12px;
  background: transparent;
  border: none;
  color: #fff;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  padding: 6px;
}

.focusedInvest_popup-title {
  margin: 4px 0 18px;
  font-size: 20px;
  font-weight: 600;
  text-align: left;
  color: #ffffff;
}

.focusedInvest_popup-form {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.focusedInvest_row {
  width: 100%;
}

.focusedInvest_label {
  display: block;
  font-size: 13px;
  margin-bottom: 6px;
  color: #e6e6e6;
  font-weight: 600;
}

.focused_input,
.focused_select {
  width: 100%;
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.03);
  color: #fff;
  font-size: 14px;
  outline: none;
}

.focused_select option {
  background: #000; /* black background */
  color: #fff;
}

.focused_select optgroup,
.focused_select {
  background-color: #000;
  color: #fff;
}

.focused_input::placeholder {
  color: rgba(255, 255, 255, 0.5);
}
.focused_select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}

.focusedInvest_grid2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.focusedInvest_options {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.focusedInvest_option {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: #fff;
}
.focusedInvest_option input {
  transform: scale(1.05);
}

.focusedInvest_smallChecks {
  display: flex;
  gap: 12px;
  flex-direction: column;
}
.focusedInvest_check {
  font-size: 13px;
  color: #ddd;
  display: flex;
  align-items: center;
  gap: 8px;
}

.focusedInvest_actions {
  display: flex;
  gap: 12px;
  justify-content: center;
  align-items: center;
  margin-top: 6px;
}

.focusedInvest_submit {
  min-width: 120px;
  margin-right: 0;
}
/* The .focusedInvest_cancel style is commented out in the original, so keeping it that way */
/* .focusedInvest_cancel { } */

/* responsive adjustments */
@media (max-width: 480px) {
  .focusedInvest_popup-box {
    padding: 18px;
    max-width: 100%;
  }
  .focusedInvest_grid2 {
    grid-template-columns: 1fr;
  }
  .focusedInvest_actions {
    justify-content: stretch;
    flex-direction: column-reverse;
  }
  .focusedInvest_submit {
    width: 100%;
  }
  .focusedInvest_cancel {
    width: 100%;
  }
  .focusedInvest_popup-close {
    top: 8px;
    right: 10px;
  }
}

/* Scrollbar styling for the popup box */
.focusedInvest_popup-box::-webkit-scrollbar {
  width: 8px;
}

.focusedInvest_popup-box::-webkit-scrollbar-track {
  background: #000; /* black background */
}

.focusedInvest_popup-box::-webkit-scrollbar-thumb {
  background: #6f6f6f; /* grey scroller */
  border-radius: 10px;
}

.card-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center; /* Center the entire set of cards */
  gap: 20px; /* Space between cards */
  padding: 20px;
}

/*
        * Styles for Individual Card
        */
.financial-card {
  width: 300px; /* Fixed width for the card */
  min-height: 200px; /* Minimum height for consistency */
  background-color: #0c0c0c; /* Dark background for the card */
  border-radius: 12px;
  padding: 25px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.4);
  display: flex;
  flex-direction: column;
  transition: transform 0.2s ease-in-out;
  border: 1px solid #333333; /* Subtle border */
}

.financial-card:hover {
  transform: translateY(-5px); /* Slight lift on hover */
}

/* Icon Wrapper Styles */
.card-icon-wrapper {
  margin-bottom: 15px;
}

/* Generic Icon Styling - to mimic the design with a placeholder */
.card-icon {
  width: 40px;
  height: 40px;
  border-radius: 8px;
  background-color: #ff8c00; /* Orange color for the icon background */
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  color: #1f1f1f; /* Dark color for the symbol inside the icon */
  font-weight: bold;
}

/* Specific Icon Backgrounds (to mimic the card image) */
.cap-mkt-icon {
  background: linear-gradient(
    135deg,
    #ff8c00 0%,
    #ff6f00 100%
  ); /* Gradient border effect */
}
.pms-icon {
  background: linear-gradient(135deg, #ff8c00 0%, #ff6f00 100%);
}
.wm-icon {
  background: linear-gradient(135deg, #ff8c00 0%, #ff6f00 100%);
}
.ra-icon {
  background: linear-gradient(135deg, #ff8c00 0%, #ff6f00 100%);
}
.ib-icon {
  background: linear-gradient(135deg, #ff8c00 0%, #ff6f00 100%);
}

/* Card Heading Styles */
.card-heading {
  font-size: 20px;
  font-weight: 600;
  color: #ffffff; /* White color for heading */
  margin-top: 0;
  margin-bottom: 10px;
  line-height: 1.2;
}

/* Card Paragraph Styles */
.card-paragraph {
  font-size: 14px;
  color: #eee; /* Light gray color for paragraph */
  line-height: 1.5;
  flex-grow: 1; /* Allows the paragraph to take up available space */
  margin-bottom: 0;
}

/*
        * Layout Specific Styles (For 3 in the first row and 2 centered below)
        */

/* This container is for the first row of 3 cards */
.first-row-container {
  display: flex;
  justify-content: center;
  gap: 20px;
  width: 100%; /* Take full width of the main container */
  margin-bottom: 20px; /* Space between the first and second row */
}

/* This container is for the second row of 2 cards */
.second-row-container {
  display: flex;
  justify-content: center;
  gap: 20px;
  width: 100%;
}

.whatwedo {
  font-size: 56px;
  padding: 50px 0;
}

/* Media Query for smaller screens (optional, but good practice) */
@media (max-width: 1000px) {
  .first-row-container,
  .second-row-container {
    flex-direction: column;
    align-items: center;
    gap: 15px;
  }

  .financial-card {
    width: 85%; /* Make cards wider on small screens */
    max-width: 350px;
  }
}

.rp-max-width-wrapper {
  max-width: 56rem; /* max-w-4xl */
  margin-left: auto;
  margin-right: auto;
  display: flex;
  flex-direction: column;
  gap: 1.5rem; /* space-y-6 */
}

/* Headings and Text */
.rp-heading-lg {
  font-size: 1.5rem; /* text-2xl */
  font-weight: 600; /* font-semibold */
  margin-bottom: 0.5rem; /* mb-2 */
  color: white;
}
.rp-heading-md {
  font-size: 1.125rem; /* text-lg */
  font-weight: 600;
  color: white;
  margin-bottom: 0.75rem; /* mb-3 */
}
.rp-heading-sm {
  font-size: 1.125rem; /* text-lg */
  font-weight: 600;
  color: white;
}
.rp-sub-text {
  font-size: 0.875rem; /* text-sm */
  color: #d1d5db; /* gray-300 */
  margin-bottom: 1rem; /* mb-4 */
}
.rp-sub-text-card {
  font-size: 0.75rem; /* text-xs */
  color: #9ca3af; /* gray-400 */
}

/* User Info Section */
.rp-user-info-section {
  background-color: rgb(51 65 85 / 0.6); /* slate-900/60 */
  padding: 1rem; /* p-4 */
  border-radius: 0.75rem; /* rounded-xl */
}

.rp-input-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem; /* gap-4 */
}
@media (min-width: 768px) {
  .rp-input-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.rp-input-field {
  padding: 0.75rem; /* p-3 */
  border-radius: 0.375rem; /* rounded-md */
  background-color: rgb(0 0 0 / 0.3); /* black/30 */
  border: 1px solid rgb(255 255 255 / 0.1); /* border-white/10 */
  color: white;
  outline: none;
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease;
}
.rp-input-field:focus {
  box-shadow: 0 0 0 2px #fff; /* focus:ring-2 */
  border-color: transparent;
}

/* Main Grid Layout */
.rp-main-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem; /* gap-6 */
}
@media (min-width: 768px) {
  .rp-main-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .rp-questionnaire-panel {
    grid-column: span 2 / span 2;
  }
}

/* Questionnaire Panel */
.rp-questionnaire-panel {
  background-color: rgb(51 65 85 / 0.6);
  border-radius: 1rem; /* rounded-2xl */
  padding: 1.5rem; /* p-6 */
  box-shadow:
    0 10px 15px -3px rgb(0 0 0 / 0.1),
    0 4px 6px -4px rgb(0 0 0 / 0.1); /* shadow-xl */
}

.rp-questions-list {
  display: flex;
  flex-direction: column;
  gap: 1.5rem; /* space-y-6 */
}

.rp-question-item {
  padding: 1rem; /* p-4 */
  background-color: rgb(0 0 0 / 0.2); /* black/20 */
  border-radius: 0.5rem; /* rounded-lg */
}

.rp-question-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.75rem; /* mb-3 */
}

.rp-question-id {
  font-size: 0.875rem;
  color: #d1d5db; /* gray-300 */
}

.rp-question-text {
  font-size: 1rem;
  font-weight: 500;
  color: white;
}

.rp-options-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.5rem; /* gap-2 */
}
@media (min-width: 640px) {
  .rp-options-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.rp-option-button {
  text-align: left;
  padding: 0.75rem;
  border-radius: 0.375rem;
  border: 1px solid rgb(255 255 255 / 0.1);
  transition:
    background-color 0.15s ease,
    box-shadow 0.15s ease;
  cursor: pointer;
  background: transparent;
  color: white;
}

.rp-option-button:hover {
  background-color: rgb(255 255 255 / 0.05); /* hover:bg-white/5 */
}

.rp-option-button.rp-selected {
  background-color: rgb(255 255 255 / 0.1); /* bg-white/10 */
  box-shadow: 0 0 0 2px white; /* ring-2 */
  border-color: transparent;
}

.rp-option-label {
  font-size: 0.875rem; /* text-sm */
  color: white;
}

/* Score Summary */
.rp-score-summary {
  margin-top: 1.5rem; /* mt-6 */
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.rp-score-text {
  font-size: 0.875rem;
  color: #d1d5db;
}

.rp-score-value {
  font-weight: 500;
  color: white;
}

/* Profiler Card */
.rp-profiler-card {
  background-color: rgb(51 65 85 / 0.6);
  border-radius: 1rem;
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.5rem; /* gap-6 */
  box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1);
}

.rp-card-header {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.rp-risk-tag {
  font-size: 0.75rem; /* text-xs */
  padding: 0.25rem 0.5rem; /* px-2 py-1 */
  border-radius: 0.375rem; /* rounded-md */
  font-weight: 600; /* font-semibold */
}

/* Live Icon */
.rp-icon-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem; /* gap-3 */
}

.rp-icon-container {
  width: 7rem; /* w-28 */
  height: 7rem; /* h-28 */
  border-radius: 9999px; /* rounded-full */
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25); /* shadow-2xl */
}

.rp-result-text {
  text-align: center;
}

.rp-level-key {
  font-size: 0.875rem;
  color: #d1d5db;
}

.rp-level-desc {
  font-size: 0.75rem;
  color: #9ca3af;
}

/* Gauge */
.rp-gauge-wrapper {
  width: 100%;
  padding: 0 0.5rem; /* px-2 */
}

.rp-gauge-svg {
  width: 100%;
  /* Add transition for the needle rotation */
  /* transition: transform 0.5s ease-in-out; */
}

/* For the dynamic arc */
#gaugeArc {
  stroke-dasharray: 502;
  transition: stroke-dashoffset 0.5s ease-in-out;
}

/* Gauge labels */
.rp-gauge-labels {
  width: 100%;
  display: flex;
  justify-content: space-between;
  font-size: 0.75rem;
  color: #9ca3af;
  transform: translateY(-0.5rem);
}

/* Reset Button */
.rp-reset-button {
  width: 100%;
  padding: 0.5rem 0; /* py-2 */
  border-radius: 0.375rem;
  background-color: rgb(255 255 255 / 0.06); /* bg-white/6 */
  color: white;
  font-size: 0.875rem;
  border: none;
  cursor: pointer;
  transition: background-color 0.15s ease;
}

.rp-reset-button:hover {
  background-color: rgb(255 255 255 / 0.1); /* hover:bg-white/10 */
}

/* Footer */
.rp-footer-note {
  max-width: 56rem;
  margin-top: 1.5rem;
  font-size: 0.875rem;
  color: #9ca3af;
  text-align: left;
}

#gaugeNeedle {
  /* The transform property for rotation will be set in JS */
  transition: transform 0.5s ease-in-out;
}

/* risk profiler with questions */

.rp-wrapper {
  max-width: 1300px;
  margin: auto;
  padding: 40px 20px;
}

.rp-grid {
  display: grid;
  grid-template-columns: 2.2fr 1fr;
  gap: 32px;
  align-items: start;
}

@media (max-width: 900px) {
  .rp-grid {
    grid-template-columns: 1fr;
  }

  .rp-sticky {
    position: relative;
    top: 0;
  }
}

/* ===== CARDS ===== */
.rp-card {
  background: linear-gradient(
    180deg,
    rgb(20 20 20 / 90%),
    rgb(20 20 20 / 100%)
  );
  border-radius: 18px;
  padding: 22px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.6);
}

/* ===== QUESTIONS SIDE ===== */
.rp-title {
  font-size: 22px;
  font-weight: 600;
  margin-bottom: 18px;
}

.rp-question {
  background: rgba(255, 255, 255, 0.03);
  border-radius: 14px;
  padding: 18px;
  margin-bottom: 18px;
}

.rp-question small {
  color: #94a3b8;
}

.rp-question h4 {
  margin-top: 6px;
  font-weight: 500;
  font-size: 15px;
}

.rp-options {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 14px;
}

.rp-btn {
  background: transparent;
  border: 1px solid rgba(255, 255, 255, 0.12);
  padding: 12px;
  border-radius: 10px;
  color: #e5e7eb;
  text-align: left;
  cursor: pointer;
  transition: all 0.25s ease;
  font-size: 14px;
}

.rp-btn:hover {
  background: rgba(255, 255, 255, 0.06);
}

.rp-btn.active {
  border-color: #ccc;
  background: #f886381f;
}

/* ===== RIGHT SIDE STICKY ===== */
.rp-sticky {
  position: sticky;
  top: 24px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

/* ===== RISK TYPE BOX ===== */
.rp-level-box {
  text-align: center;
}

.rp-icon {
  width: 84px;
  height: 84px;
  border-radius: 50%;
  font-size: 40px;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 14px;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.07), transparent);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.rp-icon svg {
  width: 44px;
  height: 44px;
}

.rp-level-title {
  font-size: 18px;
  font-weight: 600;
}

.rp-level-desc {
  font-size: 13px;
  color: #94a3b8;
  margin-top: 6px;
}

.rp-tag {
  display: inline-block;
  padding: 6px 14px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  margin-top: 10px;
}

/* ===== TAG COLORS ===== */
.low {
  background: rgba(22, 163, 74, 0.2);
  color: #22c55e;
}
.medium {
  background: rgba(245, 158, 11, 0.2);
  color: #facc15;
}
.high {
  background: rgba(249, 115, 22, 0.2);
  color: #fb923c;
}
.veryhigh {
  background: rgba(239, 68, 68, 0.2);
  color: #f87171;
}

/* ===== GAUGE ===== */
.rp-gauge-box {
  text-align: center;
}

.rp-gauge-labels {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  color: #9ca3af;
  margin-top: 20px;
}

.rp-reset {
  width: 100%;
  margin-top: 12px;
  padding: 12px;
  border-radius: 10px;
  border: none;
  background: rgba(255, 255, 255, 0.08);
  color: white;
  cursor: pointer;
}

.rp-reset:hover {
  background: rgba(255, 255, 255, 0.15);
}

/* ===== FORM WRAPPER ===== */
.rp-form-wrapper {
  max-width: 1300px;
  margin: 0 auto 28px auto; /* space below before next section */
  padding: 0 20px;
}

/* ===== FORM CARD ===== */
.rp-form-card {
  background: linear-gradient(180deg, #121212, #000);
  border-radius: 20px;
  padding: 26px;
  border: 1px solid rgba(255, 255, 255, 0.07);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.6);
}

/* ===== FORM TITLE ===== */
.rp-form-title {
  font-size: 32px;
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 18px;
  text-align: center;
}

/* ===== FORM GRID ===== */
.rp-form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr auto;
  gap: 16px;
}

/* ===== INPUTS ===== */
.rp-form-input {
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: #000;
  color: #fff;
  font-size: 14px;
  outline: none;
}

.rp-form-input::placeholder {
  color: #fff;
}

.rp-form-input:focus {
  border-color: #ccc;
  box-shadow: 0 0 0 2px rgba(56, 189, 248, 0.15);
}

/* ===== SUBMIT BUTTON ===== */
.rp-form-submit {
  padding: 14px 26px;
  border-radius: 12px;
  border: none;
  background: linear-gradient(135deg, #38bdf8, #2563eb);
  color: #ffffff;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}

.rp-form-submit:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 28px rgba(37, 99, 235, 0.4);
}

/* ===== RESPONSIVE ===== */
@media (max-width: 900px) {
  .rp-form-grid {
    grid-template-columns: 1fr;
  }

  .rp-form-submit {
    width: 100%;
  }
}

#chaturEco {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr);
}

#chaturEco .feature-list-item {
  width: 100%;
}

#chaturEco img {
  max-width: 140px !important;
}

/* risk popup */

/* ===== POPUP OVERLAY ===== */
.rp-popup-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.7);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  opacity: 0;
  pointer-events: none;
  transition: 0.3s ease;
}

.rp-popup-overlay.active {
  opacity: 1;
  pointer-events: auto;
}

/* ===== POPUP BOX ===== */
.rp-popup-box {
  background: #131313;
  width: 95%;
  max-width: 1100px;
  max-height: 90vh;
  overflow-y: auto;
  border-radius: 20px;
  padding: 24px;
  position: relative;
  transform: scale(0.9);
  transition: 0.3s ease;
}

.rp-popup-overlay.active .rp-popup-box {
  transform: scale(1);
}

/* ===== CLOSE BUTTON ===== */
.rp-popup-close {
  position: absolute;
  top: 14px;
  right: 14px;
  background: #ef4444;
  border: none;
  color: white;
  font-size: 18px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  cursor: pointer;
}

/* ===== CONTENT SCROLL AREA ===== */
.rp-popup-content {
  padding-top: 20px;
}

/* ===== MOBILE FIX ===== */
@media (max-width: 768px) {
  .rp-popup-box {
    padding: 16px;
    width: 100%;
    border-radius: 16px;
  }
  .rp-wrapper {
    padding: 20px 0;
  }
}

/* ===== BLACK SCROLLBAR FOR POPUP ===== */

/* Chrome, Edge, Safari */
.rp-popup-box::-webkit-scrollbar {
  width: 8px;
}

.rp-popup-box::-webkit-scrollbar-track {
  background: #020617; /* near-black */
  border-radius: 10px;
}

.rp-popup-box::-webkit-scrollbar-thumb {
  background: #000; /* pure black */
  border-radius: 10px;
}

.rp-popup-box::-webkit-scrollbar-thumb:hover {
  background: #222; /* slight hover effect */
}

/* ===== FIREFOX SUPPORT ===== */
.rp-popup-box {
  scrollbar-width: thin;
  scrollbar-color: #2c2c2c #020617;
}

/* Simple sleek "Why choose Us" — black background, white text, orange accent */
.rp-why-simple {
  background: #000; /* pure black background as requested */
  color: #fff;
  padding: 48px 20px;
  
}

.rp-why-simple__inner {
  max-width: 1100px;
  margin: 0 auto;
}

/* Title — subtle and compact */
.rp-why-simple__title {
  font-weight: 500 !important;
  font-size: 56px !important;
  line-height: 70px !important;
  margin-bottom: 16px !important;
  text-align: center;
}

/* List */
.rp-why-simple__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 14px;
}

/* Single item */
.rp-why-simple__item {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  font-size: 18px;
  line-height: 1.6;
  color: #e6e7ea; /* soft white for better legibility */
  padding: 6px 0;
}

/* Orange dot */
.rp-why-simple__dot {
  flex: 0 0 10px;
  height: 10px;
  border-radius: 50%;
  background: linear-gradient(180deg, #ff8a3d 0%, #f15a22 100%);
  margin-top: 6px; /* vertically align with first line of text */
  box-shadow: 0 0 10px rgba(229, 94, 0, 0.12);
}

/* Emphasize keywords (optional) */
.rp-why-simple__item strong {
  color: #fff;
  font-weight: 700;
}

/* Responsive: 2 columns on medium+ screens if space allows */
@media (min-width: 780px) {
  .rp-why-simple__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px 32px;
  }
}

/* Mobile tighten */
@media (max-width: 420px) {
  .rp-why-simple {
    padding: 28px 14px;
  }

  .rp-why-simple__dot {
    margin-top: 7px;
    flex-basis: 9px;
    height: 9px;
  }
}

.rp-momentum-box {
  max-width: 520px;

  border: 1px solid rgba(229, 94, 0, 0.4);
  border-radius: 16px;
  padding: 18px 22px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  box-shadow: 0 10px 30px rgba(229, 94, 0, 0.08);
}

.rp-momentum-item {
  margin: 0;
  font-size: clamp(14px, 1.6vw, 16px) !important;
  line-height: 1.6;
  color: #000;
  letter-spacing: 0.2px;
  position: relative;
  padding-left: 28px;
}

/* Styled checkmark */
.rp-momentum-item::before {
  content: "✔";
  position: absolute;
  left: 0;
  top: 0;
  color: #f15a22;
  font-weight: 700;
  font-size: 16px;
}

/* Mobile spacing tweak */
@media (max-width: 480px) {
  .rp-momentum-box {
    padding: 14px 16px;
    border-radius: 12px;
  }

  .rp-momentum-item {
    padding-left: 24px;
  }
}

#equity-trade_title {
  font-size: 30px;
}

/* =============================== */
/* CAPITAL MARKET PREMIUM SECTION */
/* =============================== */

.rp-capital-wrap {
  background: #000;
  padding: 70px 20px;
  display: flex;
  justify-content: center;
}

.rp-capital-box {
  width: 100%;
  max-width: 90%;
  background: #000;
  border-left: 2px solid #f15a2282;
  border-right: 2px solid #f15a2282;
  border-top: 2px solid #f15a2282;
  border-bottom: none;
  border-radius: 32px;
  padding: 60px 60px 60px;
  position: relative;
  box-shadow:
    0 0 0 6px rgba(229, 94, 0, 0.08),
    0 20px 80px rgba(0, 0, 0, 0.8);
}

/* ---------- TITLE ---------- */

.rp-capital-title {
  font-size: clamp(28px, 4vw, 48px);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 36px;
  letter-spacing: 0.3px;
}

.rp-capital-title span {
  color: #f15a22;
  /* font-weight: 800; */
}

/* ---------- POINTS WRAP ---------- */

.rp-capital-points {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 26px 40px;
}

/* ---------- SINGLE POINT ---------- */

.rp-capital-point {
  margin: 0;
  color: #e5e7eb;
  font-size: clamp(15px, 1.7vw, 18px);
  line-height: 1.7;
  position: relative;
  padding-left: 22px;
}

/* Orange bullet */
.rp-capital-point::before {
  content: "•";
  position: absolute;
  left: 0;
  top: 0;
  color: #f15a22;
  font-size: 28px;
  line-height: 1;
}

/* ---------- MOBILE POLISH ---------- */

.whyus {
  font-size: 24px;
  display: flex;
  justify-content: center;
  margin-bottom: 20px;
}

@media (max-width: 768px) {
  .rp-capital-box {
    padding: 36px 22px 34px;
    border-radius: 22px;
  }

  .rp-capital-title {
    margin-bottom: 26px;
  }

  .rp-capital-points {
    gap: 18px;
  }
}

.dk-page {
  max-width: 1100px;
  margin: 0 auto;
  padding: 80px 0px 60px;
}

/* Top Bar */
.dk-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 28px;
}

.dk-logo-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
}

.dk-logo-icon {
  width: 40px;
  height: 40px;
  background: #f15a22;
  color: #000;
  font-weight: 800;
  border-radius: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.dk-logo-main {
  font-size: 18px;
  font-weight: 700;
}
.dk-logo-sub {
  font-size: 12px;
  color: #9ca3af;
}

.dk-pill {
  padding: 6px 14px;
  border-radius: 999px;
  background: rgba(229, 94, 0, 0.08);
  color: #f15a22;
  border: 1px solid rgba(229, 94, 0, 0.25);
  font-size: 11px;
}

.dk-career-pill {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 6px 16px;
  background: #111111; /* dark pill background */
  border: 1px solid #2a2a2a; /* subtle border */
  border-radius: 999px; /* fully rounded */
}

.dk-career-pill-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #f15a22; /* green center */
  box-shadow: 0 0 0 5px rgba(34, 197, 94, 0.22); /* green glow ring */
}

.dk-career-pill-text {
  color: #e5e5e5; /* light text */
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.impact,
.dk-hero-right-header {
  display: flex;
  align-items: center;
  gap: 10px;
}

.dk-hero-right-header {
  justify-content: space-between;
}

/* HERO */
.dk-hero {
  background: #0d0d0d;
  border: 1px solid #2a2a2a;
  border-radius: 32px;
  padding: 30px;
  display: grid;
  grid-template-columns: 3fr 2fr;
  gap: 32px;
  margin-bottom: 32px;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.6);
}

.dk-hero-title {
  font-size: 32px;
  line-height: 1.15;
}

.dk-hero-title span {
  color: #f15a22;
}

.dk-hero-sub {
  font-size: 14px;
  color: #9ca3af;
  max-width: 620px;
  margin: 14px 0 20px;
}

.dk-hero-highlight-row {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 18px;
}

.dk-highlight-badge {
  padding: 5px 10px;
  background: rgba(229, 94, 0, 0.1);
  color: #f15a22;
  border-radius: 999px;
  font-size: 11px;
  text-transform: uppercase;
  font-weight: 600;
}

.dk-highlight-text {
  color: #9ca3af;
}

.dk-btn-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.dk-btn-primary {
  background: #f15a22;
  color: #000;
  padding: 10px 20px;
  border-radius: 999px;
  text-decoration: none;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  box-shadow: 0 0 20px rgba(229, 94, 0, 0.4);
}

.dk-btn-ghost {
  padding: 9px 16px;
  border-radius: 999px;
  border: 1px solid #2a2a2a;
  background: #111111;
  color: #9ca3af;
  text-decoration: none;
  font-size: 12px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.dk-hero-meta {
  margin-top: 8px;
  font-size: 11px;
  color: #9ca3af;
}

/* HERO Right Card */
.dk-hero-right {
  background: #0a0a0a;
  border-radius: 26px;
  padding: 18px;
  border: 1px solid #2a2a2a;
  box-shadow: 0 0 35px rgba(0, 0, 0, 0.7);
  height: max-content;
}

.dk-hero-right-title {
  font-size: 14px;
  font-weight: 600;
}

.dk-hero-right-tag {
  padding: 4px 8px;
  background: #111111;
  border: 1px solid #333333;
  border-radius: 999px;
  font-size: 10px;
  letter-spacing: 0.1em;
}

.dk-stats-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  margin: 16px 0;
}

.dk-stat-card {
  background: #111111;
  border-radius: 16px;
  padding: 12px;
  border: 1px solid #222222;
}

.dk-stat-label {
  font-size: 11px;
  color: #9ca3af;
}
.dk-stat-value {
  font-size: 18px;
  font-weight: 700;
  color: #f15a22;
}

.dk-pill-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.dk-pill-mini {
  padding: 4px 8px;
  font-size: 10px;
  background: #111111;
  border: 1px solid #333333;
  border-radius: 999px;
}

.dk-hero-note {
  margin-top: 10px;
  font-size: 11px;
  color: #9ca3af;
}

/* Sections */
.dk-section {
  background: #0d0d0d;
  border-radius: 18px;
  border: 1px solid #2a2a2a;
  padding: 20px;
  margin-bottom: 32px;
}

.dk-sec-title {
  font-size: 18px;
  font-weight: 700;
  color: #fff;
}
.dk-sec-sub {
  font-size: 12px;
  color: #9ca3af;
  margin-bottom: 0px;
}

.dk-sec-grid-2 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}

.dk-checklist {
  list-style: none;
  font-size: 13px;
  color: #e5e5e5;
  padding-left: 0;
}
.dk-checklist li {
  display: flex;
  gap: 10px;
  margin-bottom: 8px;
}
.dk-check-icon {
  color: #f15a22;
}

/* Job Cards */
.dk-jobs-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}

.why-work {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}

.dk-job-card {
  background: #111111;
  border: 1px solid #2a2a2a;
  border-radius: 18px;
  padding: 14px;
}

.dk-job-pill {
  padding: 4px 8px;
  font-size: 14px;
  background: #111111;
  border: 1px solid #333333;
  border-radius: 999px;
  display: inline-block;
  margin-bottom: 4px;
}

.dk-job-title {
  font-size: 15px;
  font-weight: 600;
  margin: 6px 0;
  color: #ffffff;
}
.dk-job-meta {
  font-size: 12px;
  color: #9ca3af;
}

.dk-job-footer {
  display: flex;
  justify-content: space-between;
  margin-top: 8px;
  font-size: 11px;
  color: #e5e5e5;
}

.dk-job-link {
  color: #f15a22;
  text-decoration: none;
  font-size: 14px;
}

/* Contact */
.dk-contact-grid {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: 20px;
}

.dk-contact-card {
  padding: 14px;
  background: #0d0d0d;
  border-radius: 16px;
  border: 1px dashed #2a2a2a;
}

.dk-contact-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #9ca3af;
}

.dk-contact-line {
  font-size: 13px;
  color: #e5e5e5;
}
.dk-contact-highlight {
  color: #f15a22;
  font-weight: 600;
}

/* Responsive */
@media (max-width: 900px) {
  .dk-hero {
    grid-template-columns: 1fr;
  }
  .dk-sec-grid-2,
  .dk-jobs-grid,
  .dk-contact-grid {
    grid-template-columns: 1fr;
  }
}

/* inside career */

.dk-app-container {
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.6fr 1fr;
  gap: 30px;
  padding: 100px 0;
}
@media (max-width: 900px) {
  .dk-app-container {
    grid-template-columns: 1fr;
    padding: 0 10px;
  }
}

/* CARD */
.dk-app-card {
  background: #0d0d0d;
  border: 1px solid #2a2a2a;
  border-radius: 20px;
  padding: 28px;
  box-shadow: 0 0 30px rgba(0, 0, 0, 0.6);
}

/* PILL */
.dk-app-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 16px;
  border-radius: 999px;
  background: #111;
  border: 1px solid #2a2a2a;
  margin-bottom: 14px;
}
.dk-app-pill-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #22c55e;
  box-shadow: 0 0 0 4px rgba(34, 197, 94, 0.25);
}
.dk-app-pill-text {
  font-size: 11px;
  letter-spacing: 0.1em;
  color: #e5e5e5;
  text-transform: uppercase;
}

/* TITLES */
.dk-app-title {
  font-size: 26px;
  margin-bottom: 8px;
}
.dk-app-sub {
  font-size: 14px;
  color: #9ca3af;
  margin-bottom: 22px;
}

/* FORM */
.dk-app-form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}
.dk-app-full {
  grid-column: 1 / -1;
}

.dk-app-label {
  display: block;
  font-size: 13px;
  margin-bottom: 6px;
  color: #b7b7b7;
}

.dk-app-input,
.dk-app-select,
.dk-app-textarea {
  width: 100%;
  background: #000;
  border: 1px solid #2a2a2a;
  color: #fff;
  border-radius: 12px;
  padding: 10px 12px;
  font-size: 14px;
}
.dk-app-textarea {
  min-height: 90px;
  resize: vertical;
}

.dk-app-file {
  padding: 10px;
  border-radius: 12px;
  background: #000;
  border: 1px solid #2a2a2a;
  color: #e5e5e5;
}

/* SUBMIT AREA */
.dk-app-actions {
  grid-column: 1 / -1;
  margin-top: 10px;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
}
.dk-app-hint {
  font-size: 12px;
  color: #777;
}
.dk-app-btn {
  padding: 10px 24px;
  background: #f15a22;
  border: none;
  border-radius: 999px;
  font-weight: 600;
  font-size: 14px;
  color: #000;
  cursor: pointer;
  box-shadow: 0 0 20px rgba(229, 94, 0, 0.45);
}
.dk-app-btn:hover {
  opacity: 0.95;
}

/* RIGHT */
.dk-app-side h2 {
  font-size: 18px;
  margin-bottom: 8px;
}
.dk-app-side ul {
  margin-top: 10px;
  padding-left: 0px;
  list-style: none;
}
.dk-app-side li {
  margin-bottom: 6px;
  font-size: 13px;
  color: #c5c5c5;
}
.dk-app-email-box {
  margin-top: 14px;
  padding: 10px;
  background: #111;
  border-radius: 12px;
  border: 1px solid #2a2a2a;
  font-size: 13px;
}

/* small tweaks */
label.required::after {
  content: " *";
  color: #f15a22;
  margin-left: 4px;
  font-weight: 600;
  font-size: 12px;
}

@media (max-width: 900px) {
  .dk-page {
    max-width: 100%;
  }
  .impact {
    flex-direction: column;
    align-items: center;
  }
  .dk-career-pill {
    margin-bottom: 20px;
  }
  .dk-stats-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 900px) {
  .dk-page {
    padding: 80px 20px 60px;
  }
}

@media (max-width: 767px) {
  .dc-career-openings-grid {
    grid-template-columns: 1fr; /* Stack them vertically */
  }

  /* Target the first child to move it to the bottom */
  .dc-career-openings-grid > *:nth-child(1) {
    order: 2;
  }

  /* Target the second child to move it to the top */
  .dc-career-openings-grid > *:nth-child(2) {
    order: 1;
  }
}
.dc-picks-section {
  /* background: #0e0f12; */
  padding: 150px 0 50px;
}

.dc-picks-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

.dc-picks-eyebrow {
  color: #9aa0a6;
  font-size: 13px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 8px;
}

.dc-picks-title {
  font-size: 40px;
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 48px;
}

.dc-picks-title span {
  color: #f15a22;
}

/* Grid */
.dc-picks-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

/* Card */
.dc-pick-card {
  background: #0d0d0d;
  border-radius: 16px;
  padding: 24px;
  box-shadow: 1px 1px 5px #2e2e2e;
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
  cursor: pointer;
}

.dc-pick-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.4);
}

/* Header */
.dc-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.dc-card-icon {
  width: 44px;
  height: 44px;
}

.dc-card-verified {
  width: 10px;
  height: 10px;
  background: #f15a22;
  border-radius: 50%;
}

/* Text */
.dc-card-title {
  font-size: 18px;
  font-weight: 500;
  color: #ffffff;
  margin-bottom: 4px;
}

.dc-card-author {
  font-size: 13px;
  color: #9aa0a6;
  margin-bottom: 16px;
}

.dc-card-price {
  font-size: 15px;
  font-weight: 500;
  color: #ffffff;
  margin-bottom: 8px;
}

/* Risk badges */
.dc-risk {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 12px;
  margin-bottom: 14px;
}

.dc-risk-high {
  background: rgba(229, 94, 0, 0.15);
  color: #f15a22;
}

.dc-risk-medium {
  background: rgba(0, 136, 255, 0.15);
  color: #4aa3ff;
}

.dc-card-desc {
  font-size: 14px;
  line-height: 1.6;
  color: #c2c5cc;
}

/* Responsive */
@media (max-width: 1024px) {
  .dc-picks-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 640px) {
  .dc-picks-title {
    font-size: 30px;
  }

  .dc-picks-grid {
    grid-template-columns: 1fr;
  }
}

.dc-blog-section {
  padding: 64px 0;
}

.dc-blog-container {
  margin: 0 auto;
  padding: 0 20px;

  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
}

/* Card */
.dc-blog-card {
  background: #1b1b1b;
  border-radius: 18px;
  overflow: hidden;
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
}

.dc-blog-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.45);
}

.dc-blog-link {
  display: block;
  height: 100%;
  color: inherit;
  text-decoration: none;
}

/* Media */
.dc-blog-media {
  position: relative;
  height: 240px;
  overflow: hidden;
}

.dc-blog-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}

.dc-blog-card:hover .dc-blog-image {
  transform: scale(1.05);
}
.dc-blog-card .dc-blog-content {
  padding: 20px 20px;
}
.dc-blog-accent {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(229, 94, 0, 0.35), transparent 60%);
  pointer-events: none;
}

/* Content */
.dc-blog-content {
  padding: 22px 0px 26px;
}

.dc-blog-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: #9aa0a6;
  margin-bottom: 10px;
}

.dc-blog-author {
  color: #f15a22;
  font-weight: 500;
}

.dc-blog-dot {
  opacity: 0.6;
}

.dc-blog-title {
  font-size: 20px;
  line-height: 1.35;
  color: #ffffff;
  margin-bottom: 12px;
}

.dc-blog-excerpt {
  font-size: 14px;
  line-height: 1.6;
  color: #c3c6cc;
  margin-bottom: 18px;
}

/* Footer */
.dc-blog-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 13px;
  color: #9aa0a6;
}

.dc-blog-like {
  font-size: 18px;
  color: #f15a22;
}

/* Responsive */
@media (max-width: 900px) {
  .dc-blog-container {
    grid-template-columns: 1fr;
  }

  .dc-blog-media {
    height: 200px;
  }
}

.dc-blog-hero {
  padding: 150px 0 80px;
}

.dc-blog-hero-container {
  max-width: 980px;
  margin: 0 auto;
  padding: 0 20px;
}

/* Meta */
.dc-blog-hero-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 24px;
}

.dc-blog-author-badge {
  width: 36px;
  height: 36px;
  background: #f15a22;
  color: #ffffff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
}

.dc-blog-meta-text {
  font-size: 14px;
  color: #9aa0a6;
}

.dc-blog-author-name {
  color: #ffffff;
  font-weight: 500;
}

.dc-blog-meta-dot {
  margin: 0 6px;
}

/* Title */
.dc-blog-hero-title {
  font-size: 42px;
  line-height: 1.2;
  font-weight: 700;
  margin-bottom: 40px;
}

.dc-blog-hero-title span {
  background: linear-gradient(transparent 60%, rgba(229, 94, 0, 0.25) 60%);
  color: #ffffff;
  padding: 4px 8px;
  display: inline-block;
}

/* Image */
.dc-blog-hero-image {
  border-radius: 18px;
  overflow: hidden;
  height: 400px;
  margin-bottom: 40px;
}

.dc-blog-hero-image img {
  width: 100%;
  height: auto;
  display: block;
}

/* Content */
.dc-blog-content p {
  font-size: 16px;
  line-height: 1.8;
  color: #c2c5cc;
  margin-bottom: 22px;
}

/* Responsive */
@media (max-width: 768px) {
  .dc-blog-hero-title {
    font-size: 30px;
  }

  .dc-blog-hero-title span {
    padding: 2px 6px;
  }

  .dc-blog-content p {
    font-size: 15px;
  }
}

#fk-login-trigger {
  background-color: #000;
  color: #fff;
  border-color: #f15a22;
  padding: 5px 18px;
  border: 2px solid #f15a22;
  cursor: pointer;
  transition: all 0.3s ease;
  border-radius: 10px;
  font-size: 16px;
}

#fk-login-trigger:hover {
  background-color: #000;
  color: #fff;
  border-color: #f15a22;
}

#inv_p {
  line-height: 1.3;
  font-size: 21px;
  font-weight: 500;
}

#inv_philo {
  width: 50%;
}

#inv_img {
  width: 50%;
  justify-content: center;
}

#inv_ph_box {
  flex-wrap: nowrap;
  justify-content: space-between;
}

.fk-investor-journey {
  padding: 80px 20px;
}

.fk-journey-inner {
  max-width: 1100px;
  margin: 0 auto;
}

.fk-journey-title {
  font-size: 56px;
  font-weight: 600;
  color: #fff;
  margin-bottom: 60px;
}

.fk-journey-title span {
  color: #f15a22;
}

.fk-journey-flow {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 30px;
  position: relative;
}

.fk-journey-step {
  padding: 28px 24px;
  border-radius: 16px;
  box-shadow: 0 10px 35px #f15a2242;
  border: 1px solid #272727;
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
}

.fk-journey-step:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 50px rgba(229, 94, 0, 0.25);
}

.indc_step {
  width: 100%;
  text-align: center;
  display: flex;
  /* justify-content: center; */
}

.fk-step-indicator {
  width: 35px;
  height: 35px;
  background-color: #f15a22;
  border-radius: 50%;
  display: flex;
  text-align: center;
  margin-bottom: 18px;
  justify-content: center;
  align-items: center;
}

.fk-journey-step h3 {
  font-size: 20px;
  color: #fff;
  margin-bottom: 10px;
}

.fk-journey-step p {
  font-size: 15px;
  line-height: 1.6;
  color: #bdbdbd;
}

.fk-journey-flow {
  grid-template-columns: repeat(5, 1fr);
}

/* Responsive */
@media (max-width: 1024px) {
  .fk-journey-flow {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 600px) {
  .fk-journey-title {
    font-size: 28px;
  }

  .fk-journey-flow {
    grid-template-columns: 1fr;
  }
}

.fk-trust-governance {
  padding: 80px 20px 80px;
}

.fk-trust-inner {
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 0.6fr 1.2fr;
  gap: 60px;
  align-items: center;
}

.fk-trust-title {
  font-size: 52px;
  font-weight: 500;
  color: #fff;
  margin-bottom: 22px;
}

.fk-trust-text {
  font-size: 16px;
  line-height: 1.8;
  color: #bdbdbd;
  max-width: 620px;
}

.fk-trust-text img{
  width: 20%;
}

.fk-trust-icons {
  display: flex;
  gap: 22px;
  justify-content: flex-end;
}

.fk-trust-icon img {
  /* width: 50px; */
  border-radius: 20px;
}

.fk-trust-icon:hover {
  transform: translateY(-4px);
  border-color: #f15a22;
}

/* Responsive */
@media (max-width: 900px) {
  .fk-trust-inner {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .fk-trust-icons {
    justify-content: flex-start;
  }
}

@media (max-width: 600px) {
  .fk-trust-title {
    font-size: 28px;
  }

  .fk-trust-icon {
    /* width: 60px;
    height: 60px; */
  }
  .fk-trust-governance {
    padding: 0 20px;
  }
}

.fk-insight-stream {
  padding: 0px 20px 90px;
}

.fk-insight-stream-inner {
  max-width: 1150px;
  margin: 0 auto;
}

.fk-insight-stream-head {
  max-width: 720px;
  margin-bottom: 60px;
}

.fk-insight-stream-title {
  font-size: 52px;
  font-weight: 600;
  color: #fff;
  margin-bottom: 16px;
}

.fk-insight-stream-desc {
  font-size: 16px;
  line-height: 1.7;
  color: #bdbdbd;
}

.fk-insight-stream-list {
  display: flex;
  flex-direction: column;
  gap: 26px;
}

/* Horizontal Card */
.fk-insight-row {
  display: flex;
  align-items: flex-start;
  gap: 26px;
  padding: 30px 32px;
  border-radius: 22px;
  box-shadow: 0 14px 48px rgba(0, 0, 0, 0.5);
  position: relative;
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
  overflow: hidden;
}

/* Accent strip */
.fk-insight-row::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 4px;
  height: 100%;
  background: linear-gradient(180deg, #f15a22, transparent);
}

.fk-insight-row:hover {
  transform: translateY(-6px);
  box-shadow: 0 22px 68px rgba(229, 94, 0, 0.28);
}

.fk-insight-row-icon {
  width: 58px;
  height: 58px;
  border-radius: 16px;
  border: 1px solid rgba(229, 94, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition:
    background-color 0.3s ease,
    border-color 0.3s ease;
}

.fk-insight-row-icon img {
  width: 30px;
}

.fk-insight-row:hover .fk-insight-row-icon {
  background-color: rgba(229, 94, 0, 0.12);
  border-color: #f15a22;
}

.fk-insight-row-content h3 {
  font-size: 21px;
  color: #fff;
  margin-bottom: 12px;
  line-height: 1.35;
}

.fk-insight-row-content h3 span {
  color: #f15a22;
}

.fk-insight-row-content p {
  font-size: 15px;
  line-height: 1.65;
  color: #bdbdbd;
  max-width: 720px;
}

.fk-insight-stream-cta {
  margin-top: 50px;
}

.fk-insight-stream-btn {
  display: inline-block;
  padding: 12px 28px;
  border-radius: 999px;
  border: 1px solid #f15a22;
  color: #f15a22;
  text-decoration: none;
  font-size: 14px;
  transition: all 0.3s ease;
}

.fk-insight-stream-btn:hover {
  background-color: #f15a22;
  color: #000;
}

/* Responsive */
@media (max-width: 768px) {
  .fk-insight-row {
    flex-direction: column;
    gap: 18px;
  }

  .fk-insight-row-icon {
    width: 50px;
    height: 50px;
  }

  .fk-insight-stream-title {
    font-size: 28px;
  }
}

.fk-final-journey-cta {
  padding: 30px 20px 30px;
  width: 100%;
}

.fk-final-journey-inner {
  max-width: 1100px;
  margin: 0 auto;
  text-align: center;
}

.fk-final-journey-title {
  font-size: 56px;
  font-weight: 500;
  color: #fff;
  margin-bottom: 22px;
}

.fk-final-journey-text {
  font-size: 17px;
  line-height: 1.8;
  color: #bdbdbd;
  max-width: 720px;
  margin: 0 auto 50px;
}

/* CTA Buttons */
.fk-final-journey-actions {
  display: flex;
  justify-content: center;
  gap: 18px;
  flex-wrap: wrap;
}

.fk-final-btn {
  padding: 13px 30px;
  border-radius: 999px;
  font-size: 14px;
  text-decoration: none;
  transition: all 0.3s ease;
  white-space: nowrap;
}

/* Primary */
.fk-final-btn-primary {
  background-color: #f15a22;
  color: #000;
}

.fk-final-btn-primary:hover {
  background-color: #ff6a00;
}

/* Outline */
.fk-final-btn-outline {
  border: 1px solid #f15a22;
  color: #f15a22;
}

.fk-final-btn-outline:hover {
  background-color: #f15a22;
  color: #000;
}

/* Ghost */
.fk-final-btn-ghost {
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.25);
}

.fk-final-btn-ghost:hover {
  border-color: #fff;
}

/* Responsive */
@media (max-width: 768px) {
  .fk-final-journey-title {
    font-size: 30px;
  }

  .fk-final-journey-text {
    font-size: 15px;
  }

  .fk-final-btn {
    padding: 12px 24px;
  }
}
.fk-final-journey-text img{
  width: 20%;
  margin: 0 5px;
  margin-top: -7px;
}
/* Full-width hero */
.fk-hero-investment {
  width: 100%;
  padding: 130px 40px 50px;
}

.fk-hero-inner {
  max-width: 80%;
  margin: 0 auto;
}

/* Title */
.fk-hero-title {
  color: #fff;
  font-weight: 600;
  line-height: 1.1;
  font-size: 56px;
  margin-bottom: 28px;
}

.fk-hero-title-highlight {
  display: inline-block;
  font-size: 100px;
  line-height: 1;
  color: #f15a22;
  margin-right: 12px;
}

/* Paragraph */
.fk-hero-description {
  font-size: 17px;
  line-height: 1.8;
  color: #bdbdbd;
  max-width: 880px;
}

/* Tablet */
@media (max-width: 1024px) {
  .fk-hero-title {
    font-size: 44px;
  }

  .fk-hero-title-highlight {
    font-size: 72px;
  }

  .fk-hero-description {
    font-size: 16px;
  }
}

/* Mobile */
@media (max-width: 600px) {
  .fk-hero-investment {
    padding: 90px 20px;
  }

  .fk-hero-title {
    font-size: 32px;
  }

  .fk-hero-title-highlight {
    font-size: 48px;
    display: block;
    margin-bottom: 8px;
  }

  .fk-hero-description {
    font-size: 15px;
  }
}

.solution_choice_section {
  width: 100%;
  padding: 20px 20px 30px;
  display: flex;
  justify-content: center;
}

.solution_choice_inner {
  max-width: 920px;
  text-align: center;
}

/* Title */
.solution_choice_title {
  font-size: 56px;
  font-weight: 600;
  color: #fff;
  margin-bottom: 42px;
}

.solution_choice_highlight {
  color: #f15a22;
}

/* Boxed paragraph */
.solution_choice_box {
  padding: 44px 48px;
  border-radius: 22px;
  border: 1px solid rgb(189 189 189 / 18%);
  box-shadow: 0 18px 55px rgba(0, 0, 0, 0.55);
}

/* Paragraph */
.solution_choice_text {
  font-size: 18px;
  line-height: 1.9;
  color: #d6d6d6;
  margin: 0;
}

/* Tablet */
@media (max-width: 1024px) {
  .solution_choice_title {
    font-size: 44px;
  }

  .solution_choice_box {
    padding: 36px 38px;
  }

  .solution_choice_text {
    font-size: 17px;
  }
}

/* Mobile */
@media (max-width: 600px) {
  .solution_choice_section {
    padding: 90px 16px;
  }

  .solution_choice_title {
    font-size: 32px;
  }

  .solution_choice_box {
    padding: 28px 26px;
  }

  .solution_choice_text {
    font-size: 16px;
  }
}

.solution_categories_section {
  padding: 0px 20px 20px;
  width: 100%;
}

.solution_categories_inner {
  max-width: 1200px;
  margin: 0 auto;
}

/* Header */
.solution_categories_header h2 {
  font-size: 56px;
  font-weight: 600;
  color: #fff;
  margin-bottom: 80px;
}

.solution_categories_header span {
  color: #f15a22;
}

/* Block */
.solution_block {
  padding: 48px 52px;
  margin-bottom: 60px;
  border-radius: 24px;
  border: 1px solid rgba(229, 94, 0, 0.25);
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.55);
}

/* Title */
.solution_block_title {
  font-size: 32px;
  font-weight: 600;
  color: #fff;
  margin-bottom: 18px;
}

.solution_block_title span {
  color: #f15a22;
}

/* Intro */
.solution_block_intro {
  font-size: 17px;
  line-height: 1.8;
  color: #cfcfcf;
  max-width: 820px;
  margin-bottom: 30px;
}

/* List */
.solution_block_list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px 40px;
  margin-bottom: 36px;
  padding-left: 0;
  list-style: none;
}

.solution_block_list li {
  color: #e0e0e0;
  font-size: 15px;
  position: relative;
  padding-left: 18px;
}

.solution_block_list li::before {
  content: "•";
  color: #f15a22;
  position: absolute;
  left: 0;
}

/* CTA */
.solution_block_cta {
  display: inline-block;
  padding: 12px 28px;
  border-radius: 999px;
  border: 1px solid #f15a22;
  color: #f15a22;
  text-decoration: none;
  font-size: 14px;
  transition: all 0.3s ease;
}

.solution_block_cta:hover {
  background-color: #f15a22;
  color: #000;
}

/* Responsive */
@media (max-width: 1024px) {
  .solution_categories_header h2 {
    font-size: 44px;
  }

  .solution_block {
    padding: 40px;
  }

  .solution_block_list {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 600px) {
  .solution_categories_header h2 {
    font-size: 32px;
  }

  .solution_block {
    padding: 28px;
  }

  .solution_block_title {
    font-size: 24px;
  }
}

.sol_cat_title {
  font-weight: 500;
}

.delivery_framework_section {
  width: 100%;
  padding: 00px 20px 100px;
  display: flex;
  justify-content: center;
}

.delivery_framework_inner {
  max-width: 1100px;
  text-align: center;
}

/* Title */
.delivery_framework_title {
  font-size: 48px;
  font-weight: 600;
  color: #fff;
  margin-bottom: 28px;
}

.delivery_framework_title span {
  color: #f15a22;
}

/* Copy */
.delivery_framework_copy {
  font-size: 17px;
  line-height: 1.85;
  color: #cfcfcf;
  max-width: 820px;
  margin: 0 auto 60px;
}

/* Pillars */
.delivery_framework_pillars {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 22px;
}

.delivery_framework_pillar {
  padding: 26px 18px;
  border-radius: 18px;
  border: 1px solid rgba(229, 94, 0, 0.25);
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.45);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
}

.delivery_framework_pillar:hover {
  transform: translateY(-6px);
  box-shadow: 0 22px 60px rgba(229, 94, 0, 0.28);
}

/* Icon box */
.delivery_framework_icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  border: 1px solid rgba(229, 94, 0, 0.45);
  display: flex;
  align-items: center;
  justify-content: center;
}

.delivery_framework_icon img {
  width: 35px;
}

/* Label */
.delivery_framework_pillar span {
  font-size: 14px;
  color: #e6e6e6;
  font-weight: 500;
}

/* Responsive */
@media (max-width: 1024px) {
  .delivery_framework_pillars {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 600px) {
  .delivery_framework_section {
    padding: 90px 16px;
  }

  .delivery_framework_title {
    font-size: 32px;
  }

  .delivery_framework_copy {
    font-size: 16px;
  }

  .delivery_framework_pillars {
    grid-template-columns: repeat(2, 1fr);
  }
}

.Ser_title {
  font-size: 32px !important;
  font-weight: 600;
}

.governance_layout_section {
  width: 100%;
  padding: 30px 20px 100px;
}

.governance_layout_inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

/* Content */
.governance_layout_content {
  max-width: 720px;
  margin-bottom: 0px;
}

.governance_layout_title {
  font-size: 48px;
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 26px;
}

.governance_layout_title span {
  color: #f15a22;
}

.governance_layout_text {
  font-size: 18px;
  line-height: 1.9;
  color: #d0d0d0;
}

/* Links */
.governance_layout_links {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 26px;
}

.governance_links_row {
  display: flex;
  gap: 24px;
}

.governance_links_center {
  margin-top: 6px;
}

/* Link Box */
.governance_link_box {
  min-width: 200px;
  padding: 18px 28px;
  font-size: 18px;
  font-weight: 500;
  color: #ffffff;
  text-decoration: none;
  text-align: center;
  border: 1px solid rgba(229, 94, 0, 0.4);
  border-radius: 14px;
  transition: all 0.3s ease;
}

.governance_link_box:hover {
  background-color: #f15a22;
  color: #000;
  transform: translateY(-2px);
}

/* Tablet */
@media (max-width: 1024px) {
  .governance_layout_title {
    font-size: 40px;
  }

  .governance_layout_text {
    font-size: 17px;
  }

  .governance_link_box {
    min-width: 180px;
    font-size: 17px;
  }
}

/* Mobile */
@media (max-width: 768px) {
  .governance_links_row {
    flex-direction: column;
    gap: 18px;
  }

  .governance_links_center {
    margin-top: 0;
  }

  .governance_link_box {
    width: 100%;
    max-width: 280px;
  }
}

#who_sol {
  font-size: 52px;
}

.partner_value_section {
  width: 100%;
  padding: 50px 20px 50px;
}

.partner_value_inner {
  max-width: 1200px;
  margin: 0 auto;
}

/* Content */
.partner_value_content {
  /* max-width: 760px; */
  margin-bottom: 70px;
}

.partner_value_title {
  font-size: 48px;
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 28px;
}

.partner_value_title span {
  color: #f15a22;
}

.partner_value_text {
  font-size: 18px;
  line-height: 1.9;
  color: #d0d0d0;
}

/* Grid */
.partner_value_grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 26px;
}

/* Card */
.partner_value_card {
  padding: 26px 28px;
  border: 1px solid rgba(229, 94, 0, 0.55);
  border-radius: 18px;
  font-size: 17px;
  font-weight: 500;
  color: #ffffff;
  line-height: 1.6;
  transition: all 0.3s ease;
}

.partner_value_card:hover {
  background-color: rgba(229, 94, 0, 0.08);
  transform: translateY(-2px);
}

/* Tablet */
@media (max-width: 1024px) {
  .partner_value_title {
    font-size: 40px;
  }

  .partner_value_text {
    font-size: 17px;
  }

  .partner_value_grid {
    grid-template-columns: 1fr;
  }
}

/* Mobile */
@media (max-width: 768px) {
  .partner_value_section {
    padding: 90px 20px;
  }

  .partner_value_title {
    font-size: 34px;
  }

  .partner_value_card {
    font-size: 16px;
    padding: 22px;
  }
}

#who_part {
  font-size: 48px;
}

#part_text {
  font-size: 24px !important;
}

.career_opportunities_section {
  width: 100%;
  padding: 30px 20px 60px;
}

.career_opportunities_inner {
  max-width: 1100px;
  margin: 0 auto;
}

/* Content */
.career_opportunities_content {
  max-width: 500px;
}

.career_opportunities_title {
  font-size: 48px;
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 26px;
}

.career_opportunities_title span {
  color: #f15a22;
}

.career_opportunities_text {
  font-size: 18px;
  line-height: 1.9;
  color: #d0d0d0;
  margin-bottom: 40px;
}

/* CTA */
.career_opportunities_cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 16px 32px;
  font-size: 16px;
  font-weight: 500;
  color: #000;
  background-color: #f15a22;
  border-radius: 14px;
  text-decoration: none;
  transition: all 0.3s ease;
}

.career_opportunities_cta:hover {
  background-color: transparent;
  color: #ffffff;
  border: 1px solid #f15a22;
}

/* Tablet */
@media (max-width: 1024px) {
  .career_opportunities_title {
    font-size: 40px;
  }

  .career_opportunities_text {
    font-size: 17px;
  }
}

/* Mobile */
@media (max-width: 768px) {
  .career_opportunities_section {
    padding: 0px 20px;
  }

  .career_opportunities_title {
    font-size: 34px;
  }

  .career_opportunities_cta {
    width: 100%;
    justify-content: center;
  }
}

.career_opportunities_layout {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 80px;
}

/* Image */
.career_opportunities_image img {
  width: 100%;
  max-width: 500px;
  border-radius: 18px;
  object-fit: cover;
  opacity: 0.95;
}

/* Tablet */
@media (max-width: 1024px) {
  .career_opportunities_layout {
    gap: 50px;
  }

  .career_opportunities_image img {
    max-width: 360px;
  }
}

/* Mobile */
@media (max-width: 768px) {
  .career_opportunities_layout {
    flex-direction: column;
    text-align: center;
  }

  .career_opportunities_image img {
    max-width: 100%;
    width: 200px;
    margin-top: 50px;
  }
}

#jb-custom-nav-container .jb-overlay-header {
  display: flex;
  justify-content: space-between;
  gap: 100px;
  align-items: center;
  padding: 10px 10px 0;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;
  background: #0d0d0d;
  box-sizing: border-box;
}

#jb-custom-nav-container .jb-main-logo {
  color: #ffffff;
 
  font-weight: 400;
  margin: 0;
  font-size: 28px;
}

#jb-custom-nav-container .jb-hamburger-btn {
  background: none;
  border: none;
  cursor: pointer;
  width: 30px;
  height: 20px;
  position: relative;
  z-index: 1100;
}

#jb-custom-nav-container .jb-burger-line {
  display: block;
  position: absolute;
  height: 1px;
  width: 65%;
  background: #ffffff;
  transition: 0.25s ease-in-out;
}

#jb-custom-nav-container .jb-line-1 {
  top: 0px;
}
#jb-custom-nav-container .jb-line-2 {
  top: 10px;
  height: 1.5px;
}
#jb-custom-nav-container .jb-line-3 {
  top: 20px;
}

/* Hamburger to Cross Animation */
#jb-custom-nav-container .jb-hamburger-btn.jb-active .jb-line-1 {
  top: 10px;
  transform: rotate(135deg);
}
#jb-custom-nav-container .jb-hamburger-btn.jb-active .jb-line-2 {
  opacity: 0;
}
#jb-custom-nav-container .jb-hamburger-btn.jb-active .jb-line-3 {
  top: 10px;
  transform: rotate(-135deg);
}

/* Overlay Background */
#jb-custom-nav-container .jb-menu-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #000;
  z-index: 999;
  visibility: hidden;
  opacity: 0;
  transform: translateY(-100%);
  transition: 
    transform 0.5s cubic-bezier(.22,.61,.36,1),
    opacity 0.4s ease,  visibility 0s linear 0.5s; 
  overflow-x: hidden;
}

#jb-custom-nav-container .jb-menu-overlay.jb-show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);

  transition:
    transform 0.5s cubic-bezier(.22,.61,.36,1),
    opacity 0.4s ease,
    visibility 0s; /* no delay when opening */
}

/* Navigation Panes */
#jb-custom-nav-container .jb-overlay-content {
  display: flex;
  margin-top: 70px;
  /* padding: 0 10%; */
  height: 600px;
  transition: transform 0.3s ease-in-out;
}

#jb-custom-nav-container .jb-primary-nav {
  min-width: 30%;
}

.left_menu{
      display: flex;
    width: 65%;
    background-color: #f15a22;
    padding: 50px;
    flex-direction: column;
    height: 100%;
}

.right_menu{
  width: 30%;
  padding-left: 50px;
}

.right_sub_menu{
  display: flex;
    flex-direction: column;
    /* align-items: center; */
    justify-content: center;
    height: 100%;
    gap: 50px;
}

.right_sub_menu .drc_btn{
  margin: 0 auto;
  width: max-content;
}

#jb-custom-nav-container .jb-primary-list {
  list-style: none;
  padding: 0;
  /* border-right: 1px solid rgba(255, 255, 255, 0.1); */
}

#jb-custom-nav-container .jb-primary-item {
  font-size: 34px;
  color: #ffffff;
  width: max-content;
  margin-bottom: 30px;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-right: 40px;
  text-decoration: none;
}

#jb-custom-nav-container .jb-geo-tag {
  font-size: 10px;
  border: 1px solid #ffffff;
  padding: 2px 4px;
  margin-left: 10px;
  vertical-align: middle;
}

#jb-custom-nav-container .jb-mobile-arrow {
  display: none;
  font-size: 24px;
}

/* Desktop Sub-menu (Hover based) */
#jb-custom-nav-container .jb-sub-nav-container {
  /* padding-left: 60px; */
  width: 100%;
  display: flex;
  /* justify-content: center; */
  gap: 20px;
}
#jb-custom-nav-container .jb-sub-list {
  list-style: none;
  padding: 0;
  display: none;
}
#jb-custom-nav-container .jb-sub-list.jb-active-sub {
  display: block;
}
#jb-custom-nav-container .jb-sub-item {
  font-size: 16px;
  color: #fff;
  margin-bottom: 15px;
  cursor: pointer;
}
.jb-sub-item a{
  color: #fff;
}
#jb-custom-nav-container .jb-sub-item:hover {
  color: #ffffff;
}
#jb-back-button {
  display: none;
}

.d_logo {
  width: 250px;
}

.nav_links {
  color: #fff;
  text-decoration: none;
  background-image: linear-gradient(#f15a22e8, #f15a22f0);
  background-size: 0% 2px;
  background-repeat: no-repeat;
  background-position: left bottom;
  padding-bottom: 10px;
  transition: background-size 0.3s ease;
}

.nav_links:hover {
  background-size: 100% 2px;
}
#jb-sub-pane .jb-sub-item.jb-sub-title {
  color: #fff;
  font-weight: 600;
  font-size: 24px;
  margin-top: 0px;
}
#platform-sub .jb-sub-item,
#insights-sub .jb-sub-item,
#partner-sub .jb-sub-item,
#about-sub .jb-sub-item {
  margin-bottom: 25px !important;
}

.hero_btns {
  display: flex;
  gap: 20px;
}

.hero_btns .btn-default {
  margin-right: 20px;
}

/* MOBILE STYLES */
@media (max-width: 768px) {
  #jb-custom-nav-container .jb-hide-mobile {
    display: none;
  }
  #jb-custom-nav-container .jb-mobile-arrow {
    display: inline-block;
  }

  #jb-custom-nav-container .jb-overlay-content {
    margin-top: 80px;
    padding: 0;
    width: 200%; /* Two panes wide */
  }

  #jb-custom-nav-container .jb-primary-nav,
  #jb-custom-nav-container .jb-sub-nav-container {
    width: 50%;
    padding: 20px;
    box-sizing: border-box;
  }

  #jb-custom-nav-container .jb-primary-list {
    border-right: none;
  }
  #jb-custom-nav-container .jb-primary-item {
    font-size: 24px;
    padding-right: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    padding-bottom: 15px;
  }

  #jb-custom-nav-container .jb-back-nav {
    padding: 80px 20px 0;
    display: none;
  }

  #jb-custom-nav-container .jb-back-btn {
    background: none;
    border: none;
    color: #ffffff;
    font-size: 18px;
    cursor: pointer;
    padding: 0;
  }

  /* Sub-menu title in mobile */
  #jb-custom-nav-container .jb-sub-title {
    font-size: 26px;
    color: #ffffff;
    margin-bottom: 30px;
    border-bottom: 1px solid #ffffff;
    padding-bottom: 10px;
  }

  /* Sliding logic */
  #jb-custom-nav-container .jb-overlay-content.jb-slide-left {
    transform: translateX(-50%);
  }

  #jb-custom-nav-container .jb-mobile-only-footer {
    margin-top: 40px;
    display: flex;
    justify-content: space-around;
  }
  #jb-custom-nav-container .jb-mobile-only-footer a {
    color: #ffffff;
    text-decoration: none;
    font-size: 14px;
  }
  #jb-back-button {
    display: block;
  }
  #jb-custom-nav-container .jb-overlay-header {
    display: none;
    padding: 20px 20px;
  }
  #fk-login-trigger {
    padding: 5px 10px;
  }
  .d_logo {
    width: 150px;
  }
  .jb-custom-nav-container {
    display: none;
  }
}

/* Flyout Logic */
.has-flyout {
  position: relative;
}

/* This container holds the third level menu */
.jb-flyout-pane {
      position: absolute;
    left: auto;
    top: 22px;
    bottom: 100%;
    right: 13%;
    min-width: 250px;
    padding-left: 40px;
     opacity: 0;
     visibility: hidden; 
    transition: opacity 0.3s ease, transform 0.3s ease;
    transform: translateX(10px);
}

/* Show on hover */
.has-flyout:hover .jb-flyout-pane {
  opacity: 1;
  visibility: visible;
  transform: translateX(0);
}

.jb-flyout-list {
  list-style: none;
  padding: 15px;
  background-color: #fff;
  border-radius: 20px;
  margin: 0;
  border-left: 1px solid rgba(255, 255, 255, 0.1); /* Subtle vertical separator */
  padding-left: 20px;
}

.jb-flyout-list li {
  color: #000; /* White text as requested */
  font-size: 14px;
  padding: 3px 0;
  white-space: nowrap;
  transition: color 0.2s;
}

.jb-flyout-list li a{
  color: #000;
}

.jb-flyout-list li:hover {
  /* color: #f15a22;  */
}

/* Maintain original mobile logic - disable flyout on mobile and stack items */
@media (max-width: 768px) {
  .jb-flyout-pane {
    position: static;
    opacity: 1;
    visibility: visible;
    transform: none;
    padding-left: 20px;
    margin-top: 10px;
  }
  .jb-flyout-list {
    border-left: none;
  }
  .jb-flyout-list li {
    white-space: normal;
  }
}

.jb-header-left .jb-header-icon-link {
  color: #fff;
}

.bg-video-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.bg-video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.bg-video-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.9); /* increase to darken more */
  pointer-events: none;
}

.trust_band_wrap {
  width: 100%;
  padding: 30px 24px;
  background: #181818;
  position: relative;
  z-index: 10;
  margin: 50px 0;
}

.trust_band_inner {
  max-width: 1200px;
  margin: 0 auto;
  position: relative;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 48px;
}

/* Left */
.trust_band_text h3 {
  font-size: 40px;
  font-weight: 500;
  line-height: 1.25;
  color: #fff;
}

.trust_band_highlight {
  color: #f15a22; /* green shade that works with #091a84 */
}

/* Right */
.trust_band_logos {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.trust_band_logos img {
  max-height: 65px;

  transition: all 0.3s ease;
}

.trust_band_logos img:hover {
  opacity: 1;
  filter: grayscale(0%);
}

/* Responsive */
@media (max-width: 900px) {
  .trust_band_inner {
    flex-direction: column;
    text-align: center;
  }

  .trust_band_text h3 {
    font-size: 32px;
  }

  .trust_band_logos {
    justify-content: center;
  }
}

@media (max-width: 480px) {
  .trust_band_text h3 {
    font-size: 26px;
  }

  .trust_band_logos img {
    max-height: 55px;
  }
}

.investor_flow_wrap {
  background: #000;
  padding: 100px 24px;
  color: #fff;
}

.investor_flow_inner {
  max-width: 1200px;
  margin: 0 auto;
}

.investor_flow_title {
  /* text-align: center; */
  font-size: 42px;
  font-weight: 500;
  margin-bottom: 70px;
}

.investor_flow_title span {
  color: #f15a22;
  font-weight: 600;
}

/* Grid */
.investor_flow_grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
}

/* Card */
.investor_flow_card {
  position: relative;
  background: rgba(255, 255, 255, 0.03);
  border-radius: 22px;
  padding: 40px 28px;
  text-align: center;
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.08);
  transition: all 0.35s ease;
}

/* Gradient border effect */
.investor_flow_card::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 22px;
  padding: 1.5px;
  background: linear-gradient(
    135deg,
    transparent,
    rgba(229, 94, 0, 0.9),
    transparent
  );
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  opacity: 1;
  /* transition: opacity 0.35s ease; */
}

.investor_flow_card:hover::before,
.investor_flow_card.is_active::before {
  opacity: 1;
}

.investor_flow_card:hover {
  transform: translateY(-8px);
}

/* Icon */
.flow_card_icon {
  width: 56px;
  height: 56px;
  margin: 0 auto 22px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.flow_card_icon img {
  width: 100%;
  height: auto;
}

/* Text */
.investor_flow_card h3 {
  font-size: 20px;
  font-weight: 500;
  margin-bottom: 12px;
}

.investor_flow_card p {
  font-size: 15px;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.75);
}

/* Responsive */
@media (max-width: 1024px) {
  .investor_flow_grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 600px) {
  .investor_flow_title {
    font-size: 30px;
  }

  .investor_flow_grid {
    grid-template-columns: 1fr;
  }
}

/* Image/Icon Placeholder */
.pillar-visual {
  width: 100%;
  height: 200px;
  border-radius: 18px;
  margin-bottom: 30px;
  background: rgba(255, 255, 255, 0.05);
}

.pillar-visual img {
  border-radius: 20px;
}

/* Container for the whole widget */
.chatur_widget_wrapper {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 9999; /* High z-index to stay on top */
  display: flex;
  /* flex-direction: column; */
  align-items: flex-end;
  pointer-events: none; /* Allows clicking things behind the wrapper... */
}

/* Re-enabling pointer events for child elements */
.chatur_chat_bubble,
.chatur_chat_trigger {
  pointer-events: auto;
}

/* Unique Styled Message Bubble */
.chatur_chat_bubble {
  background: #000; /* Deep dark background */
  color: #ffffff;
  padding: 12px;
  border-radius: 20px;
  border-bottom-right-radius: 4px; /* Creates the "tail" look */
  margin-bottom: 12px;
  max-width: 260px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.6);

  border: 1px solid rgba(255, 255, 255, 0.1);
  animation: chatur_fade_up 0.6s ease-out;
}

.chatur_chat_main_text {
  margin: 0 0 6px 0 !important;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.5;
}

.chatur_chat_tip {
  font-size: 11px;
  color: #94a3b8; /* Muted blue-grey */
  font-style: italic;
}

/* Mascot Image Styling */
.chatur_chat_mascot {
  width: 70px; /* Adjust size to match your design */
  height: auto;
  cursor: pointer;
  filter: drop-shadow(0 5px 15px rgba(0, 0, 0, 0.4));
  transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.chatur_chat_trigger:hover .chatur_chat_mascot {
  transform: scale(1.1) translateY(-5px);
}

/* Unique Animation Name */
@keyframes chatur_fade_up {
  from {
    opacity: 0;
    transform: translateY(15px) scale(0.95);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

/* Overlay */
.connect_popup_overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.75);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}

/* Container */
.connect_popup_container {
  width: 90%;
  max-width: 900px;
  background: linear-gradient(135deg, #0b0b0b, #1a1a1a);
  border-radius: 18px;
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  overflow: hidden;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.6);
}

/* Left */
.connect_popup_left {
  padding: 32px;
  color: #fff;
  position: relative;
}

.connect_popup_close {
  position: absolute;
  top: 16px;
  right: 16px;
  background: none;
  border: none;
  color: #fff;
  font-size: 22px;
  cursor: pointer;
}

.connect_popup_title {
  font-size: 28px;
  margin-bottom: 8px;
}

.connect_popup_subtitle {
  font-size: 14px;
  color: #b5b5b5;
  margin-bottom: 24px;
}

.connect_popup_field {
  margin-bottom: 18px;
}

.connect_popup_field label {
  display: block;
  font-size: 13px;
  margin-bottom: 6px;
  color: #cfcfcf;
}

.connect_popup_field input {
  width: 100%;
  padding: 12px 14px;
  background: #141414;
  border: 1px solid #2a2a2a;
  border-radius: 10px;
  color: #fff;
}

.connect_popup_actions {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 10px;
}

.connect_popup_submit {
  background: #091a84;
  color: #fff;
  border: none;
  padding: 12px 22px;
  border-radius: 30px;
  cursor: pointer;
}

.connect_popup_skip {
  background: none;
  border: none;
  color: #aaa;
  cursor: pointer;
}

.connect_popup_note {
  font-size: 11px;
  color: #888;
  margin-top: 16px;
}

/* Right */
.connect_popup_right {
  background: radial-gradient(circle at top, #3a2616, #0c0c0c);
  padding: 28px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.connect_popup_brand {
  color: #ff7a1a;
  font-weight: 600;
}

.connect_popup_tagline {
  display: block;
  font-size: 12px;
  color: #9aa3ff;
}

.connect_popup_mascot {
  position: relative;
  text-align: center;
  display: flex;
  align-items: center;
}

.connect_popup_mascot img {
  max-width: 140px;
}

.connect_popup_bubble {
  background: #fff;
  color: #000;
  padding: 10px 14px;
  border-radius: 12px;
  font-size: 13px;
  max-width: 220px;
  margin: 12px auto 0;
}

/* Responsive */
@media (max-width: 768px) {
  .connect_popup_container {
    grid-template-columns: 1fr;
    margin-top: 250px;
  }

  .connect_popup_right {
    padding: 10px;
    /* order: 1; */
  }
  .connect_popup_left {
    /* order: 2; */
  }
  .connect_popup_overlay {
    overflow-y: auto;
  }
  .connect_popup_actions {
    flex-direction: column;
  }
}

/* Overlay */
.connect_popup_overlay_auto {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.75);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}

/* Container */
.connect_popup_container_auto {
  width: 90%;
  max-width: 900px;
  background: linear-gradient(135deg, #0b0b0b, #1a1a1a);
  border-radius: 18px;
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  overflow: hidden;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.6);
}

/* Left */
.connect_popup_left_auto {
  padding: 32px;
  color: #fff;
  position: relative;
}

.connect_popup_close_auto {
  position: absolute;
  top: 16px;
  right: 16px;
  background: none;
  border: none;
  color: #fff;
  font-size: 22px;
  cursor: pointer;
}

.connect_popup_title_auto {
  font-size: 28px;
  margin-bottom: 8px;
}

.connect_popup_subtitle_auto {
  font-size: 14px;
  color: #b5b5b5;
  margin-bottom: 24px;
}

.connect_popup_field_auto {
  margin-bottom: 18px;
}

.connect_popup_field_auto label {
  display: block;
  font-size: 13px;
  margin-bottom: 6px;
  color: #cfcfcf;
}

.connect_popup_field_auto input {
  width: 100%;
  padding: 12px 14px;
  background: #141414;
  border: 1px solid #2a2a2a;
  border-radius: 10px;
  color: #fff;
}

.connect_popup_actions_auto {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 10px;
}

.connect_popup_submit_auto {
  background: #091a84;
  color: #fff;
  border: none;
  padding: 12px 22px;
  border-radius: 30px;
  cursor: pointer;
}

.connect_popup_skip_auto {
  background: none;
  border: none;
  color: #aaa;
  cursor: pointer;
}

.connect_popup_note_auto {
  font-size: 11px;
  color: #888;
  margin-top: 16px;
}

/* Right */
.connect_popup_right_auto {
  background: radial-gradient(circle at top, #3a2616, #0c0c0c);
  padding: 28px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.connect_popup_brand_auto {
  color: #ff7a1a;
  font-weight: 600;
}

.connect_popup_tagline_auto {
  display: block;
  font-size: 12px;
  color: #9aa3ff;
}

.connect_popup_mascot_auto {
  position: relative;
  text-align: center;
  display: flex;
  align-items: center;
}

.connect_popup_mascot_auto img {
  max-width: 140px;
}

.connect_popup_bubble_auto {
  background: #fff;
  color: #000;
  padding: 10px 14px;
  border-radius: 12px;
  font-size: 13px;
  max-width: 220px;
  margin: 12px auto 0;
}

/* Responsive */
@media (max-width: 768px) {
  .connect_popup_container_auto {
    grid-template-columns: 1fr;
    margin-top: 250px;
  }

  .connect_popup_right_auto {
    padding: 10px;
  }

  .connect_popup_overlay_auto {
    overflow-y: auto;
  }

  .connect_popup_actions_auto {
    flex-direction: column;
  }
}

.drc_btn {
  /* Colors & Typography */
  background-color: #f15a22;
  color: #ffffff;

  font-weight: 500;
  font-size: 16px;

  /* Sizing & Shape */
  padding: 6px 30px;
  border-radius: 20px;
  cursor: pointer;

  /* Border Logic (Prevents webpage movement) */
  border: 2px solid transparent;

  /* Smooth Transition */
  transition: all 0.3s ease-in-out;
  display: inline-block;
  outline: none;
}

.drc_btn:hover {
  background-color: transparent; /* "None" as requested */
  border-color: #f15a22;
  color: #ffffff; /* Remains white as requested */
}

/* Section */
.chatur_pillar_section {
  background: #000;
  padding: 60px 24px 80px;
  overflow: hidden;
}

.chatur_pillar_container {
  max-width: 1400px;
  margin: 0 auto;
}

/* Header */
.chatur_pillar_header h2 {
  font-size: 56px;
  font-weight: 500;
  color: #fff;
  margin-bottom: 14px;
}

.chatur_pillar_header span {
  color: #f15a22;
}

.chatur_pillar_header p {
  max-width: 560px;
  font-size: 18px;
  color: #cfcfcf;
  margin-bottom: 70px;
}

/* ===== PILLAR ROW ===== */
.chatur_pillar_row {
  display: flex;
  gap: 10px;
  align-items: center;
  max-width: 100%;
  justify-content: center;
  margin: 0 auto 70px;
}

/* ===== PILLAR ===== */
.chatur_pillar_card {
  width: 230px;
  gap: 10px; /* narrow */
  height: max-content; /* tall */
  padding: 28px 10px 0;
  border-radius: 26px;
  background:
    radial-gradient(circle at top, rgba(229, 94, 0, 0.18), transparent 55%),
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.06),
      rgba(255, 255, 255, 0.02)
    );
  border: 1px solid rgba(255, 255, 255, 0.14);
  backdrop-filter: blur(14px);

  display: flex;
  flex-direction: column;
  justify-content: flex-end;

  opacity: 0;
  transform: translateY(120px);
  transition:
    transform 0.9s cubic-bezier(0.22, 0.61, 0.36, 1),
    opacity 0.9s ease;
}

/* Visible State */
.chatur_pillar_card.is_visible {
  opacity: 1;
  transform: translateY(0);
}

/* Visual */
.chatur_pillar_visual {
  height: 200px;
  margin-bottom: auto;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.05);
}

.chatur_pillar_visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 18px;
}

/* Text */
.chatur_pillar_card h3 {
  font-size: 24px;
  font-weight: 500;
  color: #fff;
  margin-bottom: 5px;
}

.chatur_pillar_card p {
  font-size: 14px;
  line-height: 1.6;
  color: #dcdcdc;
}

/* Accent Letters */
.pillar_letter {
  font-size: 38px;
}

.pillar_letter.d {
  color: #f15a22;
}
.pillar_letter.r {
  color: #097084;
}
.pillar_letter.e {
  color: #f4c430;
}
.pillar_letter.a {
  color: #5c5dff;
}
.pillar_letter.m {
  color: #028d0e;
}
.pillar_letter.s {
  color: #ff8a00;
}

/* Responsive */
@media (max-width: 1200px) {
  .chatur_pillar_row {
    overflow-x: auto;
    padding-bottom: 20px;
  }
}

@media (max-width: 640px) {
  .chatur_pillar_header h2 {
    font-size: 36px;
  }
}

/* Wrapper */
.jb-lang-wrap {
  position: relative;
}

/* Arrow */
.jb-lang-arrow {
  font-size: 30px;
  position: absolute;
  opacity: 1;
}

/* Dropdown */
.jb-lang-dropdown {
  position: absolute;
  top: 130%;
  left: 0;
  min-width: 150px;
  background: rgba(15, 15, 15, 0.95);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 10px;
  backdrop-filter: blur(14px);
  padding: 6px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: all 0.25s ease;
  z-index: 1000;
}

/* Show on hover */
.jb-lang-wrap:hover .jb-lang-dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

/* Options */
.jb-lang-option {
  display: block;
  padding: 10px 12px;
  font-size: 14px;
  color: #e6e6e6;
  border-radius: 6px;
  text-decoration: none;
  transition:
    background 0.2s ease,
    color 0.2s ease;
}

.jb-lang-option:hover {
  background: rgba(229, 94, 0, 0.15);
  color: #f15a22;
}

/* Active language */
.jb-lang-option.active {
  color: #f15a22;
  font-weight: 500;
}

.dc-life-section {
  padding: 0px 0px 80px;
}

.dc-life-container {
  max-width: 1200px;
  margin: 0 auto;
}

/* Header */
.dc-life-header {
  text-align: left;
  max-width: 720px;
  margin: 0 60px 0 0;
}

.dc-life-header h2 {
  font-size: 56px;
  font-weight: 500;
  color: #fff;
  margin-bottom: 14px;
}

.dc-life-header h2 span {
  color: #f15a22;
  font-weight: 600;
}

.dc-life-header p {
  font-size: 17px;
  line-height: 1.6;
  color: #eee;
}

/* Cards Grid */
.dc-life-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
}

/* Card */
.dc-life-card {
  width: 100%;
  height: 450px; /* Set a fixed height for all cards */
  overflow: hidden;
  border-radius: 12px; /* Optional: adds a nice rounded look */
  transition:
    transform 0.35s ease,
    box-shadow 0.35s ease;
}

.dc-life-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.dc-life-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.12);
}

/* Responsive */
@media (max-width: 992px) {
  .dc-life-cards {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 640px) {
  .dc-life-header h2 {
    font-size: 32px;
  }

  .dc-life-cards {
    grid-template-columns: 1fr;
  }
}

/* Swiper nav buttons */
.dcLife-next,
.dcLife-prev {
  width: 44px;
  height: 44px;
  background: #111;
  border: 1px solid #f15a22;
  border-radius: 50%;
  color: #fff;
}

.dcLife-next::after,
.dcLife-prev::after {
  font-size: 16px;
  font-weight: bold;
}

.dcLife-next:hover,
.dcLife-prev:hover {
  background: #f15a22;
  color: #fff;
}

/* Lightbox */
.dcLife-lightbox {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.9);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}

.dcLife-lightbox img {
  max-width: 90%;
  max-height: 85%;
  border-radius: 12px;
}

.dcLife-close {
  position: absolute;
  top: 30px;
  right: 40px;
  font-size: 28px;
  color: #fff;
  cursor: pointer;
}

/* Responsive */
@media (max-width: 768px) {
  .dc-life-card img {
    height: 260px;
  }
}

@media (max-width: 600px) {
  .dcLife-next,
  .dcLife-prev {
    display: none;
  }
}

.dc-career-openings-section {
  padding: 50px 0px;
}

.dc-career-openings-container {
  max-width: 1200px;
  margin: 0 auto;
}

/* Grid */
.dc-career-openings-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: center;
}

/* Image */
.dc-career-openings-image {
  border-radius: 20px;
  overflow: hidden;
}

.dc-career-openings-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Content */
.dc-career-openings-content h2 {
  font-size: 52px;
  font-weight: 500;
  color: #ccc;
  margin-bottom: 18px;
}

.dc-career-openings-content h2 span {
  color: #f15a22;
}

.dc-career-openings-content p {
  font-size: 17px;
  line-height: 1.65;
  color: #eee;
  max-width: 520px;
  margin-bottom: 34px;
}

/* Buttons */
.dc-career-openings-actions {
  display: flex;
  gap: 18px;
  flex-wrap: wrap;
}

.dc-btn-primary {
  padding: 14px 28px;
  background: #f15a22;
  color: #fff;
  font-size: 15px;
  border-radius: 30px;
  text-decoration: none;
  transition: all 0.3s ease;
}

.dc-btn-primary:hover {
  background: #d94f1d;
  transform: translateY(-2px);
}

.dc-btn-secondary {
  padding: 14px 28px;
  border: 1.5px solid #f15a22;
  color: #f15a22;
  font-size: 15px;
  border-radius: 30px;
  text-decoration: none;
  transition: all 0.3s ease;
}

.dc-btn-secondary:hover {
  background: #f15a22;
  color: #fff;
  transform: translateY(-2px);
}

/* Responsive */
@media (max-width: 992px) {
  .dc-career-openings-grid {
    grid-template-columns: 1fr;
    gap: 50px;
  }

  .dc-career-openings-content h2 {
    font-size: 34px;
  }
}

@media (max-width: 640px) {
  .dc-career-openings-content h2 {
    font-size: 28px;
  }

  .dc-career-openings-actions {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* Container */
.dc-nav-actions {
  display: flex;
  gap: 8px;
}

/* Wrapper */
.dc-dd-wrapper {
  position: relative;
}

/* Main dropdown */
.dc-dd-menu {
  position: absolute;
  top: 110%;
  left: calc(20px - 11vh);
  min-width: 220px;
  background: #15171c;
  border-radius: 10px;
  padding: 8px 0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: all 0.25s ease;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.45);
  z-index: 100;
}

/* Show on hover */
.dc-dd-wrapper:hover > .dc-dd-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

/* Links */
.dc-dd-link {
  display: block;
  padding: 10px 16px;
  font-size: 14px;
  color: #c2c5cc;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
}

.dc-dd-link:hover {
  background: rgba(229, 94, 0, 0.12);
  color: #e55e00;
}

/* Submenu wrapper */
.dc-dd-sub-wrapper {
  position: relative;
}

/* Arrow indicator */
.dc-dd-has-sub::after {
  content: "›";
  float: right;
  font-size: 16px;
  opacity: 0.6;
}

/* Submenu */
.dc-dd-submenu {
  position: absolute;
  top: 0;
  right: 100%;
  min-width: 220px;
  background: #15171c;
  border-radius: 10px;
  padding: 8px 0;
  opacity: 0;
  visibility: hidden;
  transform: translateX(8px);
  transition: all 0.25s ease;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.45);
}

/* Show submenu on hover */
.dc-dd-sub-wrapper:hover > .dc-dd-submenu {
  opacity: 1;
  visibility: visible;
  transform: translateX(0);
}

.jb-header-right {
  display: flex;
  align-items: center;
}

.pl-field {
  width: 100%;
  max-width: 420px;
}

.pl-input-wrap {
  display: flex;
  align-items: center;
  background: #0d0d0d;
  border: 1px solid #2a2f3a;
  border-radius: 10px;
  padding: 10px 14px;
  margin-bottom: 16px;
  transition:
    border 0.25s ease,
    box-shadow 0.25s ease;
}

.pl-input-wrap:focus-within {
  border-color: #fff;
  box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.25);
}
/* Amount input */
.pl-amount-input {
  width: 100%;
  background: transparent;
  border: none;
  outline: none;
  color: #f9fafb;
  font-size: 16px;
  font-weight: 500;
}

/* Remove number arrows */
.pl-amount-input::-webkit-outer-spin-button,
.pl-amount-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.pl-amount-input[type="number"] {
  -moz-appearance: textfield;
}

/* Range slider */
#pl-amount {
  width: 100%;
  accent-color: #6366f1;
  cursor: pointer;
}

/* container positioning */
.chatur-dropdown {
  position: relative;
  display: inline-block;
}

/* dropdown box */
.chatur-menu {
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 240px;

  background: #0d0d0d;
  border: 1px solid #0d0d0d;
  border-radius: 12px;

  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);

  opacity: 0;
  transform: translateY(10px);
  pointer-events: none;

  transition: all 0.25s ease;
  z-index: 50;
}

/* show on hover */
.chatur-dropdown:hover .chatur-menu {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

/* dropdown items */
.chatur-item {
  display: block;
  padding: 12px 16px;
  color: #e5e7eb;
  text-decoration: none;
  font-size: 14px;

  transition:
    background 0.2s ease,
    color 0.2s ease;
}

/* hover effect */
.chatur-item:hover {
  background: #000;
  color: #ffffff;
}

/* first & last radius fix */
.chatur-item:first-child {
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
}

.chatur-item:last-child {
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
}

.dcLife-caption {
  position: absolute;
  bottom: 40px;
  left: 50%;
  transform: translateX(-50%);
  padding: 10px 20px 0;
  background: #000000b5;
  text-align: center;
  border-radius: 20px;
  color: #fff;
  max-width: 80%;
}

.dcLife-caption h3 {
  font-size: 28px;
  font-weight: 600;
  margin-bottom: 6px;
}

.dcLife-caption p {
  font-size: 15px;
  color: #ddd;
}

/* Modal root */
.dc-career-modal {
  position: fixed;
  inset: 0;
  display: none;
  z-index: 9999;
}

/* Show modal */
.dc-career-modal.dc-show {
  display: block;
}

/* Overlay */
.dc-career-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.7);
  backdrop-filter: blur(6px);
}

/* Dialog */
.dc-career-dialog {
  position: relative;
  max-width: 480px;
  margin: 10px auto;
  background: #0f1115;
  border-radius: 18px;
  padding: 32px;
  color: #fff;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.6);
}

/* Close button */
.dc-career-x {
  position: absolute;
  top: 14px;
  right: 16px;
  background: none;
  border: none;
  color: #aaa;
  font-size: 22px;
  cursor: pointer;
}

/* Title */
.dc-career-title {
  font-size: 28px;
  margin-bottom: 8px;
}

.dc-career-sub {
  color: #a1a6ad;
  font-size: 14px;
  margin-bottom: 22px;
}

/* Labels */
.dc-career-label {
  font-size: 13px;
  color: #c2c5cc;
  display: block;
  margin-bottom: 6px;
}

/* Inputs */
.dc-career-input {
  width: 100%;
  background: #14161b;
  border: 1px solid #242730;
  border-radius: 12px;
  padding: 14px;
  color: #fff;
  margin-bottom: 16px;
  font-size: 14px;
}

.dc-career-input:focus {
  outline: none;
  border-color: #e55e00;
}

/* Actions */
.dc-career-actions {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 8px;
}

/* Submit */
.dc-career-submit {
  background: #e55e00;
  border: none;
  color: #fff;
  padding: 14px 22px;
  border-radius: 28px;
  font-weight: 600;
  cursor: pointer;
}

/* Cancel */
.dc-career-cancel {
  background: none;
  border: none;
  color: #a1a6ad;
  cursor: pointer;
}

/* Note */
.dc-career-note {
  font-size: 12px;
  color: #7b8088;
  margin-top: 16px;
}

/* Responsive */
@media (max-width: 520px) {
  .dc-career-dialog {
    margin: 20px;
    padding: 24px;
  }

  .dc-career-title {
    font-size: 22px;
  }
}

.dc-ambition-section {
  padding: 40px 0 80px;
}

.dc-ambition-container {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 20px;
}

/* Header */
.dc-ambition-header {
  max-width: 680px;
  margin-bottom: 40px;
}

.dc-ambition-title {
  font-size: 40px;
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 16px;
}

.dc-ambition-title span {
  color: #e55e00;
}

.dc-ambition-desc {
  font-size: 16px;
  line-height: 1.7;
  color: #c2c5cc;
}

/* Swiper cards */
.dc-ambition-card {
  background: #141414;
  border-radius: 18px;
  padding: 28px;
  height: 100%;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.45);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.dc-ambition-review {
  font-size: 16px;
  line-height: 1.7;
  color: #e6e9ee;
  margin-bottom: 18px;
}

.dc-ambition-author {
  font-size: 13px;
  color: #9aa0a6;
}

/* Swiper spacing fix */
.dc-ambition-swiper {
  padding-bottom: 10px;
}

.dc-ambition-logo {
  display: inline-block;
  margin-bottom: 18px;
}

.dc-ambition-logo img {
  height: 60px;
  width: auto;

  object-fit: contain;
  opacity: 0.85;
  transition: 0.3s ease;
}

.dc-ambition-logo img:hover {
  opacity: 1;
  transform: scale(1.05);
}

/* Responsive */
@media (max-width: 768px) {
  .dc-ambition-title {
    font-size: 30px;
  }

  .dc-ambition-desc {
    font-size: 15px;
  }
}

.dc-career2-modal {
  position: fixed;
  inset: 0;
  display: none;
  z-index: 9999;
}

.dc-career2-modal.dc-show {
  display: block;
}

/* Overlay */
.dc-career2-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.7);
  backdrop-filter: blur(6px);
}

/* Dialog */
.dc-career2-dialog {
  position: relative;
  width: 90%;
  max-width: 1100px;
  margin: 00px auto;
  background: #0f1115;
  border-radius: 20px;
  overflow: hidden;
  display: grid;
  grid-template-columns: 1fr 1fr;
  box-shadow: 0 40px 100px rgba(0, 0, 0, 0.6);
}

/* LEFT */
.dc-career2-left {
  padding: 40px;
  color: #fff;
  position: relative;
}

.dc-career2-x {
  position: absolute;
  top: 16px;
  right: 18px;
  background: none;
  border: none;
  color: #aaa;
  font-size: 22px;
  cursor: pointer;
}

.dc-career2-title {
  font-size: 32px;
  margin-bottom: 8px;
}

.dc-career2-sub {
  color: #a1a6ad;
  margin-bottom: 24px;
}

/* Inputs */
.dc-career2-label {
  font-size: 13px;
  color: #c2c5cc;
  display: block;
  width: 10%;
  margin-bottom: 6px;
}

.dc-career2-input {
  width: 80%;
  background: #14161b;
  border: 1px solid #242730;
  border-radius: 12px;
  padding: 14px;
  color: #fff;
  margin-bottom: 16px;
}

.dc-career2-input:focus {
  outline: none;
  border-color: #e55e00;
}

/* Actions */
.dc-career2-actions {
  display: flex;
  gap: 16px;
  align-items: center;
}

.dc-career2-submit {
  background: #e55e00;
  border: none;
  color: #fff;
  padding: 10px 24px;
  border-radius: 30px;
  font-weight: 600;
  cursor: pointer;
}

.dc-career2-cancel {
  background: none;
  border: none;
  color: #a1a6ad;
  cursor: pointer;
}

.dc-career2-note {
  font-size: 12px;
  color: #7b8088;
  margin-top: 14px;
}

/* RIGHT PANEL */
.dc-career2-right {
  background: linear-gradient(180deg, #3a1f10, #0b0b0c);
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.dc-career2-logo {
  position: absolute;
  top: 30px;
  left: 40px;
  width: 220px;
}

.dc-career2-chatbox {
  background: #fff;
  color: #000;
  padding: 16px 18px;
  border-radius: 16px;
  max-width: 240px;
  position: absolute;
  bottom: 120px;
  right: 210px;
  font-size: 14px;
}

.dc-career2-avatar {
  position: absolute;
  bottom: 0;
  right: 40px;
  width: 180px;
}

/* Responsive */
@media (max-width: 900px) {
  .dc-career2-dialog {
    grid-template-columns: 1fr;
  }

  .dc-career2-right {
    display: none;
  }

  .dc-career2-left {
    padding: 28px;
  }

  .dc-career2-title {
    font-size: 26px;
  }
}

.curr-div {
  display: flex;
  align-items: center;
  gap: 20px;
}

.fk-file-label {
  display: block;
  font-size: 13px;
  margin-bottom: 14px;
  color: #c2c5cc;
}

.fk-file-label input {
  margin-top: 6px;
  padding: 10px;
  background: #111;
  border: 1px dashed #444;
  cursor: pointer;
}

.chatur-scroll-wrapper {
  padding: 100px 0 0px;
  overflow: hidden;
  color: #f8fafc;
}

.chatur-scroll-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
  position: relative;
}

.chatur-scroll-header {
  text-align: center;
  margin-bottom: 0px;
}

.chatur-scroll-header h2 {
  font-size: 2.75rem;
  font-weight: 500;
  color: #ffffff;
  margin-bottom: 20px;
}

.chatur-scroll-header h2 span {
  color: #f15a22; /* Requested Brand Color */
  font-weight: 600;
}

.chatur-scroll-header p {
  color: #929292;
  max-width: 650px;
  margin: 0 auto;
  line-height: 1.7;
  font-size: 1.1rem;
}

/* The Interactive Orbit Area */
.chatur-orbit-viewport {
  height: 600px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.chatur-orbit-center {
  position: relative;
  width: 200px; /* Even smaller logo for tighter look */
  height: 200px;
  z-index: 0; /* Lower than nodes so text can overlap if needed */
}
.chatur-center-image-container {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: #000;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid #334155;
  overflow: hidden;
  box-shadow: 0 0 30px rgba(241, 90, 34, 0.1);
  transition: transform 0.6s cubic-bezier(0.2, 0, 0.2, 1);
}

.chatur-center-image-container img {
  width: 70%;
  height: 70%;
  object-fit: contain;
}

/* Letters Orbit - Reduced width/height to bring letters closer */
.chatur-orbit-ring {
  position: absolute;
  width: 320px;
  height: 320px;
  border: 1px dashed rgba(241, 90, 34, 1);
  border-radius: 50%;
  transition: transform 0.1s linear;
}

.chatur-pillar-node {
  position: absolute;
  width: 60px;
  height: 60px;
  margin-left: -30px;
  margin-top: -30px;
  cursor: pointer;
  z-index: 20;
}

/* Ensure active/hovered node is above everything including center logo */
.chatur-pillar-node:hover {
  z-index: 100;
}

.chatur-node-circle {
  width: 100%;
  height: 100%;
  background: #000;
  border: 2px solid #f15a22;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 1.5rem;
  color: #f15a22;
  box-shadow: 0 0 15px rgba(241, 90, 34, 0.2);
  transition:
    background 0.3s ease,
    color 0.3s ease,
    box-shadow 0.3s ease;
}

.chatur-pillar-node:hover .chatur-node-circle {
  background: #f15a22;
  color: #ffffff;
  box-shadow: 0 0 25px rgba(241, 90, 34, 0.6);
}

.chatur-node-content {
  position: absolute;
  width: 240px;
  background: rgba(2, 6, 23, 0.95);
  padding: 16px;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.6);
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 0.3s ease,
    visibility 0.3s ease,
    transform 0.3s ease;
  pointer-events: none;
  left: 50%;
  top: 100%; /* Positioned relative to node */
  transform: translateX(-50%) translateY(10px);
  text-align: center;
  border: 1px solid rgba(241, 90, 34, 0.4);
  z-index: 110; /* Highest priority */
  backdrop-filter: blur(8px);
}

.chatur-pillar-node:hover .chatur-node-content {
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(15px);
}

.chatur-node-content h4 {
  font-weight: 700;
  color: #ffffff;
  margin: 0 0 6px 0;
  font-size: 1.1rem;
}

.chatur-node-content p {
  font-size: 0.85rem;
  color: #cbd5e1;
  line-height: 1.4;
  margin: 0;
}

@media (max-width: 768px) {
  .chatur-orbit-ring {
    width: 260px;
    height: 260px;
  }
  .chatur-orbit-viewport {
    height: 500px;
  }
  .chatur-node-content {
    width: 180px;
  }
}
/* SECTION */
.wmjd-sec {
  background: #000;
  color: #fff;
  padding: 120px 20px;
}

/* CONTAINER */
.wmjd-wrap {
  max-width: 1200px;
  margin: auto;
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 40px;
}

/* LEFT */
.wmjd-heading {
  font-size: 40px;
  margin-bottom: 20px;
}

.wmjd-sub {
  color: #fff;
  margin-bottom: 16px;
  font-size: 16px;
}

.wmjd-para {
  color: #aaa;
  line-height: 1.7;
  margin-bottom: 20px;
}

.wmjd-ol li {
  margin-bottom: 16px;
}

.wmjd-ol ul {
  margin-top: 8px;
  padding-left: 18px;
  color: #bbb;
}

/* RIGHT FORM */
.wmjd-right {
  background: #111;
  padding: 30px;
  border-radius: 16px;
  border: 1px solid #222;
}

.wmjd-form-title {
  margin-bottom: 20px;
  font-size: 22px;
}

/* INPUTS */
.wmjd-input {
  width: 100%;
  padding: 12px 14px;
  margin-bottom: 14px;
  background: #000;
  border: 1px solid #333;
  color: #fff;
  border-radius: 8px;
  outline: none;
  font-size: 14px;
}

.wmjd-input:focus {
  border-color: #666;
}

/* SUBMIT BUTTON WRAPPER */
.wmjd-submit {
  width: 100%;
  margin-top: 10px;
}

#sub_app {
  width: max-content;
  display: flex;
  margin: auto;
}

/* RESPONSIVE */
@media (max-width: 900px) {
  .wmjd-wrap {
    grid-template-columns: 1fr;
  }

  .wmjd-heading {
    font-size: 32px;
  }
}

.hero_img {
  position: relative;
  border-radius: 20px;
  z-index: 10;
}

.jb-site-wrapper {
  box-sizing: border-box;
  margin: 0;
  padding: 130px 20px 80px;

  background-color: #000000;
  color: #ffffff;
  line-height: 1.6;
}

.jb-main-container {
  max-width: 1100px;
  margin: 0 auto;
}

.jb-page-heading {
  font-size: 56px;
  font-weight: 700;
  margin-bottom: 30px;
  color: #ffffff;
}

.jb-accent-text {
  color: #f15a22;
}

.jb-layout-grid {
  display: grid;
  grid-template-columns: 320px 1fr;
  gap: 30px;
  align-items: start;
}

/* Sidebar Filter Styles */
.jb-filter-sidebar {
  background-color: #0a0a0a;
  border: 1px solid #222222;
  border-radius: 16px;
  padding: 24px;
  position: sticky;
  top: 20px;
}

.jb-filter-header-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 25px;
}

.jb-filter-main-label {
  font-size: 20px;
  font-weight: 600;
}

.jb-btn-reset-filters {
  color: #f15a22;
  text-decoration: none;
  font-size: 14px;
  background: none;
  border: none;
  cursor: pointer;
}

/* Dropdown Components */
.jb-filter-section-group {
  border-bottom: 1px solid #1a1a1a;
}

.jb-filter-collapse-trigger {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 18px 0;
  background: none;
  border: none;
  color: #ffffff;
  font-size: 16px;
  font-weight: 500;
  cursor: pointer;
  text-align: left;
}

.jb-trigger-status-info {
  font-size: 13px;
  color: #eee;
  display: flex;
  align-items: center;
  gap: 8px;
}

/* Smooth Expand Logic */
.jb-expandable-box {
  max-height: 0;
  overflow: hidden;
  transition:
    max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1),
    padding 0.3s ease;
}

.jb-expandable-box.jb-is-expanded {
  max-height: 1200px;
  padding-bottom: 15px;
}

/* Nested Hierarchy */
.jb-nested-category {
  margin-bottom: 5px;
}

.jb-nested-category-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 12px;
  border-radius: 8px;
  cursor: pointer;
  color: #eee;
  transition:
    background 0.2s,
    color 0.2s;
  font-size: 14px;
}

.jb-nested-category-header:hover {
  background: #151515;
  color: #ffffff;
}

.jb-nested-category-header.jb-active-toggle {
  color: #f15a22;
}

.jb-nested-list-options {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease-out;
  padding-left: 15px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.jb-nested-list-options.jb-show-options {
  max-height: 400px;
  padding-top: 8px;
  padding-bottom: 10px;
}

.jb-checkbox-row {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #888888;
  font-size: 13px;
  padding: 4px 0;
  cursor: pointer;
}

.jb-checkbox-row:hover {
  color: #ffffff;
}

.jb-checkbox-row input {
  accent-color: #f15a22;
}

/* Salary Section */
.jb-salary-filter-area {
  padding-top: 20px;
}

.jb-salary-field-label {
  font-size: 14px;
  color: #888888;
  margin-bottom: 12px;
}

.jb-salary-dropdown-stack {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.jb-salary-input-select {
  background-color: #111111;
  border: 1px solid #333333;
  color: #ffffff;
  padding: 12px;
  border-radius: 10px;
  width: 100%;
  outline: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 256 256'%3E%3Cpath d='M213.66,101.66l-80,80a8,8,0,0,1-11.32,0l-80-80a8,8,0,0,1,11.32-11.32L128,164.69l74.34-74.35a8,8,0,0,1,11.32,11.32Z'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 14px;
}

.jb-btn-search-submit {
  width: 100%;
  margin-top: 30px;
  background: #f15a22;

  color: #ffff;
  padding: 14px;
  border-radius: 30px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.3s;
}

.jb-btn-search-submit:hover {
  background-color: transparent;
  color: #ffffff;
  border: 2px solid #f15a22;
}

/* Job Cards Area */
.jb-job-result-card {
  background-color: #0a0a0a;
  border: 1px solid #222222;
  border-radius: 16px;
  padding: 30px;
  margin-bottom: 25px;
}

.jb-job-title-text {
  font-size: 22px;
  font-weight: 500;
  margin-bottom: 15px;
}

.jb-job-meta-row {
  display: flex;
  gap: 20px;
  color: #ccc;
  font-size: 14px;
  margin-bottom: 20px;
}

.jb-meta-item {
  display: flex;
  align-items: center;
  gap: 6px;
}

.jb-job-summary-text {
  color: #eee;
  font-size: 16px;
  line-height: 1.7;
  margin-bottom: 20px;
}

.jb-job-bullet-list {
  list-style: none;
  margin-bottom: 25px;
  padding-left: 0;
}

.jb-job-bullet-list li {
  position: relative;
  padding-left: 20px;
  color: #dddddd;
  margin-bottom: 8px;
  font-size: 16px;
}

.jb-job-bullet-list li::before {
  content: "•";
  position: absolute;
  left: 0;
  color: #f15a22;
}

.jb-job-card-actions {
  display: flex;
  justify-content: flex-end;
  gap: 15px;
}

.jb-btn-save-action {
  background: transparent;
  border: 1px solid #333333;
  color: #ffffff;
  padding: 10px 24px;
  border-radius: 30px;
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}

.jb-btn-view-details {
  background-color: #003366;
  color: #ffffff;
  border: none;
  padding: 10px 24px;
  border-radius: 30px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
  cursor: pointer;
}

/* Responsive Breakpoints */
@media (max-width: 900px) {
  .jb-layout-grid {
    grid-template-columns: 1fr;
  }
  .jb-filter-sidebar {
    position: static;
  }
}

.jb-det-site-reset {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.jb-det-wrapper {
  background-color: #000000;
  color: #ffffff;
  line-height: 1.6;
  min-height: 100vh;
}

/* Top Nav Area */
.jb-det-top-nav-container {
  background-color: #002b5c;
  padding: 12px 40px;
  display: flex;
  align-items: center;
}

.jb-det-back-link {
  color: #ffffff;
  text-decoration: none;
  font-size: 14px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 500;
}

/* Layout Grid */
.jb-det-main-grid-layout {
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 380px;
  gap: 30px;
  padding: 80px 0px 60px 0px;
}

/* Left Side Container */
.jb-det-left-column {
  display: flex;
  flex-direction: column;
  position: relative; /* Context for children */
}

/* Title Area */
.jb-det-title-area {
  margin-bottom: 30px;
}

.jb-det-job-title-h1 {
  font-size: 36px;
  font-weight: 600;
  margin: 0 0 15px 0;
  color: #f15a22;
}

.jb-det-meta-row {
  display: flex;
  gap: 25px;
  font-size: 16px;
  font-weight: 500;
}

.jb-det-meta-item {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #eee;
}

.jb-det-meta-item i {
  color: #f15a22;
}

/* Primary Content Box */
.jb-det-primary-content-box {
  background-color: #0a0a0a;
  border: 1px solid #222222;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
  padding: 40px;
}

/* Sticky Action Bar contained within the left column */
.jb-det-sticky-action-container {
  position: sticky;
  bottom: 0;
  background-color: #0a0a0a;
  border: 1px solid #222222;
  border-top: 1px solid #333;
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
  padding: 20px 40px;
  display: flex;
  gap: 15px;
  z-index: 10;
  justify-content: space-between;
  margin-top: -1px; /* Overlap border to look like one piece */
}

.jb-det-section-heading {
  font-size: 22px;
  font-weight: 600;
  color: #f15a22;
  margin: 30px 0 15px 0;
}

.jb-det-section-heading:first-of-type {
  margin-top: 0;
}

.jb-det-para-text {
  color: #cccccc;
  font-size: 16px;
  margin-bottom: 20px;
}

.jb-det-bullet-list {
  list-style: none;
  padding: 0;
  margin-bottom: 25px;
}

.jb-det-bullet-list li {
  position: relative;
  padding-left: 25px;
  color: #dddddd;
  margin-bottom: 12px;
  font-size: 16px;
}

.jb-det-bullet-list li::before {
  content: "•";
  position: absolute;
  left: 0;
  color: #f15a22;
  font-weight: bold;
}

/* Sidebar Column */
.jb-det-sidebar-column {
  display: flex;
  flex-direction: column;
  gap: 25px;
}

.jb-det-widget-card {
  background-color: #0a0a0a;
  border: 1px solid #222222;
  border-radius: 20px;
  padding: 30px;
}

.jb-det-widget-card-title {
  font-size: 20px;
  font-weight: 600;
  color: #f15a22;
  margin-bottom: 15px;
}

.jb-det-widget-info-text {
  color: #eee;
  font-size: 16px;
  margin-bottom: 20px;
}

/* Action Buttons */
.jb-det-btn-save {
  background: transparent;
  border: 1.5px solid #333333;
  color: #ffffff;
  padding: 12px 30px;
  border-radius: 30px;
  font-weight: 600;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 8px;
  transition: all 0.3s;
}

.jb-det-btn-save:hover {
  border-color: #f15a22;
  color: #f15a22;
}

.jb-det-btn-apply {
  background-color: #003366;
  color: #ffffff;
  border: none;
  padding: 12px 45px;
  border-radius: 30px;
  font-weight: 600;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 10px;
  transition: all 0.3s;
}

.jb-det-btn-apply:hover {
  background-color: #004080;
}

.jb-det-btn-orange-outline {
  width: 100%;
  background-color: transparent;
  border: 1.5px solid #f15a22;
  color: #f15a22;
  padding: 12px;
  border-radius: 30px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.3s;
}

.jb-det-btn-orange-outline:hover {
  background-color: #f15a22;
  color: #ffffff;
}

/* Recommendation List */
.jb-det-recommend-item {
  padding: 20px 0;
  border-bottom: 1px solid #1a1a1a;
  position: relative;
}

.jb-det-recommend-item:last-child {
  border-bottom: none;
}

.jb-det-recommend-title {
  font-size: 16px;
  font-weight: 500;
  color: #ffffff;
  margin-bottom: 8px;
  padding-right: 30px;
}

.jb-det-recommend-meta {
  font-size: 14px;
  color: #777777;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.jb-det-recommend-meta span {
  display: flex;
  align-items: center;
  gap: 6px;
  color: #eee;
}

.jb-det-btn-fav-icon {
  position: absolute;
  right: 0;
  top: 20px;
  background: none;
  border: none;
  color: #888888;
  cursor: pointer;
  font-size: 18px;
}

/* Responsive */
@media (max-width: 992px) {
  .jb-det-main-grid-layout {
    grid-template-columns: 1fr;
  }
  .jb-det-top-nav-container {
    padding: 12px 20px;
  }
  .jb-det-job-title-h1 {
    font-size: 28px;
  }
  .jb-det-sticky-action-container {
    padding: 15px 20px;
    justify-content: center;
  }
}

.hsse_job_portal_wrapper {
  background-color: #000000;
  min-height: 100vh;
  
  padding: 20px;
  color: #ffffff;
}

.hsse_nav_back {
  display: flex;
  align-items: center;
  color: #ffffff;
  text-decoration: none;
  font-size: 14px;
  margin-bottom: 40px;
  gap: 8px;
  transition: color 0.2s;
}

.hsse_nav_back:hover {
  color: #f15a22;
}

.hsse_header_section {
  margin: 0 auto 30px auto;
}

.hsse_job_title {
  font-size: 32px;
  font-weight: 700;
  margin-bottom: 15px;
}

.hsse_job_meta {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  font-size: 14px;
}

.hsse_meta_item {
  display: flex;
  align-items: center;
  gap: 6px;
}

.hsse_application_card {
  margin: 0 auto;
  background-color: #111111;
  border: 1px solid #222222;
  border-radius: 24px;
  padding: 40px;
  color: #ffffff;
}

/* Stepper Logic */
.hsse_stepper_container {
  display: flex;
  justify-content: space-between;
  position: relative;
  margin-bottom: 50px;
  padding: 0 40px;
}

.hsse_stepper_line {
  position: absolute;
  top: 15px;
  left: 10%;
  right: 10%;
  height: 1px;
  background-color: #333333;
  z-index: 1;
}

.hsse_step_item {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 120px;
}

.hsse_step_circle {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 600;
  background-color: #000000;
  border: 1px solid #333333;
  margin-bottom: 10px;
  color: #666666;
}

.hsse_step_item.active .hsse_step_circle {
  background-color: #f15a22;
  color: #ffffff;
  border-color: #f15a22;
}

.hsse_step_label {
  font-size: 12px;
  text-align: center;
  color: #666666;
  font-weight: 500;
}

.hsse_step_item.active .hsse_step_label {
  color: #f15a22;
}

.hsse_content_body {
  padding: 0 10px;
}

.hsse_main_question {
  font-size: 28px;
  font-weight: 500;
  color: #ffffff;
  margin-bottom: 30px;
}

.hsse_actions_row {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
}

/* Use drc_btn class for common project styling */
.drc_btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 12px 24px;
  border-radius: 50px;
  font-weight: 600;
  font-size: 15px;
  cursor: pointer;
  transition: all 0.2s ease;
  text-decoration: none;
  min-width: 200px;
}

.hsse_btn_outline {
  background: transparent;
  color: #ffffff;
  border: 1px solid #333333;
}

.hsse_btn_outline:hover {
  border-color: #f15a22;
  color: #f15a22;
}

.hsse_btn_linkedin {
  background: #0077b5;
  color: #ffffff;
  border: none;
}

.hsse_btn_linkedin:hover {
  background: #005a8a;
  transform: translateY(-2px);
}

/* Responsive Adjustments */
@media (max-width: 768px) {
  .hsse_stepper_container {
    padding: 0;
  }
  .hsse_stepper_line {
    display: none;
  }
  .hsse_step_item {
    width: auto;
  }
  .hsse_application_card {
    padding: 25px 15px;
  }
  .hsse_main_question {
    font-size: 22px;
  }
  .hsse_actions_row {
    flex-direction: column;
  }
  .drc_btn {
    width: 100%;
  }
}

/* Full width container for the About Us block */
.luxury-about-full-section {
  width: 100%;
  position: relative;
  background-color: #1a1d21; /* Dark theme background */
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  /* Height follows image proportions */
  min-height: 450px;
}

/* Decorative panel lines spanning across the background - Full Width */
.luxury-wall-molding {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: space-between;
  pointer-events: none;
  padding: 60px 0;
  z-index: 1;
}

/* Individual panel boxes spanning edge to edge */
.luxury-molding-box {
  border: 1px solid rgba(255, 255, 255, 0.05);
  flex: 1;
  margin: 0 10px;
  height: 100%;
}

.luxury-sofa-display {
  position: relative;
  z-index: 2;
  width: 100%;
  /* Takes full viewport width */
  height: 100%;
  min-height: 500px;
  /* Replace with your actual sofa asset */
  background-image: url("../images/career11crop.PNG");
  background-size: cover; /* Changed to cover for full-width edge-to-edge feel */
  background-repeat: no-repeat;
  background-position: center center;
  display: flex;
  align-items: center;
  justify-content: center;
}

.luxury-text-center {
  color: #ffffff;
  font-size: clamp(3rem, 10vw, 6.5rem);

  font-weight: 300;
  margin: 0;
  padding: 0;
  text-shadow: 0 10px 30px rgba(0, 0, 0, 0.6);
  /* Centered overlay exactly like the reference */
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  white-space: nowrap;
  z-index: 3;
}

/* Responsive adjustments */
@media (max-width: 1024px) {
  .luxury-about-full-section {
    min-height: 400px;
  }
  .luxury-sofa-display {
    min-height: 400px;
  }
}

@media (max-width: 768px) {
  .luxury-molding-box:nth-child(n + 3) {
    display: none;
  }
  .luxury-about-full-section {
    min-height: 350px;
  }
  .luxury-sofa-display {
    min-height: 350px;
  }
}

.premium-content-wrapper {
  background-color: #000; /* Deep dark background */
  padding: 60px 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* Breadcrumb Styling */
.premium-breadcrumb-nav {
  width: 100%;
  max-width: 1200px;
  margin-bottom: 40px;
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 0.9rem;
}

.premium-breadcrumb-link {
  color: #888;
  text-decoration: none;
  transition: color 0.3s ease;
}

.premium-breadcrumb-link:hover {
  color: #fff;
}

.premium-breadcrumb-sep {
  color: #444;
}

.premium-breadcrumb-active {
  color: #f15a22; /* Requested highlight color */
  font-weight: 500;
}

/* Decorative Divider */
.premium-section-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 200px;
  margin: 20px 0 40px 0;
}

.premium-divider-line {
  height: 1px;
  background-color: #333;
  flex: 1;
}

.premium-divider-accent {
  height: 3px;
  width: 60px;
  background-color: #f15a22; /* Requested highlight color */
}

/* Content Text Area */
.premium-text-container {
  max-width: 1000px;
  text-align: center;
}

.premium-paragraph {
  color: #b0b0b0;
  line-height: 1.8;
  font-size: 1.15rem;
  margin-bottom: 30px;
  letter-spacing: 0.02em;
}

/* Responsive Design */
@media (max-width: 768px) {
  .premium-content-wrapper {
    padding: 40px 15px;
  }
  .premium-paragraph {
    font-size: 1rem;
  }
}

.differentiator {
  padding: 100px 0;
}

/* General Section Styling */
.diff-section-container {
  padding: 0px 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.diff-header-group {
  margin-bottom: 50px;
}

.diff-header-group .title {
  font-size: 46px;
  text-align: left;
}

.text-highlight {
  color: #f15a22;
}

.diff-header-sub {
  color: #adadad;
  text-transform: uppercase;
  letter-spacing: 2px;
  font-size: 0.85rem;
  margin-bottom: 8px;
  display: block;
}

.diff-header-main {
  color: #fff;
  font-size: 2.5rem;
  text-transform: uppercase;
  letter-spacing: 3px;
  margin-bottom: 15px;
}

.diff-title-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 150px;
  margin: 0 auto;
}

.diff-line {
  height: 1px;
  background-color: #333;
  flex: 1;
}

.diff-accent {
  height: 3px;
  width: 40px;
  background-color: #f15a22; /* Highlight Color */
}

/* Layout Grid */
.diff-main-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;

  width: 100%;
  align-items: start; /* Ensures items start at the top */
}

/* Fixed Height Image Styling */
.diff-image-wrapper {
  position: sticky; /* Optional: keeps image visible as you scroll long accordions */
  top: 20px;
  width: 100%;
  height: 75%; /* Fixed height to prevent jumping */
  /* filter: brightness(1) contrast(1.5); */
  background-image: url("../images/dark_grey.png");
  background-size: cover;
  background-position: center;
  border-radius: 4px;
}

/* Accordion Styling */
.diff-accordion-container {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.diff-accordion-item {
  background-color: #000;
  border: 1px solid #2d3136;
  border-radius: 4px;
  overflow: hidden;
  transition: all 0.3s ease;
}
.diff-accordion-item.active .diff-accordion-content {
  max-height: 500px; /* Needs to be larger than your actual content height */
}

.diff-accordion-item.active {
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3);
}

.diff-accordion-header {
  padding: 20px;
  display: flex;
  align-items: center;
  cursor: pointer;
  user-select: none;
}

.diff-status-icon {
  width: 24px;
  height: 24px;
  border: 2px solid #f15a22;
  border-radius: 50%;
  position: relative;
  margin-right: 15px;
  flex-shrink: 0;
}

/* Plus/Minus using CSS Pseudo-elements */
.diff-status-icon::before,
.diff-status-icon::after {
  content: "";
  position: absolute;
  background-color: #f15a22;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  transition: all 0.3s ease;
}

.diff-status-icon::before {
  width: 12px;
  height: 2px;
}
.diff-status-icon::after {
  width: 2px;
  height: 12px;
}

.active .diff-status-icon::after {
  transform: translate(-50%, -50%) rotate(90deg);
  opacity: 0;
}

.diff-accordion-title {
  color: #ccc;
  font-size: 1.1rem;
  transition: color 0.3s ease;
}

.active .diff-accordion-title {
  color: #f15a22;
}

.diff-accordion-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s cubic-bezier(0, 1, 0, 1);
  background-color: #000;
}

.active .diff-accordion-content {
  max-height: 1000px;
  transition: max-height 0.4s cubic-bezier(1, 0, 1, 0);
}

.diff-content-inner {
  padding: 0 20px 25px 59px;
  color: #999;
  line-height: 1.7;
}

.diff-list {
  list-style: none;
  padding: 0;
  margin: 15px 0 0 0;
}

.diff-list-item {
  position: relative;
  padding-left: 20px;
  margin-bottom: 8px;
}

.diff-list-item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 10px;
  width: 6px;
  height: 6px;
  background-color: #f15a22;
  border-radius: 1px;
}

/* Responsive Adjustments */
@media (max-width: 992px) {
  .diff-main-grid {
    grid-template-columns: 1fr;
  }
  .diff-image-wrapper {
    height: 300px;
    position: static;
  }
}

@media (max-width: 640px) {
  .diff-header-main {
    font-size: 1.8rem;
  }
  .diff-accordion-title {
    font-size: 1rem;
  }
  .diff-content-inner {
    padding: 0 15px 20px 15px;
  }
}

/* Base Section Styling */
.offering-block-root {
  background-color: #000000;
  padding: 80px 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.offering-header-wrap {
  display: flex;
  width: 100%;
  margin-bottom: 60px;
}

.offering-label-top {
  color: #888;
  text-transform: uppercase;
  letter-spacing: 4px;
  font-size: 0.9rem;
  margin-bottom: 5px;
  display: block;
}

.offering-main-heading {
  color: #f15a22; /* Highlighting with your orange shade */
  font-size: clamp(2rem, 5vw, 3rem);
  text-transform: uppercase;
  letter-spacing: 5px;
  margin-bottom: 15px;
}

.offering-divider-box {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 180px;
  margin: 0 auto;
}

.offering-divider-line {
  height: 1px;
  background-color: #333;
  flex: 1;
}

.offering-divider-accent {
  height: 3px;
  width: 50px;
  background-color: #f15a22;
}

/* Grid Layout */
.offering-grid-container {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 30px;

  width: 100%;
}

.offering-card {
  background-color: #0f1113;
  border: 1px solid #1e2124;
  padding: 35px 25px;
  border-radius: 8px;
  transition: all 0.4s ease;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.offering-card:hover {
  border-color: #f15a22;
  transform: translateY(-5px);
  box-shadow: 0 10px 30px rgba(241, 90, 34, 0.1);
}

/* Icon Styling */
.offering-icon-circle {
  width: 70px;
  height: 70px;
  border: 2px solid #f15a22;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
  transition: background-color 0.3s ease;
}

.offering-card:hover .offering-icon-circle {
  background-color: #f15a22;
}

.offering-card svg {
  width: 35px;
  height: 35px;
  stroke: #f15a22;
  transition: stroke 0.3s ease;
}

.offering-card:hover svg {
  stroke: #ffffff;
}

/* Text Styling */
.offering-card-title {
  color: #ffffff;
  font-size: 1.25rem;
  font-weight: 500;
  margin-bottom: 12px;
}

.offering-card-desc {
  color: #999;
  font-size: 0.95rem;
  line-height: 1.6;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .offering-block-root {
    padding: 60px 15px;
  }
  .offering-grid-container {
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  }
}

.lead-section-root {
  background-color: #000000;
  padding: 0px 20px 80px;
  color: #ffffff;

  overflow: hidden;
  position: relative;
}

/* Header Styling */
.lead-header-area {
  /* text-align: center; */
  margin-bottom: 60px;
}

.lead-sub-title {
  color: #888888;
  text-transform: uppercase;
  letter-spacing: 4px;
  font-size: 0.9rem;
  display: block;
  margin-bottom: 8px;
}

.lead-main-title {
  color: #fff; /* Brand Orange */
  font-size: clamp(2rem, 5vw, 4rem);

  margin-left: 80px;
  margin-bottom: 20px;
  margin-top: 0;
}

.lead-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 150px;
  margin: 0 auto;
}

.lead-line {
  height: 1px;
  background-color: #333333;
  flex: 1;
}

.lead-accent {
  height: 3px;
  width: 40px;
  background-color: #f15a22;
}

/* Slider Layout */
.lead-slider-wrapper {
  position: relative;

  margin: 0 auto;
  display: flex;
  align-items: center;
}

.lead-slider-container {
  display: flex;
  transition: transform 0.6s cubic-bezier(0.23, 1, 0.32, 1);
  width: 100%;
}

.lead-member-card {
  min-width: 33.333%;
  padding: 20px 15px;
  box-sizing: border-box;
  text-align: center;
  transition:
    opacity 0.4s ease,
    transform 0.4s ease;
  cursor: pointer;
}

/* Image Box */
.lead-img-box {
  width: 200px;
  height: 200px;
  margin: 0 auto 25px;
  border-radius: 50%;
  border: 2px solid #333333;
  padding: 8px;
  transition: all 0.3s ease;
  position: relative;
}

.lead-member-card:hover .lead-img-box {
  border-color: #f15a22;
  transform: translateY(-5px);
}

.lead-img-box img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}

.lead-name {
  color: #f15a22;
  font-size: 1.4rem;
  margin-bottom: 5px;
  font-weight: 500;
}

.lead-role {
  color: #aaaaaa;
  font-size: 0.9rem;
  line-height: 1.4;
  height: 40px;
  margin: 0;
}

.lead-plus-btn {
  width: 35px;
  height: 35px;
  border: 1px solid #f15a22;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 20px auto 0;
  color: #f15a22;
  font-size: 1.2rem;
  transition: all 0.3s ease;
}

.lead-member-card:hover .lead-plus-btn {
  background-color: #f15a22;
  color: #ffffff;
}

/* Navigation Arrows */
.lead-nav-btn {
  position: absolute;
  top: 40%;
  transform: translateY(-50%);
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid #333333;
  color: #f15a22;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 10;
  transition: all 0.3s ease;
}

.lead-nav-btn:hover {
  background: #f15a22;
  color: #ffffff;
  border-color: #f15a22;
}

.lead-next {
  right: 0px;
}

/* Modal Structure */
.modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.95);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  opacity: 0;
  visibility: hidden;
  transition: all 0.4s ease;
  backdrop-filter: blur(8px);
}

.modal-overlay.open {
  opacity: 1;
  visibility: visible;
}

.modal-content {
  background: #111111;
  width: 90%;
  max-width: 1000px;
  max-height: 90vh;
  border: 1px solid #333333;
  border-radius: 20px;
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: row;
  transform: scale(0.9);
  transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.modal-overlay.open .modal-content {
  transform: scale(1);
}

.modal-close {
  position: absolute;
  top: 20px;
  right: 25px;
  color: #ffffff;
  font-size: 2rem;
  cursor: pointer;
  z-index: 10;
  line-height: 1;
}

.modal-close:hover {
  color: #f15a22;
}

.modal-left {
  flex: 0 0 40%;
  background: #181818;
  padding: 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  border-right: 1px solid #222222;
}

.modal-right {
  flex: 1;
  padding: 30px;
  overflow-y: auto;
  position: relative;
  display: flex;
  /* align-items: center; */
}

.modal-img {
  width: 250px;
  height: 250px;
  border-radius: 50%;
  object-fit: cover;
  border: 4px solid #f15a22;
  margin-bottom: 20px;
}

.modal-name {
  font-size: 1.8rem;
  color: #f15a22;
  margin: 10px 0 5px;
}

.modal-role {
  color: #aaaaaa;
  font-size: 1rem;
  font-weight: 300;
}

.modal-bio-title {
  color: #ffffff;
  font-size: 1.2rem;
  text-transform: uppercase;
  letter-spacing: 2px;
  margin-bottom: 20px;
  border-bottom: 2px solid #f15a22;
  display: inline-block;
  padding-bottom: 5px;
}

.modal-bio-text {
  color: #cccccc;
  line-height: 1.4;
  font-size: 16px;
  white-space: pre-line;
}

/* Responsive Breakpoints */
@media (max-width: 1024px) {
  .lead-member-card {
    min-width: 50%;
  }
  .lead-prev {
    left: 10px;
  }
  .lead-next {
    right: 10px;
  }
  .modal-content {
    flex-direction: column;
    max-height: 85vh;
  }
  .modal-left {
    flex: none;
    padding: 20px 20px;
    border-right: none;
    border-bottom: 1px solid #222222;
  }
  .modal-right {
    padding: 30px 25px;
  }
  .modal-img {
    width: 150px;
    height: 150px;
  }
}

@media (max-width: 640px) {
  .lead-member-card {
    min-width: 100%;
  }
  .lead-img-box {
    width: 180px;
    height: 180px;
  }
  .lead-section-root {
    padding: 40px 15px;
  }
  .modal-name {
    font-size: 1.5rem;
  }
  .modal-bio-text {
    font-size: 0.95rem;
  }
  .modal-right {
    padding: 25px 20px;
  }
  .lead-nav-btn {
    top: 35%;
  }
}

/* Container styling */
.mc-press-section-wrapper {
  background-color: #000;
  padding: 60px 20px;

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

/* Title styling */
.mc-press-main-heading {
  color: #ffffff;
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 40px;
  letter-spacing: 0.5px;
}

/* Logo grid/flex container */
.mc-logos-flex-container {
  display: flex;
  /* flex-wrap: wrap; */
  align-items: center;
  justify-content: center;
  gap: 40px;
  max-width: 1200px;
  width: 100%;
}

/* Individual logo link box */
.mc-single-logo-link {
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  opacity: 0.75;
  transition:
    opacity 0.3s ease,
    transform 0.3s ease;
}

.mc-single-logo-link:hover {
  opacity: 1;
  transform: translateY(-3px);
}

/* Image styling */
.mc-press-logo-img {
  height: 100px;
  width: auto;
  max-width: 150px;
  display: block;
  object-fit: contain;
  /* Optional: filter to make colored logos pop on black background */
  filter: brightness(1);
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .mc-press-section-wrapper {
    padding: 40px 15px;
  }
  .mc-press-main-heading {
    font-size: 22px;
    margin-bottom: 30px;
  }
  .mc-logos-flex-container {
    gap: 25px;
  }
  .mc-press-logo-img {
    height: 80px;
  }
}

@media (max-width: 480px) {
  .mc-logos-flex-container {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px 15px;
  }
  .mc-single-logo-link {
    justify-content: center;
  }
  .mc-press-logo-img {
    height: 80px;
    max-width: 110px;
  }
}

.acc-section-root {
  background-color: #000;
  color: #fff;
  padding: 50px 20px 40px;

  display: flex;
  flex-direction: column;
  align-items: center;
  overflow-x: hidden;
}

/* Header Styling */
.acc-header-group {
  text-align: center;
  margin-bottom: 50px;
}

.acc-sub-title {
  text-transform: uppercase;
  font-size: 14px;
  letter-spacing: 3px;
  color: #bbbbbb;
  margin-bottom: 10px;
}

.acc-main-title {
  font-size: 36px;
  text-transform: uppercase;
  color: #fff;
  letter-spacing: 2px;
  margin: 0;
  position: relative;
  padding-bottom: 15px;
}

.acc-main-title::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 60px;
  height: 2px;
  background-color: #f15a22;
}

/* Year Navigation Tabs */
.acc-year-nav {
  display: flex;
  gap: 25px;
  margin-bottom: 60px;
  flex-wrap: wrap;
  justify-content: center;
}

.acc-year-tab {
  background: none;
  border: none;
  color: #888;
  font-size: 16px;
  cursor: pointer;
  padding: 5px 0;
  transition: color 0.3s ease;
  position: relative;
  white-space: nowrap;
}

.acc-year-tab.active {
  color: #f15a22;
  font-weight: bold;
}

.acc-year-tab.active::after {
  content: "";
  position: absolute;
  bottom: -5px;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: #f15a22;
}

/* Awards Display Area */
.acc-awards-container {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px 30px;
  max-width: 1400px;
  width: 100%;
  opacity: 1;
  transition: opacity 0.5s ease;
  align-items: start;
}

/* Card Styling using pseudo-elements for leaves */
.acc-card {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 10px;
  position: relative;
}

/* The leaf image container/content */
.acc-card-content {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  flex-direction: column;
  padding: 0 100px; /* Space for the leaves on both sides */
  min-width: 180px;
}

.award_img img {
  height: 150px;
  width: 150px;
  object-fit: cover;
}

/* Pseudo-elements for the leaves */
.acc-card-content::before,
.acc-card-content::after {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 85px; /* Adjust based on your image aspect ratio */
  height: 100px; /* Adjust based on your image aspect ratio */
  background-image: url("../images/leaf1.png"); /* REPLACE WITH YOUR IMAGE PATH */
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

/* Left leaf position */
.acc-card-content::before {
  left: 0;
}

/* Right leaf position (flipped) */
.acc-card-content::after {
  right: 0;
  transform: translateY(-50%) scaleX(-1);
}

.acc-award-title {
  color: #f15a22;
  font-size: 16px;
  font-weight: 700;

  margin-bottom: 10px;
  margin-top: 20px;
  line-height: 1.3;
}

.acc-award-desc {
  font-size: 13px;
  color: #bbb;
  margin: 0;
  line-height: 1.5;
}

/* Pagination Dots */
.acc-pagination {
  display: flex;
  gap: 12px;
  margin-top: 60px;
}

.acc-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  border: 1.5px solid #555;
  background: none;
  cursor: pointer;
  padding: 0;
  transition: all 0.3s ease;
}

.acc-dot.active {
  background-color: #f15a22;
  border-color: #f15a22;
  transform: scale(1.2);
}

/* Responsive Breakpoints */
@media (max-width: 1200px) {
  .acc-awards-container {
    grid-template-columns: repeat(2, 1fr);
    gap: 50px 30px;
  }
}

@media (max-width: 768px) {
  .acc-section-root {
    padding: 60px 15px;
  }
  .acc-awards-container {
    grid-template-columns: 1fr;
    gap: 50px;
    max-width: 500px;
  }
  .acc-card-content {
    padding: 0 80px; /* Smaller spacing on mobile */
  }
  .acc-card-content::before,
  .acc-card-content::after {
    width: 70px;
    height: 80px;
  }
  .acc-main-title {
    font-size: 30px;
  }
}

.bnk-app-promo-root {
  background-color: #000000;
  color: #ffffff;
  padding: 80px 20px;

  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 500px;
  overflow: hidden;
}

.bnk-app-promo-container {
  max-width: 1200px;
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 60px;
}

/* Phone Graphic Container */
.bnk-app-phone-wrapper {
  flex: 1;
  display: flex;
  justify-content: flex-end;
  position: relative;
}

.bnk-app-phone-mockup {
  width: 300px;
  height: 600px;
  background-color: #111;
  border-radius: 40px;
  border: 8px solid #222;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5);
  padding: 20px;
  text-align: center;
}

/* Heart Animation Area */
.bnk-app-heart-icon {
  font-size: 80px;
  color: #ff5e62;
  margin-bottom: 20px;
  filter: drop-shadow(0 0 10px rgba(255, 94, 98, 0.3));
}

.bnk-app-phone-text {
  margin-top: 20px;
}

.bnk-app-phone-title {
  font-size: 22px;
  font-weight: 300;
  margin-bottom: 10px;
}

.bnk-app-phone-subtitle {
  font-size: 14px;
  color: #888;
  line-height: 1.4;
}

/* Content Area */
.bnk-app-content-area {
  flex: 1.2;
  display: flex;
  flex-direction: column;
  gap: 25px;
}

.bnk-app-main-heading {
  font-size: 40px;
  line-height: 1.1;
  font-weight: 700;
  margin: 0;
  color: #fff;
}

.bnk-app-main-description {
  font-size: 22px;
  color: #eee;
  font-weight: bold;
  margin: 0;
  max-width: 500px;
}

.small_descr {
  font-size: 18px;
  color: #eee;
  margin-bottom: 0;
}

.banking-left {
  flex: 1;
  display: flex;
  justify-content: center;
}

.banking-left img {
  max-width: 320px;
  width: 100%;
  height: auto;
}

/* Navigation Buttons */
.bnk-app-nav-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 10px 0;
}

.bnk-app-tab-btn {
  padding: 8px 18px;
  border-radius: 6px;
  font-size: 14px;
  text-decoration: none;
  transition: all 0.3s ease;
  border: 1px solid transparent;
}

.bnk-app-tab-blue {
  background-color: #e3f2fd;
  color: #1976d2;
}
.bnk-app-tab-orange {
  background-color: #fff3e0;
  color: #e65100;
}
.bnk-app-tab-green {
  background-color: #e8f5e9;
  color: #2e7d32;
}
.bnk-app-tab-dark {
  background-color: #004080;
  color: #fff;
}

.bnk-app-sub-info {
  font-size: 15px;
  color: #777;
  line-height: 1.5;
  margin: 10px 0;
}

/* Store Buttons */
.bnk-app-store-group {
  display: flex;
  gap: 15px;
  margin-top: 10px;
}

.bnk-app-store-link img {
  height: 75px;
  width: auto;
  border-radius: 6px;
  transition: transform 0.2s ease;
}

.bnk-app-store-link:hover img {
  transform: translateY(-2px);
}

/* Responsiveness */
@media (max-width: 1024px) {
  .bnk-app-main-heading {
    font-size: 38px;
  }
  .bnk-app-phone-mockup {
    width: 260px;
    height: 520px;
  }
}

@media (max-width: 768px) {
  .bnk-app-promo-container {
    flex-direction: column-reverse;
    text-align: center;
    gap: 40px;
  }
  .bnk-app-content-area {
    align-items: center;
  }
  .bnk-app-phone-wrapper {
    justify-content: center;
  }
  .bnk-app-nav-tabs {
    justify-content: center;
  }
  .bnk-app-store-group {
    justify-content: center;
  }
  .bnk-app-main-heading {
    font-size: 32px;
  }
}

#mbl-nav-root {
  display: block;
}

#mbl-main-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 70px;
  background: #0d0d0d;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 20px;
  box-sizing: border-box;
  z-index: 9000;
  border-bottom: 1px solid #222;
}

.mbl-logo-img {
  height: 35px;
  width: auto;
}

.mbl-trigger-box {
  width: 30px;
  height: 22px;
  position: relative;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.mbl-bar {
  height: 2px;
  width: 100%;
  background: #ffffff;
  transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Animation for Toggle */
.mbl-active .mbl-bar-1 {
  transform: translateY(10px) rotate(45deg);
}
.mbl-active .mbl-bar-2 {
  opacity: 0;
}
.mbl-active .mbl-bar-3 {
  transform: translateY(-10px) rotate(-45deg);
}

/* Centered Menu Panel */
#mbl-side-panel {
  position: fixed;
  top: 50%;
  left: 50%;
  width: 90%;
  max-width: 500px;
  max-height: 85vh;
  background: #000000;
  z-index: 8900;
  transition: all 0.4s ease;
  padding: 40px 25px;
  box-sizing: border-box;
  overflow-y: auto;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.8);
  border-radius: 16px;
  border: 1px solid #222;

  /* Initial hidden state (centered but scaled down/invisible) */
  transform: translate(-50%, -50%) scale(0.9);
  opacity: 0;
  visibility: hidden;
}

#mbl-side-panel.mbl-panel-open {
  transform: translate(-50%, -50%) scale(1);
  opacity: 1;
  visibility: visible;
}

.mbl-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.8);
  display: none;
  z-index: 8800;
  backdrop-filter: blur(4px);
}

/* Accordion Menu */
.mbl-nav-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.mbl-nav-item {
  border-bottom: 1px solid #1a1a1a;
}

.mbl-link-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 18px 0;
  color: #ffffff;
  text-decoration: none;
  font-size: 18px;
  font-weight: 500;
  cursor: pointer;
}

.mbl-chevron {
  width: 10px;
  height: 10px;
  border-right: 2px solid #f15a22;
  border-bottom: 2px solid #f15a22;
  transform: rotate(-45deg);
  transition: 0.3s;
}

.mbl-item-expanded .mbl-chevron {
  transform: rotate(45deg);
}

.mbl-sub-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s ease-out;
  background: #080808;
}

.mbl-item-expanded .mbl-sub-content {
  max-height: 800px; /* Large enough for content */
}

.mbl-sub-inner {
  padding: 0px 0 20px 0px;
}

.mbl-sub-heading {
  color: #f15a22;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin: 15px 0 10px;
}

.mbl-sub-link {
  display: block;
  color: #aaa;
  padding: 10px 0;
  text-decoration: none;
  font-size: 16px;
}

/* Nested Menu Specifics */
.mbl-nested-item {
  margin-bottom: 5px;
}
.mbl-nested-trigger {
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #aaa;
  padding: 10px 0;
  font-size: 16px;
  cursor: pointer;
}
.mbl-nested-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
  padding-left: 15px;
  border-left: 1px solid #333;
}
.mbl-item-expanded > .mbl-nested-content {
  max-height: 300px;
}

/* Bottom Action Buttons */
.mbl-action-footer {
  margin-top: 30px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.mbl-btn-primary {
  background: #f15a22;
  color: #fff;
  text-align: center;
  padding: 14px;
  border-radius: 6px;
  font-weight: 600;
  text-decoration: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.mbl-btn-secondary {
  background: #222;
  color: #fff;
  text-align: center;
  padding: 14px;
  border-radius: 6px;
  font-weight: 600;
  text-decoration: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.mbl-btn-arrow {
  font-style: normal;
  font-weight: normal;
}

/* Desktop Hide logic */
@media (min-width: 1025px) {
  #mbl-nav-root {
    display: none !important;
  }
}

/* Bottom Action Buttons */
.mbl-action-footer {
  margin-top: 30px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.mbl-btn-primary {
  background: #f15a22;
  color: #fff;
  text-align: center;
  padding: 14px;
  border-radius: 6px;
  font-weight: 600;
  text-decoration: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.mbl-btn-secondary {
  background: #222;
  color: #fff;
  text-align: center;
  padding: 14px;
  border-radius: 6px;
  font-weight: 600;
  text-decoration: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.mbl-btn-arrow {
  font-style: normal;
  font-weight: normal;
}

/* Desktop Hide logic */
@media (min-width: 1025px) {
  #mbl-nav-root {
    display: none !important;
  }
}

@media (max-width: 768px) {
  #indexFirstSection {
    padding: 100px 0 50px;
  }
  #firstHeading {
    margin-top: 20px;
  }
  #first_btns {
    flex-direction: column;
  }
  #inv_philo,
  #inv_img {
    width: 100%;
  }
}

.mbl-menu-item-container {
  width: 100%;

  background: transparent;
}

.mbl-trigger-link {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 0;
  color: #aaa;
  text-decoration: none;
  font-size: 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.mbl-chevron-icon {
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  display: flex;
  align-items: center;
}

.mbl-chevron-icon.is-active {
  transform: rotate(180deg);
}

/* Expandable Area Logic */
.mbl-expandable-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s ease-in-out;
  background: rgba(255, 255, 255, 0.03); /* Subtle depth */
}

.mbl-expandable-content.is-expanded {
  max-height: 600px; /* Adjust based on total height of links */
}

.mbl-sub-options-list {
  list-style: none;
  padding: 10px 0 10px 20px;
  margin: 0;
  border-left: 2px solid #f15a22; /* Accented left border */
}

.mbl-sub-options-list li {
  padding: 12px 0;
}

.mbl-sub-options-list a {
  color: #ffffff;
  text-decoration: none;
  font-size: 16px;
  display: block;
  opacity: 0.8;
  transition: opacity 0.2s;
}

.mbl-sub-options-list a:active {
  opacity: 1;
  color: #f15a22;
}

#downApp img {
  height: 50px;
  transform: translateY(10px);
}

/* Container & Layout */
.ins-hero-section {
  position: relative;
  width: 100%;
  /* background: linear-gradient(to bottom, #000000 0%, #000000 30%, #1a1a1a 70%, #333333 100%); */

  color: #ffffff;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 100px 20px 0px;
  min-height: 100vh;
}

/* Decoration SVG */
.ins_decor_img {
  position: absolute;
  pointer-events: none;
  z-index: 1;
  width: 200px;
}

.ins_decor_top_right {
  top: 150px;
  left: 50%;
  transform: translateX(-50%);
  opacity: 1;
}

/* Background Animated Text */
.ins-bg-scrolling-text {
  position: absolute;
  bottom: 5%;
  left: 0;
  white-space: nowrap;
  font-size: 18vw;
  font-weight: 800;
  color: rgb(255 255 255 / 6%);
  pointer-events: none;
  z-index: 1;
  animation: insScrollLeft 30s linear infinite;
  line-height: 1;
}

@keyframes insScrollLeft {
  from {
    transform: translateX(100%);
  }
  to {
    transform: translateX(-100%);
  }
}

.ins-hero-content-wrapper {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 100%;
  margin: auto;
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 60px;
}

/* Left Side Content */
.ins-hero-left {
  position: relative;
}

.ins-hero-title {
  font-size: clamp(2.5rem, 3.2vw, 3.5rem);
  line-height: 1.1;
  margin-bottom: 20px;
  font-weight: 800;
}

.ins-hero-tagline {
  font-style: italic;
  font-size: 1.25rem;
  color: #f15a22;
  margin-bottom: 16px;
  display: block;
  opacity: 0.9;
}

.ins-hero-description {
  font-size: 1.1rem;
  line-height: 1.6;
  color: #bbbbbb;
  margin-bottom: 0px;
  max-width: 520px;
}

/* Slide-in Image Animation Container */
.ins-hero-sliding-image {
  position: relative;
  width: 340px;
  height: 260px;
  margin-top: 0px;
  border-radius: 24px;
  overflow: visible;
}

.ins-hero-sliding-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 24px;
  opacity: 0;
  transform: translateX(-50vw);

  transition: all 0.5s ease-out;
  z-index: 10;
}

/* Animation class applied via JS */
.ins-hero-sliding-image img.slide-active {
  opacity: 1;
  transform: translateX(0);
  /* Slower transition as per your 5.2s style or adjusted for feel */
  transition:
    transform 12.2s cubic-bezier(0.22, 1, 0.36, 1),
    opacity 2.5s ease-out;
}

/* Right Side Card */
.ins-quote-card {
  background-color: #0d0d0d;
  border-radius: 32px;
  padding: 40px 20px;
  width: 100%;
  max-width: 480px;
  margin-left: auto;
  color: #ffffff;
  text-align: center;
  height: max-content;
  border: 1px solid #1a1a1a;
  box-shadow: 0 40px 80px rgba(0, 0, 0, 0.9);
}

/* Tab Navigation */
.ins-tabs-navigation {
  position: relative;
  display: flex;
  align-items: center;
  margin-bottom: 24px;
  gap: 10px;
}

.ins-nav-btn {
  background: #1a1a1a;
  border: 1px solid #333;
  color: #fff;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
  flex-shrink: 0;
}

.ins-nav-btn:hover {
  background: #f15a22;
  border-color: #f15a22;
}

.ins-tabs-outer {
  overflow: hidden;
  cursor: grab;
  position: relative;
  flex-grow: 1;
  scroll-behavior: smooth;
}

.ins-tabs-inner {
  display: flex;
  gap: 10px;
  user-select: none;
  padding: 5px 0;
}

.ins-tab-item {
  padding: 10px 20px;
  background-color: #141414;
  color: #777;
  border-radius: 50px;
  white-space: nowrap;
  font-weight: 600;
  font-size: 14px;
  transition: all 0.3s ease;
  cursor: pointer;
  border: 1px solid #1a1a1a;
}

.ins-tab-item.active {
  background-color: #f15a22;
  color: #ffffff;
  border-color: #f15a22;
  box-shadow: 0 6px 20px rgba(241, 90, 34, 0.4);
}

/* Product Area */
.ins-products-container {
  margin-bottom: 25px;
  overflow: hidden;
  cursor: grab;
}

.ins-products-track {
  display: flex;
  gap: 16px;
  padding: 10px 0;
  transition: opacity 0.4s ease;
}

.ins-product-card {
  width: 125px;
  flex-shrink: 0;
  text-align: center;
  cursor: pointer;
}

.ins-product-img-wrapper {
  width: 100%;
  height: 105px;
  background: #141414;
  border-radius: 20px;
  margin-bottom: 12px;
  overflow: hidden;
  border: 1px solid #1a1a1a;
  transition: all 0.4s ease;
}

.ins-product-img-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;

  transition: all 0.4s ease;
}

/* Active Product Styling */
.ins-product-card.selected .ins-product-img-wrapper {
  border-color: #f15a22;
  box-shadow: 0 0 15px rgba(241, 90, 34, 0.3);
}

.ins-product-card.selected .ins-product-img-wrapper img {
  filter: grayscale(0%) brightness(1);
  transform: scale(1.05);
}

.ins-product-card.selected .ins-product-label {
  color: #f15a22;
}

.ins-product-label {
  font-size: 14px;
  font-weight: 600;
  color: #666;
  transition: color 0.3s ease;
}

.ins-slider-indicator-container {
  width: 100%;
  height: 4px;
  background: #1a1a1a;
  border-radius: 10px;
  position: relative;
  margin-top: 10px;
  cursor: pointer;
}

@media (max-width: 768px) {
  .ins-nav-btn {
    display: none;
  }
  .ins-hero-section {
    padding: 50px 0px 0px;
  }
  .ins-hero-left #firstHeading h1 {
    max-width: 75%;
    font-size: 24px;
  }
  .ins_decor_top_right {
    display: none;
  }
  .ins-hero-tagline {
    max-width: 90%;
    text-align: left;
    margin-left: 10px;
  }
}

/* Responsive Breakpoints from User Provided Snippet */
@media (min-width: 1400px) {
  .ins-quote-card {
    max-width: 520px;
  }
}
@media (min-width: 1500px) {
  .ins-quote-card {
    max-width: 580px;
  }
}
@media (min-width: 1600px) {
  .ins-quote-card {
    max-width: 620px;
  }
}
@media (min-width: 1650px) {
  .ins_decor_img {
    width: 300px;
  }
}

@media (max-width: 968px) {
  .ins-hero-content-wrapper {
    grid-template-columns: 1fr;
    text-align: center;
    gap: 20px;
  }
  .ins-hero-left {
    display: flex;
    flex-direction: column;
  }
  .ins-hero-description {
    margin: 0 10px 0px 10px;
    max-width: 70%;
    text-align: left;
  }
  .ins-quote-card {
    margin: 0 auto;
  }
  .ins-hero-sliding-image {
    overflow: hidden;
  }
}

#tabsContainer,
#productSlider {
  display: flex;
  overflow-x: auto; /* Allows native momentum scrolling */
  white-space: nowrap;
  -webkit-overflow-scrolling: touch; /* Smooth inertia scrolling on iOS */
  touch-action: pan-y; /* Allows vertical page scroll while preventing horizontal browser interference */
  user-select: none; /* Prevents text highlighting while dragging */
}

/* Hide scrollbars if desired for a cleaner look */
#tabsContainer::-webkit-scrollbar,
#productSlider::-webkit-scrollbar {
  display: none;
}
/* Base Reset and Fonts */
.chatur-pro-wrapper {
  background-color: #000;

  color: #1a1a1a;
}

.chatur-pro-container {
  padding: 10px 20px 60px;
  max-width: 1200px;
  margin: 0 auto;
}

/* Heading */
.chatur-pro-header {
  text-align: center;
  margin-bottom: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.chatur-pro-title {
  font-size: 32px;
  font-weight: 500;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: -0.5px;
  margin-bottom: 0px;
}

.chatur-pro-header img {
  width: 30%;
  margin-top: -10px;
}

.chatur-pro-title span {
  color: #f15a22;
}

/* Infographic Canvas */
.chatur-pro-canvas {
  position: relative;
  height: 450px;
  margin-top: 20px;
  display: flex;
  justify-content: center;
}

/* Professional Curved Arc - Refined to be a smooth elliptical curve */
.chatur-pro-arc-line {
  position: absolute;
  top: 40px;
  left: 50%;
  transform: translateX(-50%);
  width: 137%;
  height: 4000px;
  border-top: 2px solid #e0e0e042;
  border-left: 2px solid transparent;
  border-right: 2px solid transparent;
  border-bottom: none;
  border-radius: 50% 50% 0 0;
  pointer-events: none;
  z-index: 1;
}

/* --- THE GLOWING ORANGE BALL --- */
          .chatur-pro-ball {
            position: absolute;
            width: 12px;
            height: 12px;
            background-color: #f15a22;
            border-radius: 50%;
            z-index: 3;
            box-shadow: 0 0 10px #f15a22, 0 0 20px #f15a22;
            
            /* ALIGNED PATH:
               M: Start point at Distribution (approx -560, 360 relative to center)
               A: Large radius arc matching the 4000px height visual circle
               The '100% 100%' in offset-path scaling ensures it maps to container.
            */
           offset-path: path("M -420 355 A 720 1600 0 0 1 429 348");
            
            /* back-and-forth animation */
            animation: travelArc 10s ease-in-out infinite;
          }

          @keyframes travelArc {
            0% { 
              offset-distance: 0%; 
              opacity: 0;
            }
            10% {
              opacity: 1;
            }
            90% {
              opacity: 1;
            }
            100% { 
              offset-distance: 100%; 
              opacity: 0;
            }
          }

/* Central Hub */
.chatur-pro-hub {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 320px;
  height: 300px;
  z-index: 10;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}

.chatur-pro-hub-inner {
  width: 100%;
  height: 100%;

  display: flex;
  align-items: center;
  justify-content: center;
}

.chatur-pro-hub-inner img {
  width: 80%;
}

/* Information Nodes */
.chatur-pro-node {
  position: absolute;
  width: 210px;
  text-align: center;
  z-index: 5;
  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.chatur-pro-node:hover {
  transform: translateY(-8px) scale(1.05);
}

.chatur-pro-icon-bg {
  width: 60px;
  height: 60px;
  background-color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 15px;
  box-shadow: 0 8px 25px rgba(241, 90, 34, 0.3);
  color: white;
  transition: box-shadow 0.3s ease;
}

.chatur-pro-node:hover .chatur-pro-icon-bg {
  box-shadow: 0 12px 30px rgba(241, 90, 34, 0.45);
}

.chatur-pro-icon-bg svg {
  width: 28px;
  height: 28px;
  fill: currentColor;
}

.chatur-pro-node-title {
  font-size: 16px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 6px;
  line-height: 1.2;
}

.chatur-pro-node-body {
  font-size: 13px;
  color: #eee;
  line-height: 1.5;
  padding: 0 10px;
  opacity: 0;
  max-height: 0;
  overflow: hidden;
  transform: translateY(10px);
  transition: all 0.35s ease;
}

.chatur-pro-node:hover .chatur-pro-node-body {
  opacity: 1;
  max-height: 100px;
  transform: translateY(0);
}

/* Curvature-Matched Coordinates */
/* Positions calculated to sit perfectly along the elliptical arc */
.chatur-pro-pos-1 {
  top: 350px;
  left: 2%;
}
.chatur-pro-pos-2 {
  top: 165px;
  left: 10%;
}
.chatur-pro-pos-3 {
  top: 45px;
  left: 28%;
}
.chatur-pro-pos-4 {
  top: 45px;
  right: 28%;
}
.chatur-pro-pos-5 {
  top: 165px;
  right: 10%;
}
.chatur-pro-pos-6 {
  top: 350px;
  right: 2%;
}

/* Responsive Flow */
@media (max-width: 1100px) {
  .chatur-pro-canvas {
    height: auto;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
    padding-top: 20px;
  }

  .chatur-pro-arc-line,
  .chatur-pro-hub {
    display: none;
  }

  .chatur-pro-node {
    position: relative;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    width: 100%;
    padding: 25px;
    background: #ffffff;
    border-radius: 16px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
    border: 1px solid #f5f5f5;
  }

  .chatur-pro-title {
    font-size: 26px;
  }
}

@media (max-width: 650px) {
  .chatur-pro-canvas {
    grid-template-columns: 1fr;
  }

  .chatur-pro-container {
    padding: 40px 15px;
  }
}

.ins-wrap-dark-2024 {
  background-color: #000000;
  color: #ffffff;
  padding: 80px 5%;

  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

.ins-wrap-dark-2024 * {
  box-sizing: border-box;
}

.prod-grid-v2-main-heading {
  font-size: 36px;
  font-weight: 700;
  margin-bottom: 60px;
  color: #ffffff;
  letter-spacing: -0.02em;
}

/* Layout Container */
.prod-grid-v2-layout-stack {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 60px 40px;
  max-width: 1400px;
  margin: 0 auto;
}

.prod-grid-v2-layout-others {
  display: grid;
  grid-template-columns: repeat(1fr);
  gap: 60px 40px;
  max-width: 1400px;
  margin: 0 auto;
}
/* Category block */
.prod-grid-v2-cat-block {
  display: flex;
  flex-direction: column;
}

/* Header Area */
.prod-grid-v2-header-region {
  display: flex;
  align-items: flex-start;
  margin-bottom: 25px;
  border-bottom: 1px solid #222;
  padding-bottom: 20px;
}

.prod-grid-v2-icon-box {
  width: 40px;
  height: 40px;
  margin-right: 15px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.prod-grid-v2-icon-box svg {
  width: 100%;
  height: 100%;
  stroke: #f15a22;
}

.prod-grid-v2-text-group {
  flex-grow: 1;
}

.prod-grid-v2-cat-link {
  font-size: 22px;
  font-weight: 600;
  color: #f15a22;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
  transition: color 0.2s ease;
}

.prod-grid-v2-cat-link:hover {
  color: #ff7e4d;
}

.prod-grid-v2-sub-label {
  font-size: 15px;
  color: #999;
  margin: 0;
}

/* The Grid of Cards */
.prod-grid-v2-cards-container {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 16px;
}

.prod-grid-v2-tile-item {
  background-color: #0a0a0a;
  border: 1px solid #1a1a1a;
  border-radius: 12px;
  padding: 24px 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  min-height: 120px;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  cursor: pointer;
  position: relative;
  overflow: hidden;
}

/* Subtle indicator */
.prod-grid-v2-tile-item::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: #f15a22;
  transform: scaleX(0);
  transition: transform 0.3s ease;
}

.prod-grid-v2-tile-item:hover {
  background-color: #111;
  border-color: #333;
  transform: translateY(-4px);
  box-shadow: 0 10px 30px rgba(241, 90, 34, 0.1);
}

.prod-grid-v2-tile-item:hover::after {
  transform: scaleX(1);
}

.prod-grid-v2-tile-item img {
  width: 40px;
  margin-bottom: 10px;
}

.prod-grid-v2-tile-icon {
  margin-bottom: 12px;
  height: 32px;
  color: #f15a22;
}

.prod-grid-v2-tile-name {
  font-size: 14px;
  font-weight: 500;
  color: #e0e0e0;
  line-height: 1.3;
}

/* Responsive adjustments */
@media (max-width: 1024px) {
  .prod-grid-v2-layout-stack {
    grid-template-columns: 1fr;
    gap: 50px;
  }
}

@media (max-width: 600px) {
  .ins-wrap-dark-2024 {
    padding: 40px 20px;
  }
  .prod-grid-v2-cards-container {
    grid-template-columns: repeat(2, 1fr);
  }
  .prod-grid-v2-main-heading {
    font-size: 28px;
    margin-bottom: 40px;
  }
}

#other-v2-container {
  grid-template-columns: repeat(6, 1fr);
}

.drc-ts-root {
  background-color: #000000;
  color: #ffffff;
  padding: 100px 5% 0;

  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

.drc-ts-container {
  max-width: 1300px;
  margin: 0 auto;
  position: relative;
}

/* Header Section */
.drc-ts-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 50px;
  gap: 20px;
}

.drc-ts-title-group h2 {
  font-size: clamp(28px, 4vw, 38px);
  margin: 0 0 12px 0;
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.2;
}

.drc-ts-title-highlight {
  color: #f15a22;
  display: block;
}

.drc-ts-subtitle {
  font-size: 18px;
  color: #888;
  margin: 0;
  max-width: 450px;
  line-height: 1.4;
}

/* Navigation Buttons */
.drc-ts-nav {
  display: flex;
  gap: 15px;
}

.drc-ts-arrow {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  border: 1px solid #333;
  background: #0a0a0a;
  color: #fff;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.drc-ts-arrow:hover {
  border-color: #f15a22;
  color: #f15a22;
  background: #111;
}

.drc-ts-arrow svg {
  width: 24px;
  height: 24px;
}

/* Slider Track */
.drc-ts-viewport {
  overflow: hidden;
  margin: 0 -15px;
}

.drc-ts-track {
  display: flex;
  transition: transform 0.6s cubic-bezier(0.23, 1, 0.32, 1);
}

/* Card Styling */
.drc-ts-card {
  flex: 0 0 100%;
  padding: 0 15px;
  box-sizing: border-box;
}

@media (min-width: 768px) {
  .drc-ts-card {
    flex: 0 0 50%;
  }
}
@media (min-width: 1100px) {
  .drc-ts-card {
    flex: 0 0 33.333%;
  }
}

.drc-ts-card-inner {
  background: #0a0a0a;
  border: 1px solid #1a1a1a;
  border-radius: 24px;
  padding: 40px;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition:
    border-color 0.3s ease,
    transform 0.3s ease;
  position: relative;
}

.drc-ts-card-inner:hover {
  border-color: #f15a22;
  transform: translateY(-5px);
}

/* Image Styling */
.drc-ts-img-wrapper {
  width: 100%;
  height: 200px;
  border-radius: 12px;
  overflow: hidden;
  margin-bottom: 25px;
  background: #111;
}

.drc-ts-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: grayscale(100%);
  transition: filter 0.5s ease;
}

.drc-ts-card-inner:hover .drc-ts-img {
  filter: grayscale(0%);
}

.drc-ts-quote-mark {
  
  font-size: 60px;
  color: #f15a22;
  line-height: 1;
  margin-bottom: -15px;
  opacity: 0.3;
}

.drc-ts-quote-title {
  font-size: 20px;
  font-weight: 700;
  color: #f15a22;
  margin-bottom: 12px;
  display: block;
}

.drc-ts-quote-text {
  font-size: 15px;
  color: #d1d1d1;
  line-height: 1.6;
  margin-bottom: 30px;
  flex-grow: 1;
}

.drc-ts-author {
  font-size: 13px;
  font-weight: 600;
  color: #ffffff;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  display: flex;
  align-items: center;
  gap: 10px;
}

.drc-ts-author::before {
  content: "";
  width: 20px;
  height: 1px;
  background: #f15a22;
}

/* Footer Note */
.drc-ts-footer {
  margin-top: 60px;
  padding-top: 30px;
  border-top: 1px solid #1a1a1a;
  text-align: left;
}

.drc-ts-footer-text {
  font-size: clamp(16px, 2vw, 20px);
  color: #888;
  max-width: 700px;
  border-left: 4px solid #f15a22;
  padding-left: 20px;
}

.drc-ts-footer-text strong {
  color: #fff;
  font-weight: 600;
}

/* Overlay */
.drc_quote_overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.75);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease;
}

/* Active State */
.drc_quote_overlay.drc_quote_active {
  opacity: 1;
  visibility: visible;
}

/* Modal Box */
.drc_quote_modal_box {
  background: #111;
  width: 95%;
  max-width: 500px;
  padding: 40px;
  border-radius: 16px;
  position: relative;
  animation: drcFadeIn 0.3s ease;
}

.drc-modal-overlay {
  display: none; /* Hidden by default */
  position: fixed;
  z-index: 1000;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.8);
  backdrop-filter: blur(4px);
  align-items: center;
  justify-content: center;
}

/* Modal Box */
.drc-modal-content {
  background-color: #121212;
  color: #ffffff;
  padding: 40px;
  border-radius: 16px;
  width: 90%;
  max-width: 450px;
  position: relative;

  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
}

/* Close Button */
.drc-close-btn {
  position: absolute;
  right: 20px;
  top: 15px;
  font-size: 28px;
  cursor: pointer;
  color: #888;
}

.drc-modal-title {
  margin: 0 0 10px 0;
  font-size: 24px;
}
.drc-modal-subtitle {
  color: #aaa;
  margin-bottom: 30px;
  font-size: 14px;
}

/* Form Elements */
.drc-form-group {
  margin-bottom: 20px;
}
.drc-label {
  display: block;
  margin-bottom: 8px;
  font-size: 14px;
  color: #eee;
}

.drc-input {
  width: 100%;
  padding: 15px;
  background: #1e1e1e;
  border: 1px solid #333;
  border-radius: 8px;
  color: white;
  box-sizing: border-box; /* Important for width */
}

.drc-select {
  appearance: none;
  cursor: pointer;
}

/* Submit Button */
.drc-submit-btn {
  width: 100%;
  padding: 15px;
  background-color: #f45d22; /* Matching the orange */
  color: white;
  border: none;
  border-radius: 30px;
  font-size: 18px;
  font-weight: bold;
  cursor: pointer;
  margin-top: 10px;
  transition: background 0.3s;
}

.drc-submit-btn:hover {
  background-color: #e34c11;
}

/* Animation */
@keyframes drcFadeIn {
  from {
    transform: translateY(30px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

.drc_quote_heading {
  font-size: 24px;
  margin-bottom: 10px;
}

.drc_quote_subtext {
  font-size: 14px;
  color: #aaa;
  margin-bottom: 25px;
}

/* Form */
.drc_quote_field {
  margin-bottom: 18px;
  text-align: left;
}

.drc_quote_field label {
  display: block;
  font-size: 13px;
  margin-bottom: 6px;
  color: #ccc;
}

.drc_quote_field input {
  width: 100%;
  padding: 12px;
  background: #1c1c1c;
  border: 1px solid #333;
  border-radius: 8px;
  color: #fff;
  font-size: 14px;
}

.drc_quote_form {
  text-align: center;
}
.drc_quote_field input:focus {
  outline: none;
  border-color: #ff5a1f;
}
.drc_quote_field select {
  width: 100%;
  padding: 12px;
  background: #1c1c1c;
  border: 1px solid #333;
  border-radius: 8px;
  color: #fff;
  font-size: 14px;
  appearance: none;
}

.drc_quote_field select:focus {
  outline: none;
  border-color: #ff5a1f;
}
/* Close Button */
.drc_quote_close_btn {
  position: absolute;
  top: 15px;
  right: 18px;
  background: none;
  border: none;
  color: #aaa;
  font-size: 22px;
  cursor: pointer;
}

/* Responsive */
@media (max-width: 480px) {
  .drc_quote_modal_box {
    padding: 25px;
  }
}

.wm-launch-wrapper {
  padding: 100px 0 100px;
  box-sizing: border-box;
  background-color: #000000;
  color: #ffffff;

  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  position: relative;
}

/* Subtle Geometric Background Overlay */
/* .wm-launch-wrapper::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: radial-gradient(circle at 20% 30%, rgba(241, 90, 34, 0.05) 0%, transparent 40%),
                        radial-gradient(circle at 80% 70%, rgba(241, 90, 34, 0.03) 0%, transparent 40%);
            z-index: 1;
        } */

.wm-content-card {
  position: relative;
  z-index: 2;
  text-align: center;
  max-width: 800px;
}

.wm-image-container {
  width: 100%;
  max-width: 100%;
  margin: 0 auto 0px auto;

  padding: 10px;
}

.wm-hero-image {
  width: 40%;
  margin: auto;
  object-fit: cover;
  display: block;
}

.wm-construction-title {
  font-size: clamp(2rem, 6vw, 3.5rem);
  letter-spacing: -0.5px;
  margin-bottom: 20px;
  color: #ffffff;
}

.wm-accent-line {
  width: 60px;
  height: 3px;
  background-color: #f15a22;
  margin: 0 auto;
}

/* Footer Info */
.wm-footer-details {
  position: absolute;
  bottom: 40px;
  z-index: 2;
  width: 100%;
  text-align: center;
  font-size: 0.75rem;
  color: #444444;
  letter-spacing: 2px;
  text-transform: uppercase;
}

/* Mobile Adjustments */
@media (max-width: 600px) {
  .wm-hero-image {
    height: 200px;
  }
  .wm-construction-title {
    font-size: 1.75rem;
  }
}

.company-address {
  /* Reset the default italics */
  font-style: normal;
  line-height: 1.6;
  color: #eee;
}

.company-name {
  display: block;
  font-weight: bold; /* Makes the first line pop */
  margin-bottom: 4px; /* Adds a tiny bit of breathing room */
}

.company-address span:not(.company-name) {
  display: block;
}

/* landing */
.dc-header-wrapper {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  width: 100%;
}

/* Top Navigation Bar */
.dc-top-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 20px;
  border-bottom: 1px solid #eeeeee;
  gap: 15px;
}

.dc-logo-container {
  display: flex;
  align-items: center;
  min-width: 180px;
}

.dc-brand-logo {
  width: 300px;
  height: 100px;
  object-fit: cover;
}

/* Search Bar Area */
.dc-search-container {
  flex-grow: 1;
  max-width: 600px;
  position: relative;
  margin: 0 20px;
}

.dc-search-input-field {
  width: 100%;
  padding: 10px 45px 10px 20px;
  border-radius: 25px;
  border: 2px solid #000;
  background-color: #000;
  color: #fff;
  font-size: 14px;
  outline: none;
  box-sizing: border-box;
}

.dc-search-input-field::placeholder {
  color: #ccc;
}

.dc-search-icon-btn {
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  color: #fff;
  cursor: pointer;
  background: none;
  border: none;
  padding: 0;
  display: flex;
  align-items: center;
}

/* Action Buttons Area */
.dc-actions-group {
  display: flex;
  align-items: center;
  gap: 15px;
}

/* Dropdown Logic */
.dc-dropdown-wrapper {
  position: relative;
  display: inline-block;
}

.dc-dropdown-content {
  display: none;
  position: absolute;
  background-color: #ffffff;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
  z-index: 100;
  top: 100%;
  left: 0;
  border-radius: 4px;
  padding: 8px 0;
}

.dc-dropdown-wrapper:hover .dc-dropdown-content {
  display: block;
}

.dc-dropdown-content a {
  color: #333;
  padding: 8px 16px;
  text-decoration: none;
  display: block;
  font-size: 14px;
  font-weight: normal;
}

.dc-dropdown-content a:hover {
  background-color: #f1f1f1;
  color: #eb5e28;
}

.dc-lang-selector {
  background-color: #eb5e28;
  color: white;
  padding: 8px 14px;
  border-radius: 20px;
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  font-weight: bold;
  cursor: pointer;
  text-transform: uppercase;
}

.dc-login-btn {
  background-color: #eb5e28;
  color: white;
  padding: 8px 24px;
  border-radius: 20px;
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: bold;
  text-decoration: none;
  transition: opacity 0.2s;
}

.dc-user-icon-circle {
  background: white;
  color: #eb5e28;
  border-radius: 50%;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.dc-notif-bell {
  position: relative;
  color: #eb5e28;
  cursor: pointer;
}

.dc-notif-badge {
  position: absolute;
  top: -5px;
  right: -5px;
  background: #d0021b;
  color: white;
  font-size: 10px;
  padding: 2px 5px;
  border-radius: 10px;
  font-weight: bold;
  border: 1px solid white;
}

/* Main Menu Navigation */
.dc-main-nav-strip {
  background-color: #000;
  color: #fff;
  display: flex;
  align-items: center;
  padding: 0 20px;
  position: relative;
}

.dc-nav-list {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
  align-items: center;
}

.dc-nav-item {
  padding: 15px 12px;
  display: flex;
  align-items: center;
  gap: 5px;
  cursor: pointer;
  font-size: 14px;
  font-weight: 500;
  transition: background 0.2s;
}

.dc-nav-item:hover {
  background-color: #222;
}

.dc-nav-item svg {
  width: 16px;
  height: 16px;
}

.dc-nav-item.active {
  box-shadow: inset 0 -3px 0 #eb5e28;
}

.dc-app-download-link {
  margin-left: auto;
  background: white;
  color: black;
  padding: 5px 15px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  text-decoration: none;
  border-radius: 2px;
}

/* Banner Section with Icons */
.dc-promo-banner {
  padding: 90px 0px 60px;
  display: flex;
  gap: 10px;
  align-items: flex-start;
  overflow-x: auto;
  scroll-behavior: smooth;
  scrollbar-width: none;
  flex-grow: 1;
}

.dc-promo-banner::-webkit-scrollbar {
  display: none;
}

#promo_banner {
}

.dc-promo-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 12px;
  color: white;
  cursor: pointer;
  flex: 0 0 7%;
  transition: transform 0.2s;
}



.dc-promo-icon-box {
  width: 70px;
  height: 70px;
border: 1px solid #f15a22;
  border-radius: 22px;
  display: flex;
  align-items: center;
  justify-content: center;

  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.3);
}

.dc-promo-icon-box svg {
  width: 100%;
  height: 100%;
}

.dc-promo-label {
  font-size: 12px;
  font-weight: 600;
  line-height: 1.3;
}

/* Responsive adjustments */
@media (max-width: 1100px) {
  .dc-app-download-link {
    display: none;
  }
}

@media (max-width: 900px) {
  .dc-search-container {
    display: none;
  }
}

@media (max-width: 600px) {
  .dc-top-bar {
    flex-wrap: wrap;
    justify-content: center;
  }
  .dc-logo-container {
    margin-bottom: 10px;
    width: 100%;
    justify-content: center;
  }
  .dc-promo-banner {
    justify-content: space-around;

    gap: 5px;
  }
  .dc-promo-card {
    width: 90px;
  }
}

.drc-hp-hero-wrapper {
  /* background-color: #000; */
  color: white;
  height: 600px;
  display: flex;
  /* align-items: center; */
  justify-content: space-between;
  padding: 50px 2% 0;
  position: relative;
  overflow: hidden;
}

/* Left Content Area */
.drc-hp-content-box {
  flex: 1;
  z-index: 2;
  max-width: 650px;
}

.drc-hp-badge-main {
  /* background: #f15a22;  */
  color: #fff;
  display: inline-flex;
  align-items: center;
  padding: 5px 12px;
  border-radius: 4px;
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 0.5px;
  margin-bottom: 0px;
}

.drc-hp-main-headline {
  font-size: 44px; /* Larger as requested */
  font-weight: 700;
  line-height: 1.1;
  margin-bottom: 25px;
  letter-spacing: -1px;
}

.drc-hp-sub-headline {
  font-size: 24px;
  font-weight: 600;
  color: #fff;
  margin-bottom: 40px;
}

/* Stats Bar - Matching colors in image */
.drc-hp-stats-grid {
  display: flex;
  background: #76767626; /* Darker blue/purple background from image */
  border: 1px solid #252525;
  border-radius: 8px;
  margin-bottom: 45px;
  max-width: 520px;
}

.drc-hp-stat-col {
  flex: 1;
  padding: 15px 20px;
  border-right: 1px solid #252525;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.drc-hp-stat-col:last-child {
  border-right: none;
}

.drc-hp-val-text {
  font-size: 16px;
  font-weight: 600;
  color: #fff;
  margin-bottom: 3px;
}

.drc-hp-lbl-text {
  font-size: 12px;
  color: #eee;
  line-height: 1.2;
}

/* Input Form Area */
.drc-hp-form-strip {
  background-color: #fff;
  border-radius: 40px;
  padding: 6px;
  display: flex;
  align-items: center;
  max-width: 500px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}

.drc-hp-flag-wrap {
  display: flex;
  align-items: center;
  padding: 0 0px;
  border-right: 1px solid #e0e0e0;
}

.drc-hp-india-img {
  width: 28px;
  height: 18px;
  object-fit: cover;
  border-radius: 2px;
}

.drc-hp-tel-input {
  flex: 1;
  border: none;
  outline: none;
  padding: 10px 15px;
  font-size: 16px;
  color: #333;
}

.drc-hp-tel-input::placeholder {
  color: #aaa;
}

.drc-hp-submit-btn {
  background: linear-gradient(135deg, #f15a29 0%, #d44a1e 100%);
  color: white;
  border: none;
  padding: 12px 28px;
  border-radius: 30px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: transform 0.2s;
  white-space: nowrap;
}

.drc-hp-submit-btn:hover {
  transform: scale(1.02);
}

/* Right Illustration Area */
.drc-hp-image-side {
  flex: 1;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

.drc-hp-main-vector {
  max-width: 580px;
  height: auto;
  object-fit: contain;
}

/* Floating Container for Bottom Right Elements */
.drc-hp-floating-tools {
  position: fixed;
  bottom: 30px;
  right: 30px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 20px;
  z-index: 9999;
}

/* Sticky WhatsApp with Infinite Pop Animation */
.drc-hp-wa-sticky {
  display: flex;
  align-items: center;
  gap: 12px;
  cursor: pointer;
}

.drc-hp-wa-bubble {
  background: white;
  padding: 10px 18px;
  border-radius: 12px;
  font-size: 12px;
  line-height: 1.4;
  color: #333;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
  position: relative;
}

.drc-hp-wa-bubble::after {
  content: "";
  position: absolute;
  right: -6px;
  top: 50%;
  transform: translateY(-50%);
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  border-left: 6px solid white;
}

.drc-hp-wa-icon-box {
  background-color: #25d366;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  box-shadow: 0 4px 20px rgba(37, 211, 102, 0.4);
  animation: drc-hp-pop 2s infinite;
}

/* Association Branding Section */
.drc-hp-association-box {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.drc-hp-association-text {
  color: #fff;
  font-size: 12px;
  font-weight: 600;
}

.drc-hp-kotak-neo-logo {
  width: 80px;
  height: 80px;
  background-color: #ed1c24; /* Kotak Red */
  border-radius: 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 10px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
}

/* Simple SVG implementation of Kotak Neo Logo styling */
.drc-hp-neo-svg {
  width: 100%;
  height: auto;
}

@keyframes drc-hp-pop {
  0% {
    transform: scale(1);
    box-shadow: 0 4px 10px rgba(37, 211, 102, 0.4);
  }
  50% {
    transform: scale(1.15);
    box-shadow: 0 8px 25px rgba(37, 211, 102, 0.6);
  }
  100% {
    transform: scale(1);
    box-shadow: 0 4px 10px rgba(37, 211, 102, 0.4);
  }
}

/* Responsive Design */
@media (max-width: 1024px) {
  .drc-hp-hero-wrapper {
    flex-direction: column;
    text-align: center;
    padding: 80px 20px;
    height: 100%;
  }
  .drc-hp-content-box {
    max-width: 100%;
    margin-bottom: 60px;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .drc-hp-main-headline {
    font-size: 40px;
  }
  .drc-hp-stats-grid,
  .drc-hp-form-strip {
    width: 100%;
  }
  .drc-hp-image-side {
    justify-content: center;
  }
}

@media (max-width: 600px) {
  .drc-hp-form-strip {
    flex-direction: column;
    border-radius: 20px;
    padding: 15px;
    gap: 15px;
  }
  .drc-hp-hero-wrapper {
    flex-direction: column-reverse;
    padding: 0px 0;
  }
  .drc-hp-main-vector {
    width: 100%;
  }
  .drc-hp-flag-wrap {
    border-right: none;
  }
  .drc-hp-submit-btn {
    width: 100%;
  }
  .drc-hp-stats-grid {
    flex-direction: column;
  }
  .drc-hp-stat-col {
    border-right: none;
    border-bottom: 1px solid #2a245e;
  }
  .drc-hp-wa-bubble {
    display: none; /* Hide bubble on mobile for space */
  }
  .drc-hp-floating-tools {
    right: 15px;
    bottom: 15px;
  }
  .drc-hp-kotak-neo-logo {
    width: 60px;
    height: 60px;
  }
}

.drc-ib-container {
  margin: 0 auto;
  padding-bottom: 0px;
  padding-top: 90px;
}

/* Header Section */
.drc-ib-header {
  margin-bottom: 40px;
}

.drc-ib-title {
  font-size: 48px;
  font-weight: 700;
  margin-bottom: 15px;
  letter-spacing: -1px;
}

.drc-ib-subtitle {
  font-size: 20px;
  font-weight: 600;
  color: #fff;
  display: flex;
  gap: 10px;
  align-items: center;
}

.drc-ib-subtitle span {
  color: #fff;
}

.drc-ib-subtitle .divider {
  color: #555;
  font-weight: 300;
}

/* Grid Layout */
.drc-ib-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 25px;
  padding: 30px 0;

  border-radius: 12px;
}

/* Card Styling */
.drc-ib-card {
  background: linear-gradient(145deg, #000000 0%, #1a1a1a 100%);
  border-radius: 12px;
  padding: 24px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
  position: relative;
  display: flex;
  flex-direction: column;
  transition: transform 0.3s ease;
}

.drc-ib-card:hover {
  transform: translateY(-5px);
}

.drc-ib-check-icon {
  position: absolute;
  top: 15px;
  left: 15px;
  color: #00a8ff;
  font-size: 14px;
}

/* Card Header (Logo + Title) */
.drc-ib-card-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 0px;
  margin-top: 10px;
}

.drc-ib-logo-box {
  width: 44px;
  height: 44px;
  background: #f15a29;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-weight: bold;
  font-size: 24px;
}

.drc-ib-brand-info h3 {
  font-size: 17px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 2px;
}

.drc-ib-brand-info p {
  font-size: 12px;
  color: #ccc;
  margin-bottom: 0;
}

.drc-ib-divider {
  height: 1px;
  background: #eee;
  margin: 15px 0;
}

/* Investment Details */
.drc-ib-start-text {
  font-size: 14px;
  color: #ccc;
  margin-bottom: 4px;
}

.drc-ib-amount {
  font-size: 18px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 12px;
}

/* Risk Badges */
.drc-ib-badge {
  display: inline-block;
  padding: 4px 12px 4px 0;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 600;
  margin-bottom: 15px;
}

.badge-high {
  color: #f15a29;
}

.badge-medium {
  color: #00a8ff;
}

.drc-ib-desc {
  font-size: 13px;
  color: #ccc;
  line-height: 1.5;
  height: 40px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.insights_btn_div {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.dream_letter {
  display: block;
  font-size: 30px;
  color: #f15a22;
  text-shadow:
    0 0 5px #f15a22,
    0 0 10px #f15a22,
    0 0 20px #f15a22;
}

#dream_round {
  background: #000;
}

/* Responsive */
@media (max-width: 1024px) {
  .drc-ib-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .drc-ib-title {
    font-size: 36px;
  }
}

#res-pro {
  margin-left: 50px;
}

.insights_btn_div h2 {
  font-size: 50px;
}

@media (max-width: 600px) {
  .drc-ib-grid {
    grid-template-columns: 1fr;
    padding: 15px;
  }
  body {
    padding: 30px 0px;
  }
  #res-pro {
    margin-left: 0px;
  }
  #dream-pro .chatur-pro-node-title,
  #dream-pro .chatur-pro-node-body,
  #res-pro .chatur-pro-node-title,
  #res-pro .chatur-pro-node-body {
    color: #000;
  }

  .insights_btn_div {
    flex-direction: column;
    margin-bottom: 20px;
  }
  .insights_btn_div h2 {
    font-size: 30px;
  }
  .fk-final-journey-cta {
    padding-bottom: 0;
  }
  .interviewDiv h2 {
    font-size: 30px;
  }
  .deven-event-title {
    font-size: 30px;
  }
  .drc-ib-header {
    margin-top: 50px;
  }
  .drc-ib-subtitle {
    font-size: 14px;
  }
}

.drc-hp-chatur-text {
  background: linear-gradient(90deg, #6a5cff, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
  font-weight: 700;
  letter-spacing: 1px;
}

.landing_grad {
  /* width: 100px; */
  margin-left: -42px;
}

.dr-choksey-premium-wrap {
  background-color: #000;
  position: relative;
  margin: 0;
}

.dr-choksey-sticky-container {
  position: relative;
  /* Height controls scroll speed; 600vh makes it feel more deliberate and steady */
  height: 600vh;
}

.dr-choksey-viewport {
  position: sticky;
  top: 0;
  height: 70vh;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  perspective: 1500px;
}

.dr-choksey-stack {
  position: relative;
  width: 100%;
  max-width: 1000px;
  height: 300px; /* Fixed card height */
  display: flex;
  align-items: center;
  justify-content: center;
}

.dr-choksey-card {
  position: absolute;
  width: 100%;
  height: 100%;
  padding: 40px;
  border-radius: 24px;
  /* Shiny Metallic Gradient */
  background: linear-gradient(145deg, #000000 0%, #1a1a1a 100%);
  border: 1px solid rgba(255, 255, 255, 0.1);
  display: flex;
  flex-direction: column;
  justify-content: center;
  box-sizing: border-box;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.9);

  /* Transition timing for buttery smooth movement */
  transition:
    transform 0.1s linear,
    opacity 0.4s ease,
    border-color 0.4s ease;

  will-change: transform, opacity;
  pointer-events: none; /* Allows scrolling through the cards */
}

/* Highlight the center card */
.dr-choksey-card.active-center {
  border-color: #f15a22;
  box-shadow: 0 0 40px rgba(241, 90, 34, 0.15);
}

.dr-choksey-text {
  color: #e0e0e0;
  font-size: 1.1rem;
  line-height: 1.8;
  margin: 0;
  text-align: center;
}

/* Minimalist Side Navigation */
.dr-choksey-nav {
  position: absolute;
  right: 5vw;
  height: 200px;
  width: 2px;
  background: rgba(255, 255, 255, 0.05);
}

.dr-choksey-nav-fill {
  width: 100%;
  background: #f15a22;
  height: 0%;
  transition: height 0.1s linear;
}

@media (max-width: 768px) {
  .dr-choksey-stack {
    max-width: 95vw;
    height: 320px;
  }
  .dr-choksey-text {
    font-size: 1rem;
  }
  .dr-choksey-viewport {
    height: 60vh;
  }
}

/* Removes any default padding/margin from the parent for true edge-to-edge */
.lux-hero-viewport {
  width: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

.lux-hero-image-layer {
  width: 100%;
  /* 45vw ensures the height scales proportionally to the width */
  height: auto;
  min-height: 400px;
  max-height: 800px;

  /* Background setup for full-width spread */
  background-image: url("../images/career2.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;

  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

/* Optional: Adds a slight darkening so "About us" stays legible on all screens */
.lux-hero-image-layer::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.05);
  z-index: 1;
}

.lux-hero-overlay-content {
  position: relative;
  z-index: 2;
  text-align: center;
}

.lux-hero-heading {
  color: #ffffff;

  font-size: clamp(2rem, 5vw, 4rem); /* Fluid typography */

  font-weight: 500;
  text-shadow: 0px 4px 10px rgba(0, 0, 0, 0.4);
  margin: 0;
}

.jb-header-left {
  display: flex;
  /* width: 20rem; */
  align-items: center;
  justify-content: start;
  gap: 20px;
}

.contact_nav a {
  color: #fff;
}

#dc-open-account .drc_btn,
#dc-sign-in .drc_btn {
  padding: 5px 20px;
  width: max-content;
  min-width: auto;
}

/* Mobile Adjustments */
@media (max-width: 768px) {
  .lux-hero-image-layer {
    height: 60vh; /* Taller aspect ratio for mobile */
    background-position: 65% center; /* Adjusts focus to the center of the sofa */
  }
}

@media (max-width: 480px) {
  .lux-hero-image-layer {
    height: 50vh;
  }
}

.d3v-section {
  padding: 80px 0 0px;
  overflow: hidden;
}

.d3v-swiper {
  width: 100%;
  padding: 50px 0;
  overflow: visible !important;
}

.d3v-swiper .swiper-wrapper {
  transition-timing-function: linear !important;
}

.watch-now {
  font-size: 30px;
 margin: 30px auto;
  display: block;
  cursor: pointer;
  width: max-content;
  color: #a6a6a6;
  text-decoration-line: underline;
  text-decoration-color: #ff6600; /* underline color */
  text-decoration-thickness: 3px; /* underline thickness */
  text-underline-offset: 8px; /* space between text & line */
}

.watch-now:hover {
  text-decoration-line: underline;
  text-decoration-color: #ff6600; /* underline color */
  text-decoration-thickness: 3px; /* underline thickness */
  text-underline-offset: 8px;
}

.watch-now .content{
  display: flex;
  gap: 20px;
  align-items: center;
}

.yt-icon {
  color: #ff0000;   /* YouTube red */
  font-size: 50px;  /* adjust size */
}

.d3v-slide {
  width: 450px !important;
  height: 320px;
  display: block; /* Ensure it behaves as a block element for the link */
  cursor: pointer;
  text-decoration: none;
  position: relative;
  z-index: 99999 !important;
}

.d3v-card {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 20px;
  overflow: hidden;
}

.d3v-card-image {
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  transition: transform 0.3s ease;
}

.d3v-video-side {
  flex: 1;
  background: #000;
}

.d3v-video-side video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.d3v-content-side {
  flex: 1;
  padding: 25px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.d3v-event-title {
  font-size: 20px;
  font-weight: 700;
  color: #000;
  margin: 0;
}

.d3v-channel {
  display: flex;
  align-items: center;
  gap: 10px;
}

.d3v-logo {
  width: 35px;
  height: 35px;
  object-fit: contain;
}

.d3v-channel-name {
  font-size: 14px;
  font-weight: 600;
  color: #444;
}

.d3v-name {
  color: #f15a22;
  font-weight: 700;
  font-size: 16px;
  margin: 0;
}

.d3v-role {
  font-size: 18px;
  font-weight: 600;
  color: #000;
  margin: 2px 0;
}

.d3v-location {
  font-size: 12px;
  color: #777;
  margin: 0;
}

.chatur_ins {
  display: flex;
  justify-content: start;
}

.chatur_ins img {
  margin-left: -10px;
}

#fast_paperless {
  margin-left: 50px;
}

/* Responsive Overrides */
@media (max-width: 1024px) {
  .d3v-slide {
    width: 350px !important;
    height: 450px;
  }
  .d3v-card {
    flex-direction: column;
  }
}

@media (max-width: 768px) {
  .d3v-slide {
    width: 85% !important;
  }
  .chatur_ins img {
    margin-left: 0px;
    width: 250px;
    height: 50px;
  }
  .chatur-pro-node-body {
    color: #000;
  }
  #fast_paperless {
    margin-left: 0;
  }
  .chatur-pro-node-title {
    color: #000;
  }
  #other-v2-container {
    grid-template-columns: repeat(2, 1fr);
  }
  .drc-ts-title-group #firstHeading h1 {
    font-size: 26px;
  }
  .drc-ts-card-inner {
    padding: 10px;
  }
  .drc-ts-root {
    padding: 50px 10px;
  }
}

.drc-finserv-support-section {
  background-color: #000000;
  padding: 60px 20px;
  color: #ffffff;
}

.drc-finserv-support-inner {
  /* max-width: 800px; */
  margin: 0 auto;
}

.drc-finserv-support-main-heading {
  color: #f15a22;
  font-size: 2rem;
  margin-bottom: 40px;
  border-left: 4px solid #f15a22;
  padding-left: 15px;
}

.drc-finserv-support-sub-heading {
  font-size: 1.5rem;
  margin-bottom: 20px;
}

.drc-finserv-support-text {
  color: #d1d1d1;
  line-height: 1.7;
  font-size: 18px;
  margin-bottom: 20px;
}

.drc-finserv-support-contact-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin: 40px 0;
}

.drc-finserv-support-card {
  background: #111111;
  padding: 25px;
  border: 1px solid #222;
}

.drc-finserv-support-card-title {
  color: #f15a22;
  margin-top: 0;
  font-size: 1.1rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.drc-finserv-support-link {
  color: #f15a22;
  text-decoration: none;
  font-weight: 600;
}

.drc-finserv-support-highlight {
  color: #ffffff;
  font-weight: bold;
}

.drc-finserv-support-footer-text {
  font-style: italic;
  color: #888;
  border-top: 1px solid #222;
  padding-top: 20px;
}

/* Responsive adjustment */
@media (max-width: 600px) {
  .drc-finserv-support-contact-grid {
    grid-template-columns: 1fr;
  }
}

.drchoksey-table-wrapper {
  background-color: #000000;
  color: #ffffff;

  padding: 0px 20px;
}

.drchoksey-table-container {
  margin: 0 auto;
}

.drchoksey-table-header {
  color: #f15a22;
  margin-bottom: 30px;
  font-size: 1.8rem;
  font-weight: 700;
}

.drchoksey-table-grid {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

/* Desktop Row Header */
.drchoksey-table-row-head {
  display: grid;
  grid-template-columns: 220px 1fr 180px 220px;
  gap: 20px;
  padding: 0 25px 15px 25px;
  border-bottom: 2px solid #f15a22;
  font-weight: 600;
  color: #f15a22;
  text-transform: uppercase;
  font-size: 0.85rem;
  letter-spacing: 1px;
}

/* Individual Data Row */
.drchoksey-table-row {
  display: grid;
  grid-template-columns: 220px 1fr 180px 220px;
  gap: 20px;
  background: #0a0a0a;
  border: 1px solid #1a1a1a;
  padding: 25px;
  border-radius: 4px;
  transition:
    border-color 0.3s ease,
    background 0.3s ease;
}

.drchoksey-table-col-label {
  display: none; /* Hidden on desktop */
  font-size: 0.7rem;
  text-transform: uppercase;
  color: #f15a22;
  margin-bottom: 6px;
  font-weight: 800;
  letter-spacing: 0.5px;
}

.drchoksey-table-officer {
  font-weight: 600;
  color: #ffffff;
  font-size: 1.1rem;
}

.drchoksey-table-address {
  font-size: 0.95rem;
  color: #cccccc;
  line-height: 1.5;
}

.drchoksey-table-address strong {
  display: block;
  color: #ffffff;
  margin-bottom: 4px;
}

.drchoksey-table-link {
  color: #f15a22;
  text-decoration: none;
  word-break: break-all;
  font-weight: 600;
  font-size: 15px;
}

.drchoksey-table-link:hover {
  text-decoration: underline;
}

.drchoksey-table-contact {
  color: #ffffff;
  font-size: 0.9rem;
  line-height: 1.4;
}

#segment {
  grid-template-columns: repeat(2, 1fr);
}

/* Responsive Breakpoints */
@media (max-width: 1024px) {
  .drchoksey-table-row-head,
  .drchoksey-table-row {
    grid-template-columns: 180px 1fr 150px 200px;
    gap: 15px;
  }
}

@media (max-width: 850px) {
  .drchoksey-table-row-head {
    display: none; /* Hide header on mobile */
  }
  .drchoksey-table-row {
    grid-template-columns: 1fr; /* Stack vertically */
    gap: 20px;
    padding: 20px;
  }
  .drchoksey-table-col-label {
    display: block;
  }
  .drchoksey-table-officer {
    font-size: 1.3rem;
    padding-bottom: 10px;
    border-bottom: 1px solid #222;
  }
}

/* Main Container - Dark Theme */
.drc_imp_links_wrapper {
  background-color: #111111;
  padding: 30px;
  color: #ffffff;
}

.drc_imp_links_title {
  font-size: 18px;
  font-weight: bold;
  color: #cccccc;
  margin-bottom: 20px;
}

/* Regulatory Grid (Borders & Layout) */
.drc_imp_links_reg_grid {
  display: flex;
  flex-wrap: wrap;
  border: 1px solid #333333;
  margin-bottom: 30px;
}

.drc_imp_links_reg_item {
  flex: 1;
  min-width: 80px;
  padding: 12px 10px;
  text-align: center;
  color: #f15a22; /* Specific Orange */
  text-decoration: none;
  font-weight: 500;
  font-size: 14px;
  border-right: 1px solid #333333;
  transition: all 0.3s ease;
}

.drc_imp_links_reg_item:last-child {
  border-right: none;
}

.drc_imp_links_reg_item:hover {
  background-color: #f15a22;
  color: #ffffff;
}

/* Bottom Services Layout */
.drc_imp_links_services_grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 15px;
}

.drc_imp_links_column {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.drc_imp_links_service_item {
  color: #f15a22; /* Specific Orange */
  text-decoration: none;
  font-size: 15px;
  font-weight: 600;
  transition: color 0.3s ease;
}

.drc_imp_links_service_item:hover {
  color: #ffffff;
  text-decoration: underline;
}

/* Mobile Responsiveness */
@media (max-width: 768px) {
  .drc_imp_links_services_grid {
    grid-template-columns: 1fr;
  }
  .drc_imp_links_reg_item {
    border-bottom: 1px solid #333333;
  }
}

.exp-insights-container {
  padding: 60px 5%;
  background-color: #0a0a0a; /* Deep dark background */
}

.exp-insights-main-title {
  color: #ffffff;
  font-size: 28px;
  font-weight: 400;
  margin-bottom: 40px;
}

/* Hero Section (White Card from Image) */
.exp-insights-hero-card {
  border-radius: 24px;
  display: flex;
  flex-wrap: wrap;
  overflow: hidden;
  margin-bottom: 30px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
}

.exp-insights-hero-image-box {
  flex: 1 1 400px;
  max-height: 500px;
}

.exp-insights-profile-pic {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 30px;
  display: block;
}

.exp-insights-hero-content {
  flex: 1.2 1 400px;
  padding: 60px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  color: #1a1a1a;
}

.exp-insights-designation {
  font-size: clamp(22px, 5vw, 22px);
  font-weight: 500;
  color: #fff;
  margin-bottom: 25px;
  line-height: 1.15;
}

.exp-insights-headline {
  font-size: clamp(32px, 5vw, 48px);
  line-height: 1.15;
  font-weight: 500;
  margin-bottom: 35px;
  letter-spacing: -0.5px;
}

.exp-insights-cta-btn {
  width: fit-content;
  padding: 12px 28px;
  background: transparent;
  border: 1px solid #999;
  border-radius: 8px;
  font-size: 16px;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}

.exp-insights-cta-btn:hover {
  background: #000;
  color: #fff;
  border-color: #000;
}

/* Insights Grid: Responsive 3-column layout */
.exp-insights-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.exp-insights-card-item {
  /* Black to Dark Grey Gradient */
  background: linear-gradient(145deg, #000000, #252525);
  border: 1px solid #333;
  padding: 20px;
  border-radius: 16px;
  display: flex;
  align-items: center;

  transition: transform 0.3s ease;
}

.exp-insights-card-item:hover {
  transform: translateY(-8px);
  border-color: #555;
}

.exp-insights-card-title {
  color: #ffffff;
  font-size: 18px;
  margin-bottom: 0;
  font-weight: 500;
}

.exp-insights-card-desc {
  color: #a0a0a0;
  font-size: 15px;
  line-height: 1.6;
}

/* Responsive Breakpoints */
@media (max-width: 1024px) {
  .exp-insights-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .exp-insights-hero-content {
    padding: 40px;
  }
}

@media (max-width: 768px) {
  .exp-insights-grid {
    grid-template-columns: 1fr;
  }
  .exp-insights-hero-card {
    flex-direction: column;
  }
  .exp-insights-hero-image-box {
    max-height: 300px;
  }
  .exp-insights-headline {
    font-size: 28px;
  }
}

#know_more {
  width: max-content;
}

.drc_main_slider_container {
  position: relative;
  width: 100%;
  height: 100vh; /* Default Desktop Height */
  overflow: hidden;
  background-color: #000;
}

.drc_slider_track {
  display: flex;
  width: 100%;
  height: 100%;
  transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Slide Styles */
.drc_single_slide {
  min-width: 100%;
  height: 100%;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}

/* Dark Overlay for Text Readability (matching reference) */
.drc_single_slide::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    90deg,
    rgba(0, 0, 0, 0.7) 0%,
    rgba(0, 0, 0, 0.3) 50%,
    rgba(0, 0, 0, 0) 100%
  );
  z-index: 1;
}

.drc_slide_inner_content {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 40px;
  color: #ffffff;
}

/* Typography */
.drc_slide_title {
  font-size: 48px;
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 20px;
  max-width: 600px;
  text-transform: none;
}

.drc_slide_subtext {
  font-size: 20px;
  line-height: 1.5;
  margin-bottom: 35px;
  max-width: 550px;
  opacity: 0.9;
}

.drc_slide_logo_img {
  max-height: 300px;
  width: auto;
  margin-bottom: 25px;
  top: -170px;
  position: absolute;
  left: -65px;
  display: block;
}

#health_check_logo {
  left: 0px;
}

#chatur_pms_logo {
  left: -125px;
}

/* Buttons Container */
.drc_slide_actions {
  display: flex;
  gap: 15px;
  flex-wrap: wrap;
}

/* Navigation Dots */
.drc_pagination_dots {
  position: absolute;
  bottom: 30px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
  display: flex;
  gap: 12px;
}

.drc_dot_item {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: rgba(255, 255, 255, 0.4);
  cursor: pointer;
  transition: all 0.3s ease;
}

.drc_dot_item.drc_active_dot {
  background-color: #ffffff;
  width: 25px; /* Pill shape for active dot */
  border-radius: 10px;
}

/* Slide Specific Backgrounds */
.drc_bg_slide_1 {
  background-image: url("../images/hero_banner2.jpeg");
}
.drc_bg_slide_2 {
  background-image: url("../images/hero_img2.png");
}
.drc_bg_slide_3 {
  background-image: url("../images/hero_img3.png");
}
.drc_bg_slide_4 {
  background-image: url("../images/hero_img4.png");
}
.drc_bg_slide_5 {
  background-image: url("../images/hero_img5.png");
}

/* Responsive Breakpoints */
@media (max-width: 1024px) {
  .drc_main_slider_container {
    height: 500px;
    display: none;
  }
  .drc_slide_title {
    font-size: 38px;
  }
}

@media (max-width: 768px) {
  .drc_main_slider_container {
    height: 450px;
  }
  .drc_slide_title {
    font-size: 32px;
  }
  .drc_slide_subtext {
    font-size: 18px;
  }
  .drc_slide_inner_content {
    padding: 0 25px;
  }
  .drc_slide_actions {
    flex-direction: column;
    gap: 10px;
  }
  .drc_btn {
    width: fit-content;
  }
}

@media (max-width: 480px) {
  .drc_main_slider_container {
    height: 550px;
  }
  .drc_slide_title {
    font-size: 28px;
  }
  .drc_slide_subtext {
    font-size: 16px;
    margin-bottom: 25px;
  }
  .drc_btn {
    width: 100%;
  }
}

.drc_stats_wrapper {
  background-color: #000000;
  padding: 40px 20px 80px;
  color: #ffffff;
  overflow: hidden;
  position: relative;
  z-index: 10;
}

.drc_stats_grid {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 30px;
  text-align: center;
}

.drc_stat_item {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.drc_stat_number {
  font-size: 42px;
  font-weight: 500;
  color: #f15a22; /* Highlight color provided */
  line-height: 1;
}

.drc_stat_label {
  font-size: 16px;
  color: rgba(255, 255, 255, 0.7);
  font-weight: 400;
}

/* Responsive Breakpoints */
@media (max-width: 992px) {
  .drc_stats_grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 50px;
  }
}

@media (max-width: 576px) {
  .drc_stats_grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .drc_stat_number {
    font-size: 36px;
  }
}

.ctur_unified_section {
  background-color: #000000;
  padding: 100px 20px;
  color: #ffffff;
  
}

.ctur_unified_container {
  max-width: 1200px;
  margin: 0 auto;
}

.ctur_layout_grid {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 60px;
  align-items: start;
}

/* Typography */
.ctur_main_title {
  font-size: 3.5rem;
  font-weight: 600;
  margin: 0 0 20px 0;
  display: flex;
  align-items: center;
  gap: 15px;
  letter-spacing: -1px;
}

.ctur_brand_logo {
  height: 30px;
  width: auto;
}

.ctur_main_desc {
  font-size: 1.15rem;
  line-height: 1.6;
  color: #999;
  margin-bottom: 30px;
  max-width: 600px;
}

.ctur_highlight {
  color: #f15a22;
  font-weight: 600;
}

.ctur_action_btn {
  display: inline-block;
  background: #f15a22;
  color: #fff;
  padding: 12px 30px;
  border-radius: 4px;
  text-decoration: none;
  font-weight: 700;
  margin-bottom: 60px;
  transition: 0.3s ease;
}

.ctur_action_btn:hover {
  background: #fff;
  color: #f15a22;
}

/* Cards Layout */
.ctur_cards_stack {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  margin-top: 20px;
}

.ctur_card_item {
  background: #0f0f0f;
  border: 1px solid #222;
  padding: 30px 15px;
  border-radius: 12px;
  transition: all 0.3s ease;
}

.ctur_card_item:hover {
  border-color: #f15a22;
  background: #141414;
}

.ctur_card_full {
  display: flex;
  flex-direction: column;
  gap: 25px;
  width: 334px;
}

.ctur_card_row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.ctur_card_icon {
  font-size: 0.8rem;
  font-weight: 900;
  color: #f15a22;
  border: 1px solid #f15a22;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  flex-shrink: 0;
  margin-bottom: 10px;
}

.ctur_card_full .ctur_card_icon { margin-bottom: 0; }

.ctur_card_title {
  font-size: 1.2rem;
  font-weight: 700;
  margin: 0 0 10px 0;
  color: #fff;
}

.ctur_card_text {
  font-size: 0.95rem;
  color: #666;
  margin: 0;
  line-height: 1.5;
}

/* Image Column */
.ctur_image_sticky_wrapper {
  position: sticky;
  top: 50px;
}

.ctur_side_img {
  width: 100%;
  border-radius: 20px;
  border: 1px solid #222;
  box-shadow: 0 20px 50px rgba(0,0,0,0.5);
}

.ctur_image_glow {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 120%;
  height: 120%;
  background: radial-gradient(circle, rgba(241, 90, 34, 0.1) 0%, transparent 70%);
  z-index: -1;
}

/* Mobile Responsive */
@media (max-width: 992px) {
  .ctur_layout_grid {
    grid-template-columns: 1fr;
  }
  .ctur_image_col {
    order: -1; /* Image stays top on mobile */
  }
  .ctur_main_title {
    font-size: 2.5rem;
  }
  .ctur_card_row {
    grid-template-columns: 1fr;
  }
}

.drc_partner_section {
  background-color: #000000;
  color: #ffffff;
  padding: 80px 40px;
  overflow: hidden;
}

.drc_partner_container {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 60px;
}

/* Top Hero Layout */
.drc_partner_hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
}

.drc_partner_hero_content {
  flex: 1;
  /* max-width: 600px; */
}

.drc_partner_hero_image {
  flex: 1;
  display: flex;
  justify-content: center;
  position: relative;
}

/* Visual Elements */
.drc_partner_img_wrapper {
  position: relative;
  display: flex;
  gap: 15px;
}

.drc_partner_img_box {
  width: 300px;
  height: auto;
  background-color: #1a1a1a;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid #333;
}

.drc_partner_img_box img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.8;
}

.drc_partner_img_box.drc_offset {
  margin-top: 40px;
}

/* Typography */
.drc_partner_title {
  font-size: 56px;
  font-weight: 500;
  margin-bottom: 20px;
  line-height: 1.2;
}

.drc_partner_highlight {
  color: #f15a22;
  font-weight: 600;
}

.drc_partner_description {
  font-size: 18px;
  color: rgba(255, 255, 255, 0.8);
  margin-bottom: 30px;
  line-height: 1.6;
  /* max-width: 65%; */
}

/* Button */
.drc_btn_know_more {
  display: inline-block;
  background-color: #ffffff;
  color: #000000;
  padding: 14px 32px;
  border-radius: 50px;
  text-decoration: none;
  font-weight: 600;
  transition: all 0.3s ease;
  border: 2px solid #ffffff;
}

.drc_btn_know_more:hover {
  background-color: transparent;
  color: #ffffff;
  border-color: #f15a22;
}

/* Feature Grid (Bottom Section) */
.drc_partner_features {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  padding-top: 50px;
}

.drc_feature_card {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.drc_feature_title {
  font-size: 20px;
  font-weight: 700;
  color: #f15a22; /* Highlight color */
}

.drc_feature_text {
  font-size: 16px;
  color: rgba(255, 255, 255, 0.7);
  line-height: 1.5;
}

/* Responsive Design */
@media (max-width: 992px) {
  .drc_partner_hero {
    flex-direction: column;
    text-align: center;
  }
  .drc_partner_hero_image {
    justify-content: center;
  }
  .drc_partner_hero_content {
    max-width: 100%;
  }
  .drc_partner_features {
    grid-template-columns: 1fr;
    gap: 30px;
  }
}

@media (max-width: 480px) {
  .drc_partner_section {
    padding: 60px 20px;
  }
  .drc_partner_title {
    font-size: 32px;
  }
  .drc_partner_img_box {
    width: 140px;
    height: 200px;
  }
}

.drc_partner_hero_wrapper {
  background-color: #000000;
  color: #ffffff;
  padding: 150px 20px 0;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

.drc_partner_hero_inner {
  max-width: 1200px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
}

/* Content Area */
.drc_partner_hero_content_box {
  flex: 1;
  max-width: 550px;
}

.drc_partner_hero_tagline {
  font-size: 22px;
  color: #f15a22; /* Highlight Color */
  margin-bottom: 10px;
  font-weight: 500;
}

.drc_partner_hero_main_title {
  font-size: 48px;
  font-weight: 700;
  line-height: 1.1;
  margin-bottom: 25px;
}

.drc_partner_hero_main_title span {
  display: block;
  color: #ffffff;
}

.drc_partner_hero_sub_description {
  font-size: 18px;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.7);
  margin-bottom: 35px;
}

/* Image/Graphic Area */
.drc_partner_hero_graphic_area {
  flex: 1;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}

.drc_partner_hero_image_mask {
  width: 100%;
  max-width: 450px;

  border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
  overflow: hidden;
  border: 2px solid rgba(241, 90, 34, 0.3);
  position: relative;
  z-index: 2;
}

.drc_partner_hero_image_mask img {
  width: 75%;
  height: 100%;
  object-fit: cover;
  filter: grayscale(20%);
}

/* Decorative Elements */
.drc_partner_hero_decoration {
  position: absolute;
  width: 120%;
  height: 120%;

  border-radius: 50%;
  z-index: 1;
}

.drc_partner_hero_star {
  position: absolute;
  color: #f15a22;
  font-size: 20px;
  opacity: 0.6;
}

/* Responsive Adjustments */
@media (max-width: 992px) {
  .drc_partner_hero_inner {
    flex-direction: column;
    text-align: center;
  }
  .drc_partner_hero_top_nav {
    justify-content: center;
    order: -1;
  }
  .drc_partner_hero_main_title {
    font-size: 38px;
  }
  .drc_partner_hero_graphic_area {
    width: 100%;
    margin-top: 40px;
  }
}

@media (max-width: 576px) {
  .drc_partner_hero_main_title {
    font-size: 32px;
  }
  .drc_partner_hero_image_mask {
    max-width: 300px;
  }
}

.drc_partner_choose_wrapper {
  background-color: #000000;
  color: #ffffff;
  padding: 100px 20px;
  text-align: center;
}

.drc_partner_choose_container {
  max-width: 1400px; /* Increased width to accommodate 6 items in one line */
  margin: 0 auto;
}

/* Part 1: Header Area */
.drc_partner_choose_header {
  margin-bottom: 20px;
  position: relative;
}

.drc_partner_choose_main_title {
  font-size: clamp(32px, 5vw, 48px);
  font-weight: 500;
  margin-bottom: 20px;
  line-height: 1.2;
}

.drc_partner_choose_orange {
  color: #f15a22;
  font-weight: 600;
}

.drc_partner_choose_intro_text {
  font-size: 18px;
  color: rgba(255, 255, 255, 0.7);
  max-width: 800px;
  margin: 0 auto;
  line-height: 1.6;
}

/* Part 2: Grid Area */
.drc_partner_choose_content_box {
  padding-top: 20px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.drc_partner_choose_sub_title {
  font-size: clamp(24px, 4vw, 32px);
  font-weight: 600;
  margin-bottom: 50px;
  color: #f15a22;
}

.drc_partner_choose_grid {
  display: grid;
  /* Six items in one line for desktop */
  grid-template-columns: repeat(6, 1fr);
  gap: 15px;
}

.drc_partner_choose_card {
  padding: 30px 15px;
  background: rgba(255, 255, 255, 0.03);
  border-radius: 12px;
  transition: all 0.3s ease;
  border: 1px solid rgba(255, 255, 255, 0.08);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 180px;
}

.drc_partner_choose_card:hover {
  transform: translateY(-8px);
  background: rgba(241, 90, 34, 0.08);
  border-color: #f15a22;
}

.drc_partner_choose_value {
  font-size: 20px;
  font-weight: 700;
  color: #f15a22; /* Highlighted Titles in Orange */
  margin-bottom: 12px;
  line-height: 1.2;
}

.drc_partner_choose_label {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.6);
  line-height: 1.5;
}

/* Responsive Logic */
@media (max-width: 1200px) {
  .drc_partner_choose_grid {
    grid-template-columns: repeat(3, 1fr); /* 3x2 on tablets/small laptops */
  }
}

@media (max-width: 768px) {
  .drc_partner_choose_grid {
    grid-template-columns: repeat(2, 1fr); /* 2x3 on mobile landscape */
  }
}

@media (max-width: 480px) {
  .drc_partner_choose_grid {
    grid-template-columns: 1fr; /* 1x6 on small phones */
  }
  .drc_partner_choose_wrapper {
    padding: 60px 20px;
  }
  .drc_partner_choose_card {
    padding: 30px 20px;
  }
}

.drc_bizgrow_section {
  background: #050505;
  padding: 40px 20px 0px;
  color: #fff;

  overflow: hidden;
}

.drc_bizgrow_container {
  max-width: 1200px;
  margin: auto;
  position: relative;
  min-height: 580px;
}

/* CENTER TEXT */
.drc_bizgrow_center {
  max-width: 600px;
  margin: auto;
  text-align: center;
  position: relative;
  z-index: 5;
}

.drc_bizgrow_center h2 {
  font-size: 44px;
  line-height: 1.25;
  margin-bottom: 15px;
  font-weight: 500;
}

.drc_bizgrow_center p {
  opacity: 0.75;
  margin-bottom: 32px;
  font-size: 1.1rem;
  line-height: 1.6;
}

.drc_bizgrow_highlight {
  color: #f15a22;
  font-weight: 600;
}

/* BUTTON */
.drc_bizgrow_btn {
  background: #f15a22;
  color: #fff;
  border: none;
  padding: 14px 36px;
  border-radius: 50px;
  font-weight: 600;
  cursor: pointer;
  transition: 0.3s;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
}

.drc_bizgrow_btn:hover {
  transform: scale(1.05);
  box-shadow: 0 10px 20px rgba(241, 90, 34, 0.2);
}

/* CARD DESIGN */
.drc_bizgrow_card {
  position: absolute;
  width: 260px;
  background: #0e0e0e;
  border: 1px solid rgba(241, 90, 34, 0.3);
  padding: 30px 24px;
  border-radius: 16px;
  transition: 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  z-index: 2;
}

/* Shadow box effect from SS */
.drc_bizgrow_card::after {
  content: "";
  position: absolute;
  top: 10px;
  left: 10px;
  right: -10px;
  bottom: -10px;
  border: 1px solid rgba(241, 90, 34, 0.15);
  border-radius: 16px;
  z-index: -1;
  transition: 0.3s;
}

.drc_bizgrow_icon_box {
  width: 44px;
  height: 44px;
  color: #f15a22;
  margin-bottom: 20px;
}

.drc_bizgrow_card h4 {
  font-size: 20px;
  margin-bottom: 10px;
  font-weight: 600;
}

.drc_bizgrow_card p {
  font-size: 14px;
  opacity: 0.6;
  line-height: 1.5;
}

/* CARD POSITIONS */
.drc_bizgrow_card_lt {
  top: -20px;
  left: 0;
}
.drc_bizgrow_card_rt {
  top: -20px;
  right: 0;
}
.drc_bizgrow_card_lm {
  top: 220px;
  left: 80px;
}
.drc_bizgrow_card_rm {
  top: 220px;
  right: 80px;
}
.drc_bizgrow_card_bt {
  bottom: 10px;
  left: 50%;
  transform: translateX(-50%);
}

/* DECORATIONS */
.drc_bizgrow_sparkle {
  position: absolute;
  color: rgba(241, 90, 34, 0.4);
  pointer-events: none;
}

/* RESPONSIVE */
@media (max-width: 1100px) {
  .drc_bizgrow_card_lm {
    left: 20px;
  }
  .drc_bizgrow_card_rm {
    right: 20px;
  }
}

@media (max-width: 1024px) {
  .drc_bizgrow_container {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-height: auto;
  }
  .drc_bizgrow_card {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    margin: 25px 0;
    transform: none !important;
    width: 100%;
    max-width: 400px;
  }
  .drc_bizgrow_card::after {
    display: none;
  }
  .drc_bizgrow_center {
    order: -1;
    margin-bottom: 40px;
  }
  .drc_bizgrow_center h2 {
    font-size: 32px;
  }
}

.drc_insights_section {
  background: #050505; /* True Dark Theme matching Growth section */
  color: #fff;

  padding: 100px 0 40px;
  overflow: hidden;
}

.drc_insights_header {
 
  margin-bottom: 50px;
  position: relative;
}

.drc_insights_header h3 {
  font-size: 20px;
  font-weight: 400;
  margin-bottom: 12px;
  opacity: 0.8;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.drc_insights_header h2 {
  font-size: 52px;
  line-height: 1.15;
  font-weight: 500;
  max-width: 700px;
}

.drc_insights_accent {
  color: #f15a22; /* Brand Orange */
  font-weight: 600;
}

/* Abstract Spiral Decoration */
.drc_insights_spiral {
  position: absolute;
  top: -40px;
  right: 5%;
  width: 320px;
  opacity: 0.2;
  pointer-events: none;
}

/* Bento Grid Layout */
.drc_insights_container {
  display: grid;
  grid-template-columns: 1.25fr 0.9fr 0.9fr;
  grid-template-rows: 320px 320px;
  gap: 20px;
  padding: 0 5%;
  max-width: 1400px;
  margin: auto;
}

.drc_insights_item {
  position: relative;
  overflow: hidden;
  border-radius: 8px;
  background: #111111;
  border: 1px solid rgba(255, 255, 255, 0.05);
}

.drc_insights_item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  filter: grayscale(20%);
}

.drc_insights_item:hover img {
  transform: scale(1.08);
  filter: grayscale(0%);
}

/* Overlay to ensure text/theme consistency */
.drc_insights_item::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, transparent 60%, rgba(5, 5, 5, 0.4));
  pointer-events: none;
}

/* Specific Grid Assignments */
.drc_insights_main {
  grid-row: span 2;
}

.drc_insights_wide {
  grid-column: span 2;
}

/* Responsive Adjustments */
@media (max-width: 1024px) {
  .drc_insights_container {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
  }
  .drc_insights_main {
    grid-column: span 2;
    height: 450px;
  }
  .drc_insights_header h2 {
    font-size: 40px;
  }
}

@media (max-width: 768px) {
  .drc_insights_section {
    padding: 60px 0;
  }
  .drc_insights_container {
    grid-template-columns: 1fr;
    padding: 0 20px;
  }
  .drc_insights_main,
  .drc_insights_wide {
    grid-column: span 1;
    height: 300px;
  }
  .drc_insights_header h2 {
    font-size: 30px;
  }
}

.drc_lead_section {
  background: #050505;
  padding: 80px 20px;
  color: #fff;
}

/* Banner styling based on screenshot layout */
.drc_lead_banner {
  background: #111111; /* Slightly lighter than background to define shape */
  /* max-width: 1100px; */
  margin: 0 auto;
  border-radius: 20px 20px 0 0;
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  padding: 50px 80px 0;
  position: relative;
  overflow: hidden;
  border-top: 1px solid rgba(241, 90, 34, 0.2);
  border-left: 1px solid rgba(241, 90, 34, 0.2);
  border-right: 1px solid rgba(241, 90, 34, 0.2);
}

.drc_lead_banner_text {
  padding-bottom: 50px;
}

.drc_lead_banner_text h3 {
  font-size: 24px;
  font-weight: 300;
  margin-bottom: 5px;
  opacity: 0.9;
}

.drc_lead_banner_text h2 {
  font-size: 56px;
  font-weight: 500;
  line-height: 1.1;
}

.drc_lead_banner_img {
  max-width: 200px;
  margin-bottom: 0;
  z-index: 2;
  align-self: flex-end;
}

.drc_lead_banner_img img {
  width: 100%;
  display: block;
  border-radius: 20px;
  mask-image: linear-gradient(to bottom, black 85%, transparent 100%);
  -webkit-mask-image: linear-gradient(to bottom, black 85%, transparent 100%);
}

/* Form Container */
.drc_lead_form_container {
  background: #0a0a0a;
  /* max-width: 1100px; */
  text-align: center;
  margin: 0 auto;
  padding: 60px 80px;
  border-radius: 0 0 20px 20px;
  border: 1px solid rgba(241, 90, 34, 0.2);
  border-top: none;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.5);
}

.drc_lead_form_container h2 {
  font-size: 36px;
  font-weight: 600;
  margin-bottom: 12px;
  color: #f15a22; /* Title in Orange */
}

.drc_lead_form_container p {
  opacity: 0.7;
  margin-bottom: 45px;
  font-size: 18px;
}

.drc_lead_form {
  max-width: 900px;
  margin: auto;
  text-align: left;
}

.drc_lead_grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 25px;
  margin-bottom: 30px;
}

.drc_lead_field {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.drc_lead_field_full {
  grid-column: span 2;
}

.drc_lead_field label {
  font-size: 14px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.8);
}

.drc_lead_input {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.1);
  padding: 14px 20px;
  border-radius: 10px;
  color: #fff;
  font-size: 16px;
  transition: 0.3s;
}

.drc_lead_input:focus {
  outline: none;
  border-color: #f15a22;
  background: rgba(255, 255, 255, 0.07);
}

/* Radio Buttons */
.drc_lead_radio_group {
  display: flex;
  gap: 40px;
  margin: 15px 0 45px;
}

.drc_lead_radio_item {
  display: flex;
  align-items: center;
  gap: 12px;
  cursor: pointer;
  font-size: 16px;
}

.drc_lead_radio_item input {
  appearance: none;
  width: 22px;
  height: 22px;
  border: 2px solid rgba(241, 90, 34, 0.5);
  border-radius: 50%;
  cursor: pointer;
  position: relative;
  background: transparent;
}

.drc_lead_radio_item input:checked {
  border-color: #f15a22;
  background: #f15a22;
}

.drc_lead_radio_item input:checked::after {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  background: white;
  border-radius: 50%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/* Submit Button */
.drc_lead_submit {
  background: #f15a22; /* Primary Orange */
  color: #fff;
  padding: 16px 48px;
  border-radius: 50px;
  font-weight: 600;
  font-size: 16px;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  border: none;
  cursor: pointer;
  transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.drc_lead_submit:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 20px rgba(241, 90, 34, 0.3);
  filter: brightness(1.1);
}

/* Responsive */
@media (max-width: 1024px) {
  .drc_lead_banner {
    padding: 40px 40px 0;
  }
  .drc_lead_banner_text h2 {
    font-size: 42px;
  }
  .drc_lead_form_container {
    padding: 50px 40px;
  }
}

@media (max-width: 768px) {
  .drc_lead_banner {
    flex-direction: column;
    text-align: center;
    padding-bottom: 0;
  }
  .drc_lead_banner_img {
    margin-top: 30px;
  }
  .drc_lead_grid {
    grid-template-columns: 1fr;
  }
  .drc_lead_field_full {
    grid-column: span 1;
  }
  .drc_lead_radio_group {
    flex-direction: column;
    gap: 20px;
  }
}

.drc_join_section {
  background: #050505;
  padding: 0px 20px;
  text-align: center;

  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 400px;
}

.drc_join_container {
  max-width: 900px;
  margin: 0 auto;
}

.drc_join_section h2 {
  font-size: 48px;
  font-weight: 500;
  color: #fff;
  line-height: 1.2;
  margin-bottom: 50px;
  letter-spacing: -0.02em;
}

/* Input Group Styling */
.drc_join_input_wrapper {
  display: flex;
  max-width: 650px;
  margin: 0 auto;
  background: #ffffff;
  border-radius: 12px;
  overflow: hidden;
  box-shadow:
    0 20px 50px rgba(0, 0, 0, 0.5),
    0 0 20px rgba(241, 90, 34, 0.1);
  transition: transform 0.3s ease;
}

.drc_join_input_wrapper:focus-within {
  transform: translateY(-2px);
  box-shadow:
    0 25px 60px rgba(0, 0, 0, 0.6),
    0 0 30px rgba(241, 90, 34, 0.2);
}

.drc_join_input {
  flex: 1;
  padding: 22px 30px;
  border: none;
  outline: none;
  color: #111;
  font-size: 18px;
  font-weight: 400;
}

.drc_join_input::placeholder {
  color: #999;
}

.drc_join_btn {
  background: #f15a22; /* Brand Orange */
  color: #fff;
  padding: 0 45px;
  font-weight: 700;
  font-size: 18px;
  border: none;
  cursor: pointer;
  transition:
    background 0.3s,
    padding 0.3s;
  white-space: nowrap;
}

.drc_join_btn:hover {
  background: #d4491a;
  padding: 0 55px;
}

/* Responsive Adjustments */
@media (max-width: 768px) {
  .drc_join_section {
    padding: 80px 20px;
  }
  .drc_join_section h2 {
    font-size: 32px;
    margin-bottom: 35px;
  }
  .drc_join_input_wrapper {
    flex-direction: column;
    background: transparent;
    gap: 15px;
    box-shadow: none;
  }
  .drc_join_input {
    border-radius: 10px;
    width: 100%;
    text-align: center;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
  }
  .drc_join_btn {
    border-radius: 10px;
    padding: 20px;
    width: 100%;
  }
  .drc_join_btn:hover {
    padding: 20px;
  }
}


.drc_jrn_canvas {
  background-color: #050505;
  color: #ffffff;

  display: flex;
  flex-direction: column;
  padding: 2rem;
  background-image: radial-gradient(
    circle at 50% 50%,
    #1a1a1a 0%,
    #050505 100%
  );
}

#chatur_adv_icon_box {
  width: 100px;
}

.drc_jrn_main_container {
  color: #ffffff;
  /* min-height: 100vh; */
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem 0 0;
  overflow: hidden;
}

.drc_jrn_layout_wrapper {
  position: relative;
  width: 100%;
  max-width: 1200px;
  height: 550px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}

/* The Header Section */
.drc_jrn_top_header {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #333;
  padding-bottom: 1rem;
}

/* The Hub (Center Semi-Circle) */
.drc_jrn_central_hub {
  position: absolute;
  bottom: -20px;
  width: 380px;
  height: 190px;
  background: #1a1d23;
  border-radius: 190px 190px 0 0;
  z-index: 10;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 2px solid #2d323b;
  box-shadow: 0 -15px 50px rgba(0, 0, 0, 0.6);
}

.drc_jrn_hub_title {
  color: #f15a22;
  font-size: 1.85rem;
  font-weight: 800;
  text-transform: uppercase;
  margin-top: 35px;
  letter-spacing: 2px;
}

.drc_jrn_hub_subtitle {
  font-size: 1.4rem;
  font-weight: 300;
  opacity: 0.8;
}

/* The Rectangular Boxes */
.drc_jrn_stat_box {
  position: absolute;
  width: 260px;
  background: #1a1d23;
  padding: 24px;
  border-radius: 16px;
  border: 1px solid #333;
  border-top: 4px solid #f15a22;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.5);
  transition: all 0.3s ease;
  z-index: 20;
}

.drc_jrn_stat_box:hover {
  transform: translateY(-10px) scale(1.02) !important;
  border-color: #f15a22;
}

/* Positioning the 4 Boxes in an Arc */
.drc_jrn_box_1 {
  bottom: 120px;
  left: 12%;
}
.drc_jrn_box_2 {
  bottom: 340px;
  left: 22%;
}
.drc_jrn_box_3 {
  bottom: 340px;
  right: 22%;
}
.drc_jrn_box_4 {
  bottom: 120px;
  right: 12%;
}

/* Icons Container */
.drc_jrn_icon_wrapper {
  width: 48px;
  height: 48px;
  background: rgba(241, 90, 34, 0.1);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
  color: #f15a22;
}

.drc_jrn_val_text {
  font-size: 2.5rem;
  font-weight: 600;
  color: #f15a22;
  line-height: 1;
}

.drc_jrn_desc_text {
  font-size: 0.95rem;
  color: #e5e7eb;
  margin-top: 12px;
  font-weight: 500;
  line-height: 1.5;
}

/* Curved Connecting Arc Line */
.drc_jrn_connecting_arc {
  position: absolute;
  bottom: 0;
  width: 850px;
  height: 425px;
  /* border: 2px solid rgba(241, 90, 34, 0.15); */
  border-radius: 425px 425px 0 0;
  z-index: 1;
}

/* Visual Dots on Arc */
.drc_jrn_arc_dot {
  position: absolute;
  width: 12px;
  height: 12px;
  background: #f15a22;
  border-radius: 50%;
  z-index: 5;
  box-shadow: 0 0 15px #f15a22;
}

.drc_jrn_dot_1 {
  bottom: 180px;
  left: 12%;
}
.drc_jrn_dot_2 {
  bottom: 380px;
  left: 30%;
}
.drc_jrn_dot_3 {
  bottom: 380px;
  right: 30%;
}
.drc_jrn_dot_4 {
  bottom: 180px;
  right: 12%;
}

/* Mobile View */
@media (max-width: 1024px) {
  .drc_jrn_layout_wrapper {
    height: auto;
    flex-direction: column;
    align-items: center;
    gap: 25px;
    padding-top: 100px;
  }
  .drc_jrn_stat_box {
    position: relative !important;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
    width: 100%;
    max-width: 400px;
  }
  .drc_jrn_central_hub,
  .drc_jrn_connecting_arc,
  .drc_jrn_arc_dot {
    display: none;
  }
  .drc_jrn_mobile_hub {
    display: block;
    width: 100%;
    text-align: center;
    margin-bottom: 20px;
    padding: 30px;
    background: #1a1d23;
    border-radius: 16px;
    border: 1px solid #333;
    border-bottom: 4px solid #f15a22;
  }
}

@media (min-width: 1025px) {
  .drc_jrn_mobile_hub {
    display: none;
  }
}

.title_img_partner {
  display: flex;
  align-items: center;
  gap: 18px;
  position: relative;
}

.title_img_partner img {
  
}

#chatur_ins_home {
  max-height: 100%;
  top: -55px;
  left: 33px;
  width: 300px;
}

#podcast-wrapper {
  position: relative;
  z-index: 1;
}
.d3v-slide *,
.d3v-card * {
  pointer-events: none;
}
#podcast-wrapper .d3v-slide {
  position: relative;
  z-index: 10 !important;
}
.d3v-overlay {
  position: absolute;
  bottom: 20px;
  left: 20px;
  pointer-events: none; /* Crucial: Allows clicks to pass through to the <a> tag */
}

.d3v-swiper {
  position: relative;
  z-index: 1 !important;
}

.dc-promo-slider-wrapper {
  position: relative;
  width: 100%;
  display: flex;
  align-items: center;
}

.dc-nav-next,
.dc-nav-prev {
  /* background-color: #f15a22; */
  background: none;
  color: #fff;
  border-radius: 50%;
  height: 6vh;
  width: 6vh;
  border: none;
}

.chatur_pms {
  width: 500px;
  height: 100px;
  object-fit: cover;
  margin-left: -150px;
}

.dz-research-hero-section {
  background-color: #000000;
  color: #ffffff;
  padding: 100px 40px 80px;

  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 500px;
  overflow: hidden;
}

.dz-research-container {
  max-width: 1200px;
  width: 100%;
  display: flex;
  flex-direction: row;
  gap: 60px;
  align-items: center;
}

/* Left Content Column */
.dz-research-content-left {
  flex: 1;
}

.dz-research-main-title {
  font-size: 48px;
  font-weight: 500;
  line-height: 1.2;
  margin-bottom: 32px;
  color: #ffffff;
}

.dz-research-highlight-list {
  list-style: none;
  padding: 0;
  margin: 0 0 40px 0;
}

.dz-research-highlight-item {
  display: flex;
  align-items: center;
  margin-bottom: 20px;
  font-size: 18px;
  font-weight: 500;
}

.dz-research-check-icon {
  width: 24px;
  height: 24px;
  background-color: #f15a22; /* Updated to brand orange */
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 12px;
  flex-shrink: 0;
}

.dz-research-check-svg {
  width: 14px;
  height: 14px;
  fill: white;
}

.dz-research-cta-button {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background-color: #f15a22; /* Updated to brand orange */
  color: #ffffff;
  padding: 14px 28px;
  border-radius: 30px;
  text-decoration: none;
  font-weight: 600;
  font-size: 16px;
  transition:
    transform 0.2s ease,
    background-color 0.2s ease;
}

.dz-research-cta-button:hover {
  background-color: #d4491a;
  transform: translateY(-2px);
}

/* Right Chart Column */
.dz-research-visual-right {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}

.dz-research-chart-header {
  text-align: center;
  margin-bottom: 30px;
  font-size: 14px;
  color: #cccccc;
}

.dz-research-chart-header b {
  color: #ffffff;
}

.dz-research-chart-wrapper {
  display: flex;
  align-items: flex-end;
  gap: 40px;
  padding-bottom: 20px;
  border-bottom: 1px solid #333333;
  width: 100%;
  max-width: 400px;
  justify-content: center;
}

.dz-research-bar-group {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}

.dz-research-bar-label-top {
  font-weight: 700;
  font-size: 20px;
  color: #888888;
}

.dz-research-bar-label-top.active {
  color: #ffffff;
}

.dz-research-bar {
  width: 100px;
  border-radius: 4px 4px 0 0;
}

.dz-research-bar-grey {
  height: 120px;
  background: linear-gradient(180deg, #444444 0%, #222222 100%);
}

.dz-research-bar-green {
  height: 200px;
  background: linear-gradient(
    180deg,
    #f15a22 0%,
    #9e3612 100%
  ); /* Updated to orange gradient */
}

.dz-research-bar-date {
  margin-top: 10px;
  color: #aaaaaa;
  font-size: 16px;
}

.dz-research-factsheet-link {
  margin-top: 30px;
  color: #888888;
  text-decoration: underline;
  font-size: 12px;
  cursor: pointer;
}

/* Responsive Design */
@media (max-width: 992px) {
  .dz-research-container {
    flex-direction: column;
    text-align: center;
    gap: 40px;
  }

  .dz-research-main-title {
    font-size: 36px;
  }

  .dz-research-highlight-item {
    justify-content: center;
  }

  .dz-research-hero-section {
    padding: 60px 20px;
  }
}

@media (max-width: 480px) {
  .dz-research-main-title {
    font-size: 28px;
  }
  .dz-research-chart-wrapper {
    gap: 20px;
  }
  .dz-research-bar {
    width: 70px;
  }
}

.dz-flow-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.92);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  padding: 20px;
  backdrop-filter: blur(8px);
  overflow-y: auto;
}

.dz-flow-modal {
  background: #111111;
  color: #ffffff;
  width: 100%;
  height: 90%;
  max-width: 900px;
  min-height: 550px;
  border-radius: 8px;
  display: flex;
  overflow-x: hidden;
  overflow-y: auto;
  position: relative;
  box-shadow: 0 25px 50px rgba(0, 0, 0, 0.5);
  border: 1px solid #222;
}

.dz-flow-sidebar {
  width: 35%;

  padding: 60px 40px;
  border-right: 1px solid #222;
  display: flex;
  flex-direction: column;
}

.dz-flow-main {
  flex: 1;
  padding: 40px 60px;
  display: flex;
  flex-direction: column;
  position: relative;
  background: #111;
}

.dz-flow-close {
  position: absolute;
  top: 20px;
  right: 20px;
  background: none;
  border: none;
  font-size: 24px;
  cursor: pointer;
  color: #fff;
  z-index: 10;
  opacity: 0.6;
}
.dz-flow-close:hover {
  opacity: 1;
}

.dz-flow-title-large {
  
  font-size: 42px;
  margin-bottom: 24px;
  line-height: 1.1;
  color: #f15a22;
}
.dz-flow-sidebar-desc {
  font-size: 15px;
  line-height: 1.6;
  color: #aaaaaa;
}

/* Progress Bar */
.dz-flow-progress-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 40px;
  position: relative;
  width: 100%;
}
.dz-flow-progress-line {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  height: 1px;
  background: #333;
  z-index: 1;
  transform: translateY(-50%);
}
.dz-flow-step-dot {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #111;
  border: 1px solid #333;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  z-index: 2;
  transition: all 0.3s ease;
  color: #666;
}
.dz-flow-step-dot.active {
  background: #fff;
  color: #000;
  border-color: #fff;
  box-shadow: 0 0 15px rgba(255, 255, 255, 0.2);
}
.dz-flow-step-dot.completed {
  background: #f15a22;
  border-color: #f15a22;
  color: #fff;
}

/* Question Styles */
.dz-flow-step-content {
  display: none;
  animation: dzFadeIn 0.5s ease forwards;
}
.dz-flow-step-content.active {
  display: block;
}

.dz-flow-question-text {
 
  font-size: 26px;
  margin-bottom: 30px;
  line-height: 1.3;
}

.dz-flow-option-row {
  display: flex;
  border-bottom: 1px solid #333;
  padding: 18px 0;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  transition: all 0.3s;
  color: #ddd;
}
.dz-flow-option-row:hover {
  color: #f15a22;
  border-bottom-color: #f15a22;
  padding-left: 10px;
  background: rgba(241, 90, 34, 0.05);
}
.dz-flow-option-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 40px;
}

.dz-flow-back-btn {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid #444;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  margin-bottom: 25px;
  color: #888;
}
.dz-flow-back-btn:hover {
  border-color: #fff;
  color: #fff;
}

/* Form Elements */
.dz-flow-field-group {
  margin-bottom: 24px;
}
.dz-flow-label {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 10px;
  display: block;
  color: #888;
  letter-spacing: 1px;
}
.dz-flow-input {
  width: 100%;
  padding: 14px;
  border: 1px solid #333;
  background: #0a0a0a;
  font-size: 16px;
  outline: none;
  color: #fff;
  border-radius: 4px;
  transition: border-color 0.3s;
}
.dz-flow-input:focus {
  border-color: #f15a22;
}
.dz-flow-textarea {
  width: 100%;
  border: 1px solid #333;
  min-height: 120px;
  padding: 14px;
  background: #0a0a0a;
  color: #fff;
  border-radius: 4px;
  resize: none;
}
.dz-flow-textarea:focus {
  border-color: #f15a22;
  outline: none;
}

.dz-flow-next-circle {
  background: #f15a22;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  cursor: pointer;
  margin-left: auto;
  margin-top: 20px;
  transition:
    transform 0.2s,
    background 0.2s;
}
.dz-flow-next-circle:hover {
  background: #ff703a;
  transform: scale(1.1);
}

@keyframes dzFadeIn {
  from {
    opacity: 0;
    transform: translateY(15px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 992px) {
  .dz-flow-modal {
    flex-direction: column;
    max-height: 95vh;
    width: 95%;
  }
  .dz-flow-sidebar {
    width: 100%;
    padding: 30px;
    border-right: none;
    border-bottom: 1px solid #222;
  }
  .dz-flow-main {
    padding: 30px;
  }
  .dz-flow-option-grid {
    grid-template-columns: 1fr;
  }
  .dz-flow-title-large {
    font-size: 32px;
  }
}

.drc_consent_wrapper {
  margin-top: 20px;
  padding: 18px 20px;
  background: #141414;
  border: 1px solid #2a2a2a;
  border-radius: 10px;
}

.drc_consent_label {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  cursor: pointer;
}

.drc_consent_checkbox {
  width: 18px;
  height: 18px;
  margin-top: 3px;
  accent-color: #3aa8ff;
  cursor: pointer;
  flex-shrink: 0;
}

.drc_consent_text {
  font-size: 13px;
  line-height: 1.6;
  color: #cfcfcf;
}

.drc_consent_text strong {
  color: #ffffff;
}

.drc_consent_link {
  color: #4da6ff;
  text-decoration: none;
}

.drc_consent_link:hover {
  text-decoration: underline;
}

.first_form_btns {
  display: flex;
  margin-top: 20px;
  justify-content: space-between;
}

.chatur-trust-section {
  background-color: #0f0f0f;
  padding: 80px 24px;
  
  color: #ffffff;
}

.chatur-trust-container {
  max-width: 1200px;
  margin: 0 auto;
}

.chatur-trust-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 50px;
  flex-wrap: wrap;
  gap: 20px;
}

.chatur-trust-title {
  font-size: clamp(32px, 5vw, 48px);
  font-weight: 500;
  margin: 0;
  letter-spacing: -0.5px;
}

.chatur-highlight {
  color: #f15a22;
  font-weight: 600;
}

.chatur-header-cta {
  background: #ffffff;
  color: #000000;
  border: none;
  padding: 12px 24px;
  border-radius: 50px;
  font-weight: 600;
  font-size: 15px;
  cursor: pointer;
  display: flex;
  align-items: center;
  transition:
    transform 0.2s,
    background 0.2s;
}

.chatur-header-cta:hover {
  transform: translateY(-2px);
  background: #f0f0f0;
}

.chatur-cards-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 24px;
}

.chatur-stat-card {
  background: #1a1a1a;
  padding: 40px 30px;
  border-radius: 12px;
  border: 1px solid #2a2a2a;
  transition:
    border-color 0.3s,
    transform 0.3s;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.chatur-stat-card:hover {
  border-color: #f15a22;
  transform: translateY(-5px);
}

.chatur-icon-wrapper {
  width: 48px;
  height: 48px;
  background: rgba(241, 90, 34, 0.1);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 24px;
}

.chatur-stat-value {
  font-size: 36px;
  font-weight: 500;
  margin-bottom: 8px;
  color: #ffffff;
}

.chatur-stat-unit {
  font-size: 18px;
  font-weight: 400;
  color: #aaaaaa;
}

.chatur-stat-label {
  font-size: 14px;
  line-height: 1.5;
  color: #aaaaaa;
  margin: 0;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

@media (max-width: 768px) {
  .chatur-trust-header {
    flex-direction: column;
    align-items: flex-start;
  }

  .chatur-trust-section {
    padding: 50px 20px;
  }

  .chatur-stat-card {
    padding: 30px 20px;
  }
}

.amrit-kaal-v2 {
  background-color: #000000;
  color: #ffffff;
 
  padding: 0;
  margin: 0;
  position: relative;
}

.amrit-kaal-v2-wrapper {
  display: flex;
  max-width: 1600px;
  margin: 0 auto;
  border-left: 1px solid #1a1a1a;
  border-right: 1px solid #1a1a1a;
  position: relative;
  align-items: stretch;
}

/* SIDEBAR STICKY AREA */
.amrit-kaal-v2-sidebar {
  width: 35%;
  padding: 100px 60px;
  border-right: 1px solid #1a1a1a;
  /* Ensure the sidebar parent allows sticky behavior */
  position: relative;
}

.amrit-kaal-v2-sticky {
  position: sticky;
  top: 100px; /* Distance from top of viewport when it sticks */
  height: fit-content;
  /* Prevent content jump */
  align-self: flex-start;
}

.amrit-kaal-v2-tagline {
  color: #f15a22;
  text-transform: uppercase;
  letter-spacing: 4px;
  font-size: 11px;
  font-weight: 700;
  display: block;
  margin-bottom: 24px;
}

.amrit-kaal-v2-main-title {
 
  font-size: clamp(48px, 5vw, 80px);
  line-height: 0.95;
  font-weight: 500;
  margin-bottom: 40px;
}

.amrit-kaal-v2-orange {
  color: #f15a22;
  font-style: italic;
  font-weight: 600;
}

.amrit-kaal-v2-intro {
  font-size: 17px;
  color: #888;
  line-height: 1.6;
  max-width: 320px;
}

/* CONTENT GRID AREA */
.amrit-kaal-v2-content {
  width: 65%;
  padding: 0;
  display: flex;
  flex-direction: column;
}

.amrit-kaal-v2-pillar {
  padding: 20px 80px;
  border-bottom: 1px solid #1a1a1a;
  transition: all 0.6s cubic-bezier(0.16, 1, 0.3, 1);
  position: relative;

  display: flex;
  align-items: center;
}

.amrit-kaal-v2-pillar:last-child {
  border-bottom: none;
}

.amrit-kaal-v2-pillar:hover {
  background: #050505;
}

.amrit-kaal-v2-pillar-inner {
  max-width: 520px;
  position: relative;
  z-index: 2;
}

/* Column offset for asymmetric look */
.pillar-even {
  padding-left: 160px;
}

/* TYPOGRAPHY ELEMENTS */
.amrit-kaal-v2-number {
  font-size: 140px;
  color: #0a0a0a;
  position: absolute;
  top: 50%;
  left: 40px;
  transform: translateY(-50%);
  z-index: 1;
  font-style: italic;
  line-height: 1;
  transition: all 0.8s ease;
  pointer-events: none;
}

.pillar-even .amrit-kaal-v2-number {
  left: 80px;
}

.amrit-kaal-v2-pillar:hover .amrit-kaal-v2-number {
  color: #151515;
  transform: translateY(-55%) scale(1.1);
}

.amrit-kaal-v2-line-accent {
  width: 48px;
  height: 2px;
  background: #f15a22;
  margin-bottom: 32px;
}

.amrit-kaal-v2-pillar-title {
  font-size: 38px;
  font-weight: 500;
  margin-bottom: 24px;
  line-height: 1.15;
  letter-spacing: -0.02em;
}

.amrit-kaal-v2-pillar-text {
  font-size: 16px;
  line-height: 1.8;
  color: #999;
}

/* RESPONSIVE ADAPTATION */
@media (max-width: 1200px) {
  .amrit-kaal-v2-sidebar {
    width: 40%;
    padding: 80px 40px;
  }
  .amrit-kaal-v2-content {
    width: 60%;
  }
  .amrit-kaal-v2-pillar {
    padding: 80px 40px;
  }
  .pillar-even {
    padding-left: 60px;
  }
  .amrit-kaal-v2-number {
    font-size: 100px;
  }
}

@media (max-width: 900px) {
  .amrit-kaal-v2-wrapper {
    flex-direction: column;
    border: none;
  }
  .amrit-kaal-v2-sidebar {
    width: 100%;
    border-right: none;
    border-bottom: 1px solid #1a1a1a;
    padding: 60px 24px;
    position: relative;
  }
  .amrit-kaal-v2-sticky {
    position: relative;
    top: 0;
  }
  .amrit-kaal-v2-content {
    width: 100%;
  }
  .amrit-kaal-v2-pillar {
    padding: 60px 24px;
    min-height: auto;
  }
  .pillar-even {
    padding-left: 24px;
  }
  .amrit-kaal-v2-number {
    top: 20px;
    right: 20px;
    left: auto !important;
    transform: none !important;
    font-size: 70px;
  }
  .amrit-kaal-v2-line {
    height: 60px;
  }
}

#d3v-swiper-wrapper {
  z-index: 1 !important;
  position: relative;
}

/* Hide scrollbar for Chrome, Safari and Opera */
.ins-products-container::-webkit-scrollbar {
  display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.ins-products-container {
  -ms-overflow-style: none; /* IE and Edge */
  scrollbar-width: none; /* Firefox */
}

/* The background overlay */
.ins-modal-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
}

/* The white content box */
.ins-modal-wrapper {
  background: black;
  padding: 2rem;
  border-radius: 12px;
  width: 90%;
  max-width: 450px;
  position: relative;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
}

/* Close button */
.ins-modal-exit {
  position: absolute;
  top: 10px;
  right: 15px;
  font-size: 24px;
  cursor: pointer;
  color: #fff;
}

.ins-modal-title {
  margin-bottom: 0.5rem;
}
.ins-modal-subtitle {
  margin-bottom: 1.5rem;
  color: #666;
}
.ins-modal-field {
  margin-bottom: 1rem;
}
.ins-modal-input {
  width: 100%;
  padding: 10px;
  margin-top: 5px;
border-radius: 30px;
  background: #1e1e1e;
  border: 1px solid #333;
  color: #ffff;
}
.ins-modal-submit {
  width: 100%;
  padding: 12px;
  background: #000;
  color: #fff;
  border: none;
  cursor: pointer;
}

.drc_inline_logo{
  width: 35%;
  margin-left: -9px;
  margin-top: -7px;
}

#mf-hero-logo{
  width: 70%;
  margin-right: 10px;
  margin-top: 0;
}


#health-hero-logo{
  width: 80%;
  margin-top: -5px;
}

#ins-hero-logo{
  width: 60%;
  margin-top: -10px;
  margin-left: -8px;
}

#pms-hero-logo{
  margin-top: -5px;
  width: 50%;
}

.part_logo{
  width: 35%;
  margin-left: 10px;
}

.drc-invest-toggle-container {
  display: flex;
  align-items: center;
  background-color: #000000;
  border-radius: 30px;
  padding: 4px;
  cursor: pointer;
  position: relative;
  width: 200px; 
  height: 38px;
  border: 1px solid #333;
  overflow: hidden;
}

.drc-toggle-slider {
  position: absolute;
  top: 4px;
  left: 4px;
  height: 30px;
  width: calc(50% - 4px);
  background-color: #f15a22;
  border-radius: 25px;
  /* This timing matches the 400ms setTimeout in JS */
  transition: transform 0.4s cubic-bezier(0.65, 0, 0.35, 1);
  z-index: 1;
}

.drc-toggle-slider.active-right {
  transform: translateX(100%);
}

.drc-toggle-slider.active-left {
  transform: translateX(0%);
}

.drc-toggle-text {
  flex: 1;
  text-align: center;
  z-index: 2;
  font-size: 10px;
  font-weight: 700;
  color: #888; /* Dimmed when not active */
  transition: color 0.3s ease;
  text-transform: uppercase;
}

.drc-toggle-text.is-active {
  color: #ffffff; /* Bright white when active */
}

.linkedin-a{
  color: #f15a22;
  font-size: 22px;
}

  .drc-h-section {
            background-color: #000000;
            padding: 50px 0 100px;
            overflow: hidden;
           
            color: #ffffff;
          }

          .drc-h-container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 20px;
          }

          .drc-h-header {
            margin-bottom: 80px;
            text-align: left;
          }

          .drc-h-title {
            font-size: clamp(32px, 5vw, 56px);
            font-weight: 500;
            line-height: 1.2;
            margin: 0;
          }

          .drc-h-title span {
            color: #f15a22;
            font-weight: 600;
          }

          .drc-h-carousel-viewport {
            position: relative;
            width: 100%;
            overflow: hidden;
          }

          /* Light grey line in between circles */
          .drc-h-track-line {
            position: absolute;
            top: 40px; /* Aligned with the vertical center of the 80px circle */
            left: 0;
            right: 0;
            height: 1px;
            background-color: #d1d5db; /* Light grey */
            z-index: 1;
            opacity: 0.3; /* Subtle presence */
          }

          .drc-h-carousel-track {
            display: flex;
            gap: 0;
            transition: transform 0.8s cubic-bezier(0.65, 0, 0.35, 1);
            position: relative;
            z-index: 2;
          }

          .drc-h-item-node {
            flex: 0 0 33.333%;
            display: flex;
            flex-direction: column;
            align-items: center;
            text-align: center;
            padding: 0 10px;
            position: relative;
            opacity: 1; 
            transform: scale(1);
          }

          @media (max-width: 992px) {
            .drc-h-item-node { flex: 0 0 50%; }
          }

          @media (max-width: 576px) {
            .drc-h-item-node { flex: 0 0 100%; }
          }

          .drc-h-circle {
            width: 80px;
            height: 80px;
            border-radius: 50%;
            border: 2px solid #f15a22;
            background-color: #000; /* Keeps the line from crossing through the year */
            display: flex;
            align-items: center;
            justify-content: center;
            margin-bottom: 40px;
            transition: box-shadow 0.5s ease;
            box-shadow: 0 0 15px rgba(241, 90, 34, 0.1);
            position: relative;
            z-index: 3;
          }

          .drc-h-item-node.is-active .drc-h-circle {
            box-shadow: 0 0 25px rgba(241, 90, 34, 0.4);
          }

          .drc-h-year {
            font-size: 18px;
            font-weight: 700;
            color: #ffffff;
          }

          .drc-h-content-wrap {
            max-width: 280px;
            opacity: 1;
            transform: translateY(0);
          }

          .drc-h-node-title {
            font-size: 18px;
            font-weight: 600;
            color: #f15a22;
            margin: 0;
            line-height: 1.4;
          }

          .drc-h-footer {
            margin-top: 60px;
            display: flex;
            justify-content: center;
          }

          .drc-h-dot-nav {
            display: flex;
            gap: 10px;
          }

          .drc-h-dot {
            height: 6px;
            width: 12px;
            background: #222;
            border-radius: 10px;
            transition: all 0.4s ease;
            border: none;
            padding: 0;
          }

          .drc-h-dot.is-active {
            width: 40px;
            background: #f15a22;
          }

          #landing_chaturAi{
            width: 27%;
          }

          .cha-hero-section {
           
       
            padding: 80px 20px;
            display: flex;
            
            justify-content: center;
            overflow: hidden;
            position: relative;
           
          }

          .cha-hero-container {
            max-width: 1200px;
            width: 100%;
            display: grid;
            grid-template-columns: 1.2fr 1fr;
            gap: 40px;
            align-items: center;
            z-index: 2;
          }

          /* Left Content */
          .cha-content-side {
            color: #ffffff;
          }

          .cha-hero-title {
            font-size: clamp(36px, 5vw, 52px);
            font-weight: 500;
            line-height: 1.2;
            margin-bottom: 40px;
            
            gap: 12px;
          }

          .cha-logo-img {
            height: 50px; /* Adjust based on logo aspect ratio */
            width: auto;
            vertical-align: middle;
            margin-left: -20px;
            display: inline-block;
          }

          /* Lead Gen Input */
          .cha-input-group {
            background: #ffffff;
            border-radius: 50px;
            padding: 6px 8px;
            display: flex;
            align-items: center;
            width: 80%;
            box-shadow: 0 0 30px rgba(241, 90, 34, 0.2);
          }

          .cha-flag-wrap {
            padding: 0 15px;
            display: flex;
            align-items: center;
            gap: 8px;
            border-right: 1px solid #ddd;
          }

          .cha-india-flag {
            width: 24px;
            height: 18px;
            object-fit: cover;
          }

          .cha-phone-input {
            flex: 1;
            border: none;
            outline: none;
            padding: 12px 15px;
            font-size: 16px;
            color: #333;
            background: transparent;
          }

          .cha-submit-btn {
            background-color: #f15a22; /* Brand Orange */
            color: #ffffff;
            border: none;
            border-radius: 40px;
            padding: 12px 28px;
            font-weight: 600;
            cursor: pointer;
            transition: transform 0.2s, background-color 0.2s;
            white-space: nowrap;
          }

          .cha-submit-btn:hover {
            background-color: #d94d1a;
            transform: scale(1.02);
          }

          /* Right Visuals */
          .cha-visual-side {
            position: relative;
            display: flex;
            justify-content: center;
            align-items: flex-end;
          }

          .cha-phone-mockup-main {
          
            
            z-index: 2;
          }

          

          /* Abstract Background Elements */
          .cha-bg-glow {
            position: absolute;
            width: 600px;
            height: 600px;
            background: radial-gradient(circle, rgba(241, 90, 34, 0.15) 0%, transparent 70%);
            right: -100px;
            top: -100px;
            z-index: 1;
          }

          /* Responsiveness */
          @media (max-width: 992px) {
            .cha-hero-container {
              grid-template-columns: 1fr;
              text-align: center;
              gap: 60px;
            }
            .cha-input-group {
              margin: 0 auto;
            }
            .cha-hero-title {
              justify-content: center;
            }
            .cha-visual-side {
              margin-top: 20px;
            }
          }

          @media (max-width: 480px) {
            .cha-input-group {
              flex-direction: column;
              border-radius: 20px;
              padding: 15px;
              gap: 15px;
            }
            .cha-flag-wrap {
              border-right: none;
              border-bottom: 1px solid #eee;
              width: 100%;
              padding-bottom: 10px;
              justify-content: center;
            }
            .cha-submit-btn {
              width: 100%;
            }
            .cha-phone-mockup-main {
               width: 220px;
            }
            .cha-phone-mockup-secondary {
               width: 180px;
            }
          }

          .jb-scroll-menu-btn{
  position:relative;
  width:60px;
  height:60px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.jb-progress-ring{
  position:absolute;
  transform:rotate(-90deg);
}

.jb-progress-bg{
  fill:none;
  stroke:#000;
  stroke-width:3;
}

.jb-progress-bar{
  fill:none;
  stroke:#f15a22;
  stroke-width:3;

  stroke-dasharray:163;
  stroke-dashoffset:163;

  transition:stroke-dashoffset .15s linear;
}

.jb-hamburger-btn{
  position:relative;
  z-index:2;
}

.drc-pop-overlay {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.85);
            backdrop-filter: blur(8px);
            display: flex;
            align-items: center;
            justify-content: center;
            z-index: 99999;
            opacity: 0;
            visibility: hidden;
            transition: all 0.3s ease;
          }

          .drc-pop-overlay.drc-is-active {
            opacity: 1;
            visibility: visible;
          }

          .drc-pop-card {
            background: #0a0a0a;
            width: 92%;
            max-width: 440px;
            padding: 40px;
            border-radius: 24px;
            border: 1px solid #222;
            position: relative;
            transform: scale(0.9) translateY(20px);
            transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
          }

          .drc-pop-overlay.drc-is-active .drc-pop-card {
            transform: scale(1) translateY(0);
          }

          .drc-pop-close-trigger {
            position: absolute;
            top: 24px;
            right: 24px;
            background: #222;
            border: none;
            color: #fff;
            width: 32px;
            height: 32px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            transition: background 0.2s;
            font-size: 18px;
          }

          .drc-pop-close-trigger:hover {
            background: #f15a22;
          }

          .drc-pop-header-section {
            margin-bottom: 32px;
            text-align: center;
          }

          .drc-pop-main-title {
            color: #fff;
            font-size: 26px;
            margin-bottom: 8px;
            font-weight: 800;
            letter-spacing: -0.5px;
          }

          .drc-pop-sub-description {
            color: #777;
            font-size: 14px;
            line-height: 1.5;
          }

          /* Form Input Styling */
          .drc-pop-form-container {
            display: flex;
            flex-direction: column;
            gap: 18px;
          }

          .drc-pop-field-wrap {
            display: flex;
            flex-direction: column;
            gap: 6px;
          }

          .drc-pop-field-label {
            color: #aaa;
            font-size: 12px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 1px;
          }

          .drc-pop-text-input {
            background: #161616;
            border: 1px solid #2a2a2a;
            padding: 14px 16px;
            border-radius: 12px;
            color: #fff;
            font-size: 15px;
            outline: none;
            transition: all 0.3s ease;
          }

          .drc-pop-text-input:focus {
            border-color: #f15a22;
            background: #1c1c1c;
            box-shadow: 0 0 0 4px rgba(241, 90, 34, 0.1);
          }

          .drc-pop-action-button {
            background: #f15a22;
            color: #fff;
            border: none;
            padding: 16px;
            border-radius: 12px;
            font-weight: 700;
            font-size: 16px;
            cursor: pointer;
            margin-top: 12px;
            transition: all 0.3s ease;
            box-shadow: 0 4px 15px rgba(241, 90, 34, 0.3);
          }

          .drc-pop-action-button:hover {
            background: #ff6b35;
            transform: translateY(-1px);
            box-shadow: 0 6px 20px rgba(241, 90, 34, 0.4);
          }

          @media (max-width: 480px) {
            .drc-pop-card {
              padding: 35px 24px;
            }
            .drc-pop-main-title {
              font-size: 22px;
            }
          }

          .qr-app{
            margin-top: 20px;
            display: flex;
            /* justify-content: space-between; */
            gap: 30px;
            align-items: center;
          }

          .qr_div{
            width: 100px;
          }

          .app-store-div{
            width: 150px;
          }

          .qr_div img{
            /* border-radius: 10px; */
          }

          .nav_links_desk{
            display: flex;
            justify-content: space-between;
            width: 100%;
            align-items: center;
          }

          .nav_social_links{
            display: flex;
            gap: 20px;
          }
          .nav_social_links a{
            color: #fff;
          }

            /* Hide on Desktop */
        @media (min-width: 1025px) {
          .drc-mob-hero-wrapper { display: none !important; }
        }

        .drc-mob-hero-wrapper {
          position: relative;
          width: 100%;
          height: 100%;
          overflow: hidden;
          background: #000;
          
        }

        .drc-mob-track {
          display: flex;
          width: 100%;
          height: 100%;
          transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
        }

        .drc-mob-slide {
          min-width: 100%;
          height: 100%;
          position: relative;
          background-size: cover;
          background-position: center;
          background-repeat: no-repeat;
          display: flex;
          align-items: flex-end; /* Content at bottom for mobile thumb-reach */
          padding-top: 130px;
          padding-bottom: 80px;
        }

        /* Overlay for readability */
        .drc-mob-slide::after {
          content: "";
          position: absolute;
          inset: 0;
          background: linear-gradient(0deg, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.4) 50%, rgba(0,0,0,0.2) 100%);
          z-index: 1;
        }

        .drc-mob-content {
          position: relative;
          z-index: 2;
          padding: 0 25px;
          width: 100%;
          color: #fff;
        }

        .drc-mob-content h1 {
          font-size: 32px;
          line-height: 1.2;
          font-weight: 700;
          margin-bottom: 15px;
        }

        .drc-mob-content h1 span {
          color: #f15a22;
        }

        .drc-mob-subtext {
          font-size: 16px;
          line-height: 1.5;
          margin-bottom: 30px;
          color: rgba(255, 255, 255, 0.9);
        }

        .drc_mob_inline_logo {
          height: 30px;
          /* width: 100%; */
          object-fit: cover;
          vertical-align: middle;
          margin: 0 4px;
        }

        .drc-mob-actions {
          display: flex;
          flex-direction: column;
          gap: 12px;
        }

        .drc-mob-btn {
          display: block;
          width: 100%;
          padding: 15px;
          background: #f15a22;
          color: #fff;
          text-align: center;
          text-decoration: none;
          font-weight: 600;
          border-radius: 8px;
          border: none;
          font-size: 16px;
        }

        .drc-mob-btn-outline {
          background: transparent;
          border: 1px solid rgba(255,255,255,0.3);
        }

        /* Pagination */
        .drc-mob-dots {
          position: absolute;
          bottom: 30px;
          left: 25px;
          display: flex;
          gap: 8px;
          z-index: 10;
        }

        .drc-mob-dot {
          width: 8px;
          height: 8px;
          border-radius: 50%;
          background: rgba(255,255,255,0.3);
          transition: all 0.3s ease;
        }

        .drc-mob-dot.active {
          width: 24px;
          background: #f15a22;
          border-radius: 4px;
        }

        /* Small mobile tweaks */
        @media (max-height: 660px) {
          .drc-mob-content h1 { font-size: 26px; }
          .drc-mob-slide { padding-bottom: 60px; }
        }

        #grow-h2{
          margin-bottom: 20px;
        }

        .chatur_approach_img{
          width: 15%;
        }

        #landing_interview{
          padding-top: 0;
        }
.required {
  color: red;
  margin-left: 3px;
}
        .mandatory_note {
  font-size: 12px;
  color: red;
  margin-bottom: 10px;
}
.input-error {
  border: 1px solid red !important;
}

.input-error:focus {
  border: 1px solid red !important;
  box-shadow: 0 0 0 1px red;
}
.form-control {
  transition: all 0.2s ease;
}
