.vision-quote-section {
  position: relative;
  min-height: 470px;
  display: flex;
  align-items: center;
  background:
    radial-gradient(circle at 15% 50%, var(--color-005abe-alpha-28), var(--color-transparent) 28%),
    radial-gradient(
      circle at 65% 55%,
      var(--color-009fe3-alpha-08),
      var(--color-transparent) 30%
    ),
    linear-gradient(180deg, var(--color-06111d) 0%, var(--color-020b14) 100%);
  overflow: hidden;
  padding: 200px 0;
}

.vision-quote-section::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url("assets/images/candlestick-bg.png");
  background-size: cover;
  background-position: center;
  opacity: 0.22;
  pointer-events: none;
}

.vision-quote-section::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      90deg,
      var(--color-020b14-alpha-18),
      var(--color-transparent) 45%,
      var(--color-020b14-alpha-25)
    ),
    linear-gradient(180deg, var(--color-020b14-alpha-1), var(--color-020b14-alpha-45));
  pointer-events: none;
}

.vision-quote-section .container {
  width: min(100% - 80px, 1280px);
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

.vision-quote-content {
  max-width: 850px;
  margin: 0 auto;
  text-align: center;
}

.vision-quote-content h2 {
  margin-bottom: 20px;
  color: var(--color-white);
  font-size: var(--font-size-fluid-38-54);
  line-height: 1.1;
  font-weight: 800;
  letter-spacing: -1px;
}

.vision-quote-text {
  position: relative;
  display: inline-block;
  max-width: 820px;
  margin-top: 30px;
}

.vision-quote-text p {
  margin: 0;
  color: var(--color-white);
  font-size: var(--font-size-36);
  line-height: 1.35;
  font-weight: 300;
  letter-spacing: -0.6px;
}

.quote-mark {
  position: absolute;
  color: var(--color-brand-accent);
  font-size: var(--font-size-fluid-70-115);
  line-height: 1;
  font-weight: 900;
  font-family: Arial, sans-serif;
}

.quote-left {
  left: -70px;
  top: -25px;
}

.quote-right {
  right: -70px;
  bottom: -55px;
}

/* Tablet */
@media (max-width: 991px) {
  .vision-quote-section {
    min-height: 430px;
  }

  .vision-quote-section .container {
    width: min(100% - 40px, 1280px);
  }

  .quote-left {
    left: -45px;
  }

  .quote-right {
    right: -45px;
  }
}

/* Mobile */
@media (max-width: 575px) {
  .vision-quote-section {
    min-height: 420px;
    padding: 70px 0;
  }

  .vision-quote-section .container {
    width: min(100% - 28px, 1280px);
  }

  .vision-quote-content h2 {
    font-size: var(--font-size-18);
    margin-bottom: 24px;
  }

  .vision-quote-text p {
    font-size: var(--font-size-26);
    line-height: 1.4;
  }

  .quote-mark {
    position: relative;
    display: inline-block;
    font-size: var(--font-size-58);
  }

  .quote-left {
    left: auto;
    top: auto;
    margin-right: 8px;
    vertical-align: top;
  }

  .quote-right {
    right: auto;
    bottom: auto;
    margin-left: 8px;
    vertical-align: bottom;
  }
}
.mission-values-section {
  position: relative;
  background:
    radial-gradient(
      circle at 18% 18%,
      var(--color-0084ff-alpha-12),
      var(--color-transparent) 28%
    ),
    radial-gradient(
      circle at 50% 70%,
      var(--color-0084ff-alpha-14),
      var(--color-transparent) 24%
    ),
    linear-gradient(180deg, var(--color-03111e) 0%, var(--color-020b14) 100%);
  padding: 110px 0 100px;
  overflow: hidden;
}

.mission-values-section::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(var(--color-0099dc-alpha-05) 1px, var(--color-transparent) 1px),
    linear-gradient(90deg, var(--color-0099dc-alpha-04) 1px, var(--color-transparent) 1px);
  background-size: 120px 120px;
  opacity: 0.08;
  pointer-events: none;
}

.mission-values-section .container {
  /* width: min(100% - 80px, 1280px); */
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

/* Section Head */
.mv-section-head {
  text-align: center;
  margin-bottom: 42px;
}

.mv-section-head h2 {
  margin: 0;
  color: var(--color-white);
  font-size: var(--font-size-fluid-38-54);
  line-height: 1.1;
  font-weight: 800;
  letter-spacing: -1px;
}

.mv-section-head p {
  margin: 12px 0 0;
  color: var(--color-ffffff-alpha-58);
  font-size: var(--font-size-15);
  line-height: 1.7;
}

/* Mission */
.mv-mission-block {
  margin-bottom: 110px;
}

.mv-mission-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  max-width: 1400px;
  margin: 0 auto;
}

@media (min-width: 992px) {
  .mv-mission-card:last-child {
    grid-column: 2;
  }
}

.mv-mission-card {
  min-height: 185px;
  padding: 34px 24px;
  border-radius: 18px;
  text-align: center;
  background: linear-gradient(
    135deg,
    var(--color-ffffff-alpha-04),
    var(--color-ffffff-alpha-02)
  );
  border: 1px solid var(--color-ffffff-alpha-08);
  transition:
    transform 0.35s ease,
    border-color 0.35s ease,
    box-shadow 0.35s ease;
}

.mv-mission-card:hover {
  transform: translateY(-8px);
  border-color: var(--color-009fe3-alpha-45);
  box-shadow: 0 18px 50px var(--color-009fe3-alpha-1);
}

.mv-card-icon {
  width: 38px;
  height: 38px;
  margin: 0 auto 18px;
  display: grid;
  place-items: center;
  color: var(--color-brand-accent);
}

.mv-card-icon svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.mv-mission-card h3 {
  margin: 0 0 14px;
  color: var(--color-white);
  font-size: var(--font-size-18);
  line-height: 1.25;
  font-weight: 700;
}

.mv-mission-card p {
  margin: 0;
  color: var(--color-ffffff-alpha-58);
  font-size: var(--font-size-14);
  line-height: 1.75;
}

/* Core Values */
.mv-values-block {
  padding-top: 10px;
}

.mv-values-stage {
  position: relative;
  max-width: 1024px;
  min-height: 560px;
  margin: 0 auto;
}

.mv-values-center {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 228px;
  height: 228px;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: linear-gradient(180deg, var(--color-1c9ae1) 0%, var(--color-1197e2) 100%);
  box-shadow:
    0 0 0 18px var(--color-009fe3-alpha-03),
    0 0 40px var(--color-009fe3-alpha-24);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 24px;
}

.mv-values-center h2 {
  margin: 0 0 10px;
  color: var(--color-white);
  font-size: var(--font-size-22);
  line-height: 1.2;
  font-weight: 800;
}

.mv-values-center p {
  margin: 0;
  color: var(--color-ffffff-alpha-88);
  font-size: var(--font-size-13);
  line-height: 1.6;
}

.mv-value-item {
  position: absolute;
  width: 230px;
  text-align: left;
}

.mv-value-topline {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}

.mv-mini-icon {
  width: 18px;
  height: 18px;
  display: inline-grid;
  place-items: center;
  color: var(--color-brand-accent);
}

.mv-mini-icon svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.mv-value-item h3 {
  margin: 0;
  color: var(--color-white);
  font-size: var(--font-size-16);
  line-height: 1.2;
  font-weight: 700;
}

.mv-value-item p {
  margin: 0;
  color: var(--color-ffffff-alpha-58);
  font-size: var(--font-size-14);
  line-height: 1.7;
}

.mv-value-left-top {
  left: 140px;
  top: 45px;
  text-align: right;
}

.mv-value-left-top .mv-value-topline {
  justify-content: flex-end;
}

.mv-value-left-bottom {
  left: 105px;
  top: 162px;
  text-align: right;
}

.mv-value-left-bottom .mv-value-topline {
  justify-content: flex-end;
}

.mv-value-right-top {
  right: 125px;
  top: 45px;
}

.mv-value-right-bottom {
  right: 90px;
  top: 170px;
}

.mv-value-bottom-center {
  left: 50%;
  bottom: 18px;
  transform: translateX(-50%);
  text-align: center;
}

.mv-value-bottom-center .mv-value-topline {
  justify-content: center;
}

/* Tablet */
@media (max-width: 991px) {
  .mission-values-section {
    padding: 90px 0 85px;
  }

  .mission-values-section .container {
    width: min(100% - 40px, 1280px);
  }

  .mv-mission-grid {
    grid-template-columns: 1fr;
    max-width: 620px;
  }

  .mv-mission-block {
    margin-bottom: 80px;
  }

  .mv-values-stage {
    min-height: auto;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
    max-width: 760px;
  }

  .mv-values-center,
  .mv-value-item {
    position: relative;
    inset: auto;
    width: 100%;
    transform: none;
  }

  .mv-values-center {
    order: -1;
    grid-column: 1 / -1;
    margin: 0 auto 10px;
  }

  .mv-value-left-top,
  .mv-value-left-bottom,
  .mv-value-right-top,
  .mv-value-right-bottom,
  .mv-value-bottom-center {
    text-align: left;
  }

  .mv-value-left-top .mv-value-topline,
  .mv-value-left-bottom .mv-value-topline,
  .mv-value-bottom-center .mv-value-topline {
    justify-content: flex-start;
  }

  .mv-value-item {
    padding: 22px;
    border-radius: 16px;
    background: var(--color-ffffff-alpha-03);
    border: 1px solid var(--color-ffffff-alpha-07);
  }
}

/* Mobile */
@media (max-width: 575px) {
  .mission-values-section {
    padding: 65px 0;
  }

  .mission-values-section .container {
    width: min(100% - 28px, 1280px);
  }

  .mv-section-head h2 {
    font-size: var(--font-size-32);
  }

  .mv-section-head p {
    font-size: var(--font-size-14);
  }

  .mv-mission-card {
    min-height: auto;
    padding: 28px 20px;
  }

  .mv-mission-card h3 {
    font-size: var(--font-size-17);
  }

  .mv-mission-card p,
  .mv-value-item p {
    font-size: var(--font-size-13);
  }

  .mv-values-stage {
    grid-template-columns: 1fr;
  }

  .mv-values-center {
    width: 210px;
    height: 210px;
    padding: 22px;
  }

  .mv-values-center h2 {
    font-size: var(--font-size-20);
  }

  .mv-values-center p {
    font-size: var(--font-size-12);
  }
}

.core-values-section {
  position: relative;
  background:
    radial-gradient(
      circle at 50% 45%,
      var(--color-0069d2-alpha-16),
      var(--color-transparent) 34%
    ),
    linear-gradient(180deg, var(--color-020b14) 0%, var(--color-020b14) 100%);
  padding: 0px 0 120px;
  overflow: hidden;
}

.core-values-section .container {
  width: min(100% - 80px, 1280px);
  margin: 0 auto;
}

.core-values-stage {
  position: relative;
  max-width: 1050px;
  min-height: 560px;
  margin: 0 auto;
}

/* Center Circle */
.core-values-center {
  position: absolute;
  left: 50%;
  top: 42%;
  width: 320px;
  height: 320px;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: var(--color-1199dc);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 42px;
  z-index: 3;
}

.core-values-center::before {
  content: "";
  position: absolute;
  inset: -18px;
  border-radius: 50%;
  background: radial-gradient(circle, var(--color-6d49ff-alpha-2), var(--color-transparent) 68%);
  z-index: -1;
}

.core-values-center h2 {
  margin: 0 0 18px;
  color: var(--color-white);
  font-size: var(--font-size-34);
  line-height: 1.1;
  font-weight: 800;
  letter-spacing: -0.7px;
}

.core-values-center p {
  max-width: 235px;
  margin: 0;
  color: var(--color-ffffff-alpha-92);
  font-size: var(--font-size-15);
  line-height: 1.65;
}

/* Value Items */
.core-value-point {
  position: absolute;
  width: 265px;
  z-index: 2;
}

.core-value-title {
  display: flex;
  align-items: center;
  gap: 13px;
  margin-bottom: 14px;
}

.core-value-title h3 {
  margin: 0;
  color: var(--color-white);
  font-size: var(--font-size-22);
  line-height: 1.2;
  font-weight: 800;
}

.core-value-point p {
  margin: 0;
  color: var(--color-ffffff-alpha-76);
  font-size: var(--font-size-16);
  line-height: 1.65;
}

.core-value-icon {
  width: 30px;
  height: 30px;
  display: inline-grid;
  place-items: center;
  flex-shrink: 0;
  color: var(--color-brand-accent);
}

.core-value-icon svg {
  width: 30px;
  height: 30px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.55;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Exact Positions */
.core-value-left {
  text-align: right;
}

.core-value-left .core-value-title {
  justify-content: flex-end;
}

.core-value-right {
  text-align: left;
}

.core-value-courage {
  left: 10px;
  top: 70px;
}

.core-value-courage p {
  max-width: 235px;
  margin-left: auto;
}

.core-value-honesty {
  left: -20px;
  top: 245px;
  width: 300px;
}

.core-value-care {
  right: 30px;
  top: 72px;
  width: 250px;
}

.core-value-respect {
  right: 30px;
  top: 250px;
  width: 250px;
}

.core-value-lead {
  left: 50%;
  bottom: 30px;
  width: 260px;
  transform: translateX(-50%);
  text-align: center;
}

.core-value-lead .core-value-title {
  justify-content: center;
}

/* Tablet */
@media (max-width: 991px) {
  .core-values-section {
    padding: 80px 0;
  }

  .core-values-section .container {
    width: min(100% - 40px, 1280px);
  }

  .core-values-stage {
    min-height: auto;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }

  .core-values-center,
  .core-value-point {
    position: relative;
    inset: auto;
    transform: none;
  }

  .core-values-center {
    grid-column: 1 / -1;
    margin: 0 auto 30px;
  }

  .core-value-point {
    width: 100%;
    padding: 26px;
    border-radius: 18px;
    background: var(--color-ffffff-alpha-035);
    border: 1px solid var(--color-ffffff-alpha-075);
    text-align: left;
  }

  .core-value-left .core-value-title,
  .core-value-lead .core-value-title {
    justify-content: flex-start;
  }

  .core-value-left .core-value-title {
    flex-direction: row-reverse;
    justify-content: flex-end;
  }
}

/* Mobile */
@media (max-width: 575px) {
  .core-values-section {
    padding: 65px 0;
  }

  .core-values-section .container {
    width: min(100% - 28px, 1280px);
  }

  .core-values-stage {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .core-values-center {
    width: 260px;
    height: 260px;
    padding: 30px;
    margin-bottom: 22px;
  }

  .core-values-center h2 {
    font-size: var(--font-size-28);
  }

  .core-values-center p {
    font-size: var(--font-size-13);
  }

  .core-value-point {
    padding: 22px;
  }

  .core-value-title h3 {
    font-size: var(--font-size-20);
  }

  .core-value-point p {
    font-size: var(--font-size-14);
  }

  .core-value-icon,
  .core-value-icon svg {
    width: 25px;
    height: 25px;
  }
}

.igi-about-section {
  background:
    radial-gradient(
      circle at 80% 20%,
      var(--color-009fe3-alpha-12),
      var(--color-transparent) 35%
    ),
    var(--color-020b14);

  padding: 150px 0;
}

.igi-about-header {
  max-width: 900px;

  margin-bottom: 80px;
}

.igi-about-header span {
  margin: 18px 0 14px;
  color: var(--color-text-dark);
  font-weight: 600;
  font-family: gotham;
  font-size: var(--font-size-14);
  line-height: 1.5;
}

.igi-about-container {
  max-width: 1330px;
  margin: 0 auto;
}

.igi-about-header h1 {
  font-size: var(--font-size-56);

  line-height: 1.2;

  color: var(--color-white);

  margin-top: 25px;

  font-weight: 700;
}

.igi-about-grid {
  display: grid;

  grid-template-columns: 1.2fr 0.8fr;

  gap: 90px;

  align-items: center;
}

.igi-about-content p {
  color: var(--color-ffffff-alpha-65);

  font-size: var(--font-size-17);

  line-height: 1.9;

  margin-bottom: 25px;
}

.igi-about-content .lead {
  font-size: var(--font-size-22);

  line-height: 1.7;

  color: var(--color-white);
}

/* Highlights */

.igi-about-highlights {
  display: grid;

  grid-template-columns: repeat(2, 1fr);

  gap: 40px;
}

.highlight-item {
  border-left: 2px solid var(--color-brand-accent);

  padding-left: 25px;
}

.highlight-item strong {
  display: block;

  font-size: var(--font-size-52);

  color: var(--color-white);

  line-height: 1;

  margin-bottom: 12px;
}

.highlight-item span {
  color: var(--color-9ca7b3);

  font-size: var(--font-size-14);
}

/* Bottom */

.igi-about-bottom {
  margin-top: 100px;

  padding-top: 60px;

  border-top: 1px solid var(--color-ffffff-alpha-12);

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 80px;
}

.igi-about-bottom h3 {
  color: var(--color-white);

  font-size: var(--font-size-26);

  margin-bottom: 18px;
}

.igi-about-bottom p {
  color: var(--color-ffffff-alpha-65);

  font-size: var(--font-size-16);

  line-height: 1.8;
}

@media (max-width: 991px) {
  .igi-about-grid,
  .igi-about-bottom {
    grid-template-columns: 1fr;

    gap: 40px;
  }

  .igi-about-header h1 {
    font-size: var(--font-size-38);
  }

  .igi-about-highlights {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 575px) {
  .igi-about-highlights {
    grid-template-columns: 1fr;
  }

  .highlight-item strong {
    font-size: var(--font-size-40);
  }
}

.core-values-section {
  padding: 150px 0;

  background:
    radial-gradient(
      circle at 20% 50%,
      var(--color-009fe3-alpha-18),
      var(--color-transparent) 35%
    ),
    var(--color-020b14);

  overflow: hidden;
}

.values-layout {
  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 100px;

  align-items: center;
}

/* NETWORK */

.value-network {
  height: 500px;

  width: 500px;

  position: relative;

  margin: auto;
}

.network-center {
  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  width: 190px;

  height: 190px;

  border-radius: 50%;

  background: linear-gradient(135deg, var(--color-brand-accent), var(--color-brand-secondary));

  display: flex;

  flex-direction: column;

  justify-content: center;

  align-items: center;

  color: var(--color-white);

  box-shadow: 0 0 80px var(--color-009fe3-alpha-4);
}

.network-center span {
  font-size: var(--font-size-13);

  letter-spacing: 4px;
}

.network-center strong {
  font-size: var(--font-size-34);
}

.network-value {
  position: absolute;

  width: 145px;

  height: 145px;

  border-radius: 50%;

  display: flex;

  flex-direction: column;

  justify-content: center;

  align-items: center;

  text-align: center;

  color: var(--color-white);

  font-size: var(--font-size-16);

  background: var(--color-ffffff-alpha-05);

  border: 1px solid var(--color-ffffff-alpha-18);

  backdrop-filter: blur(12px);

  transition: 0.4s ease;
}

.network-value div {
  color: var(--color-brand-accent);

  font-size: var(--font-size-12);

  margin-bottom: 8px;
}

.network-value:hover {
  transform: scale(1.1);

  background: var(--color-009fe3-alpha-2);

  border-color: var(--color-brand-accent);
}

.value-1 {
  top: 20px;

  left: 180px;
}

.value-2 {
  right: 40px;

  top: 170px;
}

.value-3 {
  bottom: 40px;

  right: 100px;
}

.value-4 {
  bottom: 40px;

  left: 100px;
}

.value-5 {
  left: 40px;

  top: 170px;
}

/* CONTENT */

.section-label {
  color: var(--color-brand-accent);

  font-size: var(--font-size-12);

  letter-spacing: 3px;

  font-weight: 700;
}

.values-content h2 {
  color: var(--color-white);

  font-size: var(--font-size-52);

  line-height: 1.2;

  margin: 25px 0;
}

.values-intro {
  font-size: var(--font-size-18);

  line-height: 1.8;

  color: var(--color-ffffff-alpha-6);

  margin-bottom: 45px;
}

.description-item {
  padding: 22px 0;

  border-bottom: 1px solid var(--color-ffffff-alpha-12);

  opacity: 0.5;

  transition: 0.3s ease;
}

.description-item.active,
.description-item:hover {
  opacity: 1;
}

.description-item h3 {
  font-size: var(--font-size-28);

  color: var(--color-white);

  margin-bottom: 8px;
}

.description-item p {
  color: var(--color-ffffff-alpha-6);

  font-size: var(--font-size-15);

  line-height: 1.7;
}

@media (max-width: 1000px) {
  .values-layout {
    grid-template-columns: 1fr;
  }

  .value-network {
    transform: scale(0.85);
  }
}

@media (max-width: 600px) {
  .value-network {
    transform: scale(0.65);

    margin-left: -70px;
  }

  .values-content h2 {
    font-size: var(--font-size-36);
  }
}
