/* ***** **** *** ** * ABOUT SECTION DESIGN * ** *** **** ***** */
:root {
  --first-color: #0e2431;
  --second-color: #6a59d1;
  --third-color: #777;

  --hover-color: #614fd0;

  --body-bg-color: #fefefe;
  --card-bg-color: #fff;
  --popup-bg-color: #fff;

  --bg-transparent-color: rgba(0, 0, 0, 0.1);
  --transparent-color-01: rgba(0, 0, 0, 0.1);
  --transparent-color-01: rgba(106, 89, 209, 0.1);
  --line-color: #d7d7d7;

  --color-filter: invert(1);

  --box-shadow: 0px 0px 20px rgba(0 0 0 / 10%);

  --small-font-size: 0.9em;
  --normal-font-size: 1em;

  --scroll-bar-color: #c5cadf;
  --scroll-thumb-color: #70768a;
  --scroll-thumb-hover-color: #454f6b;

  --bg-color: #191f36;
  --snd-bf-color: #262b40;
  --text-color: #fff;
  --main-color: #59b1f4;

  --txt-color: #c2c2c2;
  --border-gradient: linear-gradient(to right, #2cff92, #1080cf);
}

.about {
  width: 100%;
  margin-top: -2rem;
}
.flex-center {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.section {
  position: relative;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding: 6rem 2rem 2rem;
}
.sub-section {
  position: relative;
  width: 1150px;
  margin-left: auto;
  margin-right: auto;
  padding: 6rem 0;
}
.section-title-01 {
  font-size: 4.5rem;
  font-weight: 800;
  margin-bottom: 2rem;
  background: linear-gradient(
    to top,
    transparent 0%,
    var(--scroll-bar-color) 70%
  );
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  opacity: 0.1;
}
.section-title-02 {
  font-size: 2.5rem;
  font-weight: 700;
  transform: translateY(-60px);
}

.container {
  position: relative;
  flex-direction: column;
}

.about .container .content {
  column-gap: 40px;
  width: 100%;
}
.about-img {
  position: relative;
  margin-top: -5rem;
  margin-left: -3rem;
  filter: drop-shadow(0px 10px 10px gray);
}
.about-img img {
  width: 25vw;
  border-radius: 10px;
  margin-top: -3rem;
  margin-left: 10%;
}
.about-description h3,
h4 {
  padding: 0 0 1rem 0;
}
.about-info .about-description {
  max-width: 600px;
}
.about-info .about-description h3 {
  font-size: 2em;
  font-weight: 600;
  margin-bottom: 10px;
  color: var(--txt-color);
}
.about-info .about-description h4 {
  font-size: 1.3em;
  font-weight: 600;
  margin-bottom: 10px;
  color: var(--body-bg-color);
}

/* ***************************** */
.about-info .about-description h4 span {
  color: aqua;
}
.about-info .about-description p {
  color: var(--txt-color);
  font-size: medium;
  margin-bottom: 15px;
  padding-bottom: 25px;
  border-bottom: 0.1px solid var(--scroll-bar-color);
  border-top: 2px solid var(--scroll-bar-color);
  text-align: justify;
}
.about-info .profetional-list {
  display: flex;
  column-gap: 40px;
  margin-top: 1rem;
}
.about-info .profetional-list .list-item h4 {
  font-size: 1.2em;
  font-weight: 500;
  margin-top: 0.5rem;
  margin-bottom: -0.7rem;
  color: var(--txt-color);
}
.about-info .profetional-list .list-item span {
  color: #517fa4;
  font-size: medium;
}
.list-item span {
  margin-top: -5rem;
}