/* reset */
html, body { height: 100%; -webkit-tap-highlight-color: transparent; }
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; vertical-align: baseline; }
:focus { outline: none; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
a, span, em { display: inline-block; }
ol, ul { list-style: none; }
ul>li { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ""; content: none; }
table { border-collapse: collapse; border-spacing: 0; }
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-results-button, input[type="search"]::-webkit-search-results-decoration, input, button { -webkit-appearance: none !important; -moz-appearance: none !important; box-shadow: none; }
input[type="search"] { -webkit-appearance: none !important; -moz-appearance: none !important; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; }
textarea { overflow: auto; vertical-align: top; resize: vertical; }
audio, canvas, video { display: inline-block; display: inline; zoom: 1; max-width: 100%; }
audio:not([controls]) { display: none; height: 0; }
[hidden] { display: none; }
html { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
a { transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s; -ms-transition: all 0.5s; text-decoration: none; color: #000; }
a:active, a:hover, a:focus { outline: none; text-decoration: none; }
.supports-no-touch a:focus { outline: none; text-decoration: none; }
figure, form { margin: 0; }
button, input, select, textarea { font-size: 100%; margin: 0; }
button:focus, input:focus, select:focus, textarea:focus { outline: none; }
button, input { line-height: normal; }
button, select { text-transform: none; }
button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; }
button[disabled], html input[disabled] { cursor: default; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; height: 1.3rem; width: 1.3rem; }
input[type="checkbox"], input[type="radio"], input[type="text"], input[type="email"], input[type="password"], input[type="number"], textarea, select { -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0; -webkit-border-radius: 0; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
textarea { overflow: auto; vertical-align: top; }
table { border-collapse: collapse; border-spacing: 0; }
html, button, input, select, textarea { color: #222; }
::-moz-selection { background: #fc3900; text-shadow: none; color: #fff; }
::selection { background: #fc3900; text-shadow: none; color: #fff; }
img { vertical-align: middle; display: inline-block; height: auto; max-width: 100%; border: 0; -ms-interpolation-mode: bicubic; }
fieldset { border: 0; margin: 0; padding: 0; }
textarea { resize: vertical; }
select { color: #000; outline: none !important; }
select:-moz-focusring { color: transparent; text-shadow: 0 0 0 #000; }
.form-control:focus { box-shadow: none; outline: none !important; border-color: inherit; }
*, ::after, *::before { box-sizing: border-box; }
a:focus-visible { outline: none; }
address { font-style: normal; }

/* styles start */
.container { max-width: 1340px; padding: 0 50px; margin: 0 auto; }
body { font-size: 18px; line-height: 1.5; color: #333021; background-color: white; font-family: "Inter", sans-serif; }
.red-text { color: #EC671C; } /* ec1c24 */
.blue-text { color: #2F64FF; }

/* chart content section */
.chart-content-section { padding: 120px 0 0;  } /* padding: 120px 0 60px; */
.chart-content-section h1 { font-size: 40px; font-weight: 600; position: relative; padding-bottom: 8px; margin-bottom: 10px; line-height: 1.35; }
/*.chart-content-section h1::before, .chart-content-section h1::after { position: absolute; content: ""; left: 0; background-position: center; background-repeat: no-repeat; background-size: 100%; width: 258px; } */
.chart-content-section h1::before { background-image: url(../images/bottom-line.svg); bottom: -8px; height: 22px; }
.chart-content-section h1::after { background-image: url(../images/top-line.svg); bottom: 0; height: 18px; }
.chart-content-section h1 span { display: block; }
.chart-content-section .chart-content-wrapper { display: flex; flex-wrap: wrap; }
.chart-content-section .chart-content-wrapper .content-block { flex: 0 0 52%; max-width: 52%; padding-right: 42px; padding-left: 48px;padding-top: 30px; }
.chart-content-section .chart-content-wrapper .content-block p { font-size: 20px; }
.chart-content-section .chart-content-wrapper .content-block .link-wrapper { margin-top: 48px; }
.skills-black-btn { display: inline-block; height: 60px; line-height: 60px; text-align: center; background-color: #2F64FF; color: #fffcf0; border-radius: 12px; font-size: 20px; font-weight: 500; padding: 0 25px; min-width: 300px; text-decoration: none; }
.skills-black-btn:hover { background-color: black; color: #fffcf0;}
.chart-content-section .chart-content-wrapper .chart-block { flex: 0 0 48%; max-width: 48%; }

/* how to build section */
.how-to-build-section .how-to-buid-wrapper { background-color: #fdc959; border-radius: 24px; padding: 40px 40px 48px; position: relative; overflow: hidden; z-index: 1; }
.how-to-build-section .how-to-buid-wrapper::after { position: absolute; content: ""; right: 0; top: 0; bottom: 0; background-image: url(../images/how-to-build-bg.png); background-repeat: no-repeat; background-position: center; background-size: cover; width: 673px; height: 576px; z-index: -1; }
.how-to-build-section .how-to-buid-wrapper h2 { font-size: 24px; font-weight: 700; color: #302d22; padding: 8px 12px; background-color: #feef9f; border-radius: 8px; display: inline-block; margin-bottom: 16px; }
.how-to-build-section .how-to-buid-wrapper li { 
  font-size: 20px;
  font-weight: 500;
  max-width: 562px;
  position: relative;
  padding-left: 30px;
 }
.how-to-build-section .how-to-buid-wrapper ul li:before {
  content: "•";
  top: 1px;
  left: -2px;
  position: absolute;
  left: 5px;
  top: 2px;
  /* background-image: url(../images/gray-arrow-icon.svg);
  background-size: 20px 21px; */
  width: 20px;
  height: 21px;
  background-repeat: no-repeat;

}
/* faq section */
.links-accordian-outer a { color: #333021; font-size: 28px; font-weight: 500; text-decoration: none; display: inline-block; }
.links-accordian-outer .links-accordian-inner { padding: 22px 55px 22px 22px; background-color: #f9fafb; border: 1px solid #fc3900; border-radius: 16px; position: relative; } /* background-color: #FFF5BD; */
.links-accordian-outer .links-accordian-inner + .links-accordian-inner { margin-top: 28px; }
.links-accordian-outer .links-accordian-inner .links-accordian-content { display: none; padding-top: 10px; }
.links-accordian-outer .links-accordian-inner .links-accordian-content p { font-size: 20px; color: #333021; font-weight: 400; }
.links-accordian-outer .links-accordian-inner .links-accordian-content p + p { margin-top: 6px; }
.links-accordian-outer .links-accordian-title { cursor: pointer; }
.links-accordian-outer .links-accordian-title h3 { font-size: 20px; font-weight: 500; }
.links-accordian-outer .links-accordian-title svg { position: absolute; top: -5px; right: 10px; width: 28px; }
.links-accordian-outer .links-accordian-title svg path { fill: #333021; }
.links-accordian-outer .links-accordian-inner .links-accordian-title em { position: absolute; right: 10px; top: 28px; display: block; text-align: center; cursor: pointer; display: inline-block; }
.links-accordian-outer .links-accordian-inner .links-accordian-title .horz { transition: all 0.5s; }
.links-accordian-outer .links-accordian-inner.active .links-accordian-title .horz { opacity: 0; visibility: hidden; }
.links-accordian-outer .links-accordian-inner .links-accordian-title .vert { opacity: 0; visibility: hidden; }
.links-accordian-outer .links-accordian-inner.active .links-accordian-title .vert { opacity: 1; visibility: visible; }
.faq-section { padding: 120px 0 }
.faq-section .faq-wrapper { display: flex; }
.faq-section .title-block { padding-right: 102px; padding-left: 39px; }
.faq-section .faq-wrapper h2 { font-size: 40px; max-width: 259px; line-height: 1.35; }
.faq-section .accordian-block { width: 100%; }

/* why durable skills section */
/* .why-durable-skills-section { padding: 60px 0 120px } manthan */
.why-durable-skills-section .title-wrapper { margin-bottom: 35px; padding: 0 25px 0 49px; }
.why-durable-skills-section .title-wrapper h2 { font-size: 40px; color: black; font-weight: 700; margin-bottom: 17px; } /* font-size: 16px; color: #fc3900; */
.why-durable-skills-section .title-wrapper p { font-size: 20px; } /* font-size: 28px; font-weight: 500; */ /* font-size: 24px; */
.why-durable-skills-section .img-wrapper img { width: 100%; height: 100%; object-fit: cover; }
.why-durable-skills-section .durable-skills-listing { margin-top: -104px; }
.why-durable-skills-section .durable-skills-listing .skills-listing-inner { padding: 0 85px; }
/* .why-durable-skills-section .durable-skills-listing ul { display: flex; flex-wrap: wrap; margin: 0 -14px -28px; }
.why-durable-skills-section .durable-skills-listing ul li { flex: 0 0 33.33%; max-width: 33.33%; padding: 0 14px 28px; } */
.why-durable-skills-section .durable-skills-listing ul {
  display: flex;
  flex-wrap: wrap;
  gap: 28px; /* Space between items */
  justify-content: center; /* Ensures items stay centered */
}

.why-durable-skills-section .durable-skills-listing ul li {
  flex: 1 1 auto; /* Allow items to adjust dynamically */
  min-width: calc(25% - 28px); /* Default: 4 per row */
  max-width: calc(25% - 28px); /* Prevent items from expanding beyond this */
}

/* If only 3 items exist, adjust to fit in 3 columns */
.why-durable-skills-section .durable-skills-listing ul:has(li:nth-child(3):last-child) li {
  min-width: calc(33.33% - 28px);
  max-width: calc(33.33% - 28px);
}

/* Responsive Design */
@media (max-width: 1024px) {
  .why-durable-skills-section .durable-skills-listing ul li {
      min-width: calc(50% - 28px); /* 2 per row */
      max-width: calc(50% - 28px);
  }
}

@media (max-width: 600px) {
  .why-durable-skills-section .durable-skills-listing ul li {
      min-width: 100%; /* 1 per row */
      max-width: 100%;
  }
}

.why-durable-skills-section .durable-skills-listing ul li .durable-skills-inner { background-color: rgb(51 48 33 / 64%); border-radius: 24px; padding: 26px 34px 26px; height: 100%; backdrop-filter: blur(12px); }
.why-durable-skills-section .durable-skills-listing ul li .durable-skills-inner h3 { font-size: 27px; font-weight: 700; color: #fffcf0; } /* font-size: 48px; */
.why-durable-skills-section .durable-skills-listing ul li .durable-skills-inner p { margin-top: 16px; font-size: 18px; color: #fffcf0; font-weight: 500; }
.why-durable-skills-section .durable-skills-listing .small-text { font-size: 20px; color: #6c5700; margin-top: 22px; padding: 0 43px; } /* font-size: 18px; */

@media (max-width:1366px) {
  .why-durable-skills-section .durable-skills-listing ul li .durable-skills-inner h3 { font-size: 44px; }
}
@media (max-width:1199px) {
  .container { padding: 0 25px; }
  .chart-content-section { padding: 80px 0 40px; }
  .why-durable-skills-section { padding: 40px 0 80px; }
  .faq-section { padding: 80px 0; }
  .chart-content-section h1, .faq-section .faq-wrapper h2 { font-size: 36px; }
  .chart-content-section .chart-content-wrapper .content-block p { font-size: 18px; }
  .chart-content-section .chart-content-wrapper .content-block .link-wrapper { margin-top: 38px; }
  .chart-content-section .chart-content-wrapper .content-block { padding: 0 30px 0 0; }
  .how-to-build-section .how-to-buid-wrapper p, .why-durable-skills-section .title-wrapper p { font-size: 24px; }
  .how-to-build-section .how-to-buid-wrapper::after { width: 520px; height: auto; }
  .how-to-build-section .how-to-buid-wrapper { padding: 30px; }
  .faq-section .title-block { padding-right: 60px; padding-left: 0; }
  .links-accordian-outer .links-accordian-title h3 { font-size: 24px; }
  .links-accordian-outer .links-accordian-inner { padding: 12px 39px 12px 15px; }
  .links-accordian-outer .links-accordian-inner .links-accordian-title em { top: 15px; right: 0; }
  .links-accordian-outer .links-accordian-title svg { width: 25px; top: 3px;}
  .links-accordian-outer .links-accordian-inner .links-accordian-content p { font-size: 16px; }
  .why-durable-skills-section .title-wrapper h2 { margin-bottom: 15px; }
  .why-durable-skills-section .title-wrapper { margin-bottom: 30px; padding: 0; }
  .why-durable-skills-section .durable-skills-listing ul li .durable-skills-inner h3 { font-size: 40px; }
  .why-durable-skills-section .durable-skills-listing ul { margin: 0 -10px -20px; }
  .why-durable-skills-section .durable-skills-listing ul li { padding: 0 10px 20px; }
  .why-durable-skills-section .durable-skills-listing ul li .durable-skills-inner { padding: 25px; }
  .why-durable-skills-section .durable-skills-listing ul li .durable-skills-inner p { font-size: 16px; margin: 10px 0; }
  .why-durable-skills-section .durable-skills-listing .skills-listing-inner { padding: 0 38px; }
  .why-durable-skills-section .durable-skills-listing .small-text { font-size: 16px; }
  .why-durable-skills-section .durable-skills-listing .small-text { margin-top: 20px; padding: 0; }
  .chart-content-section .chart-content-wrapper .chart-block { flex: 0 0 57%; max-width: 57%;}
  .chart-content-section .chart-content-wrapper .content-block { flex: 0 0 43%; max-width: 43%;}
}
@media (max-width:991px) {
  .chart-content-section .chart-content-wrapper .content-block,.chart-content-section .chart-content-wrapper .chart-block { flex: 0 0 100%; max-width: 100%; }
  .chart-content-section .chart-content-wrapper .chart-block{margin-top: 40px;}
  .chart-content-section h1 span { display: inline; }
  .faq-section .title-block { padding-right: 30px; }
  .why-durable-skills-section .durable-skills-listing ul li .durable-skills-inner h3 { font-size: 36px; line-height: 1.25; }
  .why-durable-skills-section .durable-skills-listing ul { margin: 0 -8px -16px; }
  .why-durable-skills-section .durable-skills-listing ul li { padding: 0 8px 16px; }
  .why-durable-skills-section .durable-skills-listing .skills-listing-inner { padding: 0 25px; }
}
@media (max-width:767px) {
  .chart-content-section { padding: 70px 0 35px; }
  .why-durable-skills-section { padding: 35px 0 70px; }
  .faq-section { padding: 70px 0; }
  .links-accordian-outer .links-accordian-title svg { width: 22px; top: 1px;}
  .chart-content-section h1, .faq-section .faq-wrapper h2 { font-size: 32px; }
  .chart-content-section .chart-content-wrapper .content-block p { font-size: 16px; }
  .chart-content-section .chart-content-wrapper .content-block .link-wrapper { margin-top: 28px; }
  .skills-black-btn { height: 50px; line-height: 50px; font-size: 16px; padding: 0 20px; min-width: 240px; }
  .how-to-build-section .how-to-buid-wrapper p, .why-durable-skills-section .title-wrapper p { font-size: 22px; }
  .how-to-build-section .how-to-buid-wrapper::after { display: none; }
  .how-to-build-section .how-to-buid-wrapper { padding: 25px; }
  .faq-section .faq-wrapper { flex-direction: column; }
  .faq-section .title-block { padding-right: 0; margin-bottom: 25px; }
  .faq-section .faq-wrapper h2 { max-width: 100%; }
  .links-accordian-outer .links-accordian-inner + .links-accordian-inner { margin-top: 20px; }
  .links-accordian-outer .links-accordian-title h3 { font-size: 20px; }
  .links-accordian-outer .links-accordian-inner .links-accordian-content p { font-size: 14px; }
  .why-durable-skills-section .title-wrapper h2 { margin-bottom: 10px; }
  .why-durable-skills-section .title-wrapper { margin-bottom: 25px; }
  .why-durable-skills-section .durable-skills-listing .small-text { font-size: 14px; }
  .why-durable-skills-section .durable-skills-listing .skills-listing-inner { padding: 0; }
  .why-durable-skills-section .durable-skills-listing { margin-top: 30px; }
  .why-durable-skills-section .durable-skills-listing ul li { flex: 0 0 50%; max-width: 50%; }
  .why-durable-skills-section .durable-skills-listing ul li .durable-skills-inner h3 { font-size: 32px; }
  .why-durable-skills-section .durable-skills-listing .small-text { margin-top: 15px; }
}
@media (max-width:576px) {
  .chart-content-section h1, .faq-section .faq-wrapper h2 { font-size: 30px; }
  .how-to-build-section .how-to-buid-wrapper p, .why-durable-skills-section .title-wrapper p { font-size: 20px; }
  .why-durable-skills-section .durable-skills-listing ul { margin: 0 0 -15px; }
  .why-durable-skills-section .durable-skills-listing ul li { flex: 0 0 100%; max-width: 100%; padding: 0 0 15px; }
}
@media (max-width:375px) {
  .skills-black-btn { font-size: 14px; }
  .how-to-build-section .how-to-buid-wrapper p, .why-durable-skills-section .title-wrapper p { font-size: 18px; }
  .how-to-build-section .how-to-buid-wrapper { padding: 16px; }
  .how-to-build-section .how-to-buid-wrapper h2 { font-size: 14px; margin-bottom: 10px; }
  .links-accordian-outer .links-accordian-title h3 { font-size: 18px; }
}

body {
  font-family: 'Inter', sans-serif; /* Apply Montserrat font to the entire document */
}
.durable-chart-container {
  display: flex;
  justify-content: center;
  align-items: flex-start;
}

#durable-chart {
  overflow: inherit;
  height: 470px;
  width: 470px;
}

.durable-chart-container .tooltip {
  position: absolute;
  font-size: 11px;
  padding: 0;  
  /* border: 1px solid #ccc; */
  border-radius: 5px;
  pointer-events: none;
  opacity: 1;
  display: none;
  max-width: 246px;
  text-align: left;
  overflow: hidden;
  box-shadow: 0 5px 40px rgba(0,0,0,0.4);
}
.durable-chart-container .tooltip::after {
  position: absolute;
  content: "";
  border: 2px solid #fff;
  width: calc(100% - 8px);
  height: calc(100% - 8px);
  top: 4px;
  left: 4px;
  border-radius: 5px;
}
.durable-chart-container .tooltip.visible {
  display: block;
}
.durable-chart-container .tooltip-inner{
  padding: 15px 17px!important;
  font-size: 12px !important;
  font-family: "Inter" !important;
  border-radius: 5px;
  backdrop-filter: blur(12px);
  position: relative;
}
.durable-chart-container .tooltip-inner::after{
  position: absolute;
  content: "";
  width:100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: rgba(51,48,33,30%);
  z-index: -1;
}
.durable-chart-container .tooltip-inner.blue{
  background-color: rgba(12,25,144,80%);
}
.durable-chart-container .tooltip-inner.yellow{
  background-color: rgba(277, 147, 73, 90%);
}
.durable-chart-container .tooltip-inner.yellow::after{
  background-color: rgba(51,48,33,40%);
}
.durable-chart-container .tooltip-inner.light-blue{
  background-color: rgba(89, 120, 216, 95%);
}
.durable-chart-container .tooltip-inner.orange{
  background-color: rgba(219, 94, 56, 90%);
}
.durable-chart-container .tooltip-inner span{
  font-weight: 500;
  font-size: 14px;
  display: inline-block;
  margin-bottom: 8px;
  line-height: 1.21;
}
.durable-chart-container{
 overflow: hidden;
}
.durable-chart-container .durable-chart-wrapper{
  position: relative;
  padding:45px;
}
.durable-chart-container #curved1 {
  position: absolute;
  top: 70px;
  left: 203px;
  width: 450px;
  font: 22px / 1 'Inter', sans-serif;
  letter-spacing: 0;
  transform: rotate(45deg);
  z-index: -1;
  color:#111098;
}
.durable-chart-container #curved2 {
  position: absolute;
  bottom: 82px;
  left: 202px;
  width: 450px;
  font: 22px / 1 'Inter', sans-serif;
  letter-spacing: 0;
  transform: rotate(135deg) scale(-1);
  z-index: -1;
  color:#F18F36;
}
.durable-chart-container #curved3 {
  position: absolute;
  bottom: 79px;
  left: -90px;
  width: 450px;
  font: 22px / 1 'Inter', sans-serif;
  letter-spacing: 0;
  transform: rotate(226deg) scale(-1);
  z-index: -1;
  color:#3968F6;
}
.durable-chart-container #curved4 {
  position: absolute;
  top: 63px;
  left: -86px;
  width: 450px;
  font: 22px / 1 'Inter', sans-serif;
  letter-spacing: 0;
  transform: rotate(134deg) scale(-1);
  z-index: -1;
  color:#EB5326;
}
::-webkit-scrollbar {
  width: 1em;
  height: 4px;
  border-radius: 4px;
}
::-webkit-scrollbar-track {
  box-shadow: none;
}
::-webkit-scrollbar-thumb {
 background-color: #d1d1d1
}
@media(max-width:991px){
  .chart-content-section .chart-content-wrapper{
    margin:0 -24px;
  }
  .chart-content-section .chart-content-wrapper .content-block{
    padding:0 30px 24px;
  }
}
@media(max-width:767px){
  .durable-chart-wrapper{
    overflow-x: auto;
    overflow-y: hidden;
  }
}

/** manthan start */
.ul {
  list-style: none; /* Removes default bullets */
  padding-left: 0; /* Adjust for custom bullets */
}

.li {
  display: flex;
  align-items: flex-start; /* Align bullet and text in the same line */
}

.li::before {
  content: "•"; /* Custom bullet */
  color: black;
  font-size: 18px;
  margin-right: 8px;
}
.center-section {
  display: flex;
  justify-content: center;
  align-items: center;
  /* text-align: center; */
  /*height: 100vh; /* Adjust height as needed */
}
.custom-section-padding{
  padding: 120px 0 60px;
}
/** manthan end */