.synthetic_indices .inner { max-width: 1920px; }
.synthetic_indices .container { max-width: 1320px; margin-left: auto; margin-right: auto; }

.what { padding-top: 120px; padding-bottom: 60px; overflow: hidden; background: linear-gradient(180deg, #1A1A1A 0%, #000000 100%); }
.what .top { text-align: center; width: 100%; max-width: 900px; margin-left: auto; margin-right: auto; }
.what .top .title { font-weight: 900; font-size: 48px; margin-bottom: 24px; }
.what .top .desc { font-weight: 400; font-size: 16px; margin-bottom: 48px; }
.what .bottom .small_title { font-weight: 900; font-size: 16px; margin-bottom: 24px; text-align: center; }
.what .bottom .swiper.swiper-no-swiping { cursor: auto; }
.what .bottom .swiper.swiper-no-swiping .swiper-wrapper { display: flex !important; flex-wrap: nowrap !important; justify-content: center; width: auto !important; transform: none !important; transition: none !important; }
.what .bottom .swiper.swiper-no-swiping .swiper-wrapper .swiper-slide:last-child { margin-right: 0 !important; }
.what .bottom .swiper .swiper-wrapper { touch-action: pan-y; }
.what .bottom .swiper .swiper-wrapper .swiper-slide { width: 100%; height: auto; max-width: 245px; background: #000000; border: 1px solid #2A2A2A; padding: 32px; border-radius: 32px; }
.what .bottom .swiper .swiper-wrapper.loading .swiper-slide + .swiper-slide { margin-left: 24px; }
.what .bottom .swiper .swiper-wrapper .swiper-slide .img { text-align: center; margin-bottom: 12px; width: 100%; max-width: 153px; margin-left: auto; margin-right: auto; }
.what .bottom .swiper .swiper-wrapper .swiper-slide .img img { width: 100%; }
.what .bottom .swiper .swiper-wrapper .swiper-slide .text { font-weight: 400; font-size: 24px; text-align: center; margin-bottom: 0; margin-left: auto; margin-right: auto; word-spacing: 100vw; }
.what .bottom .swiper .swiper-wrapper .swiper-slide:nth-child(3) .text { max-width: 100px; }

.why { padding-top: 60px; padding-bottom: 60px; }
.why .title { width: 100%; max-width: 700px; margin-left: auto; margin-right: auto; text-align: center; font-weight: 900; font-size: 48px; margin-bottom: 48px; }
.why .content { display: grid; grid-template-columns: repeat(3, 1fr); gap: 48px; }
.why .content .item { background: linear-gradient(120.5deg, #000000 0%, #1A1A1A 100%); border: 1px solid #2A2A2A; border-radius: 32px; padding: 48px 32px; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 12px; text-align: center; }
.why .content .item .small_title { width: 100%; font-weight: 900; font-size: 24px; color: #006BFF; }
.why .content .item .desc { font-weight: 400; font-size: 16px; margin-bottom: 0; width: 100%; }

.explore { padding-top: 60px; padding-bottom: 120px; }
.explore .layout { display: flex; gap: 48px; }
.explore .layout > * { flex: 1; }
.explore .head { text-align: center; }
.explore .head .box { display: flex; flex-direction: column; justify-content: center; position: sticky; top: 150px; max-width: 600px; margin-left: auto; margin-right: auto; }
.explore .head .title { font-weight: 900; font-size: 48px; margin-bottom: 24px; font-weight: 900; }
.explore .head .blue_button { padding-left: 20px; padding-right: 20px; max-width: max-content; margin-left: auto; margin-right: auto; }
.explore .content { display: grid; grid-template-columns: 1fr; grid-auto-rows: 1fr; gap: 24px; }
.explore .content .item { outline: 1px solid #2A2A2A; padding: 32px; border-radius: 32px; display: flex; gap: 24px; flex-direction: column; justify-content: space-between; position: sticky; top: 150px; background: linear-gradient(115.66deg, #000000 44.35%, #131A23 98.41%); }
.explore .content .item .left { display: grid; grid-template-columns: repeat(2, 1fr); align-items: center; gap: 48px; }
.explore .content .item .left > * { flex: 1; }
.explore .content .item .left .img { animation: moveUpDown 4s linear infinite; }
.explore .content .item .left .small_title { font-weight: 900; font-size: 28px; }
.explore .content .item .top .desc { font-weight: 400; font-size: 16px; margin-bottom: 24px; }
.explore .content .item .top .text { padding-top: 24px; border-top: 1px solid #2A2A2A; font-weight: 400; font-size: 14px; margin-bottom: 0; }

@keyframes moveUpDown {
    0% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-20px);
    }
    100% {
        transform: translateY(0);
    }
}

@media (max-width: 1440px) {
    .why .content { gap: 24px; }
    .why .content .item { text-align: left; }
    .why .content .item .small_title { font-size: 20px; }
}

@media (max-width: 1200px) {
    .why .content .item { padding: 32px; }
}

@media (max-width: 1040px) {
    .what { padding-top: 64px; padding-bottom: 32px; }

    .why { padding-top: 32px; padding-bottom: 32px; }

    .explore { padding-top: 32px; padding-bottom: 64px; }
}

@media (max-width: 1025px) {
    .explore .head { text-align: left; }
    .explore .head .blue_button { margin-left: 0; }
    .explore .content .item .left { gap: 24px; }
}

@media (max-width: 900px) {
    .explore .layout { flex-direction: column; }
    .explore .head { text-align: center; }
    .explore .head .title { font-size: 36px; }
    .explore .head .box { height: max-content !important; }
    .explore .head .blue_button { margin-left: auto; }
    .explore .content { grid-auto-rows: auto; }
    .explore .content .item { position: relative; top: 0; border-radius: 24px; }
    .explore .content .item .left { gap: 32px; }
}

@media (max-width: 768px) {
    .what .top .title { font-size: 36px; }
    .what .top .desc { margin-bottom: 32px; }
    .what .bottom .swiper .swiper-wrapper .swiper-slide { border-radius: 24px; }

    .why .title { font-size: 36px; margin-bottom: 32px; }
    .why .content { grid-template-columns: 1fr; }
    .why .content .item { text-align: center; border-radius: 24px; }
    
    .explore .layout { gap: 32px; }
    .explore .head .title { font-size: 36px; }
    .explore .content .item .left .small_title { font-size: 24px; }
}

@media (max-width: 540px) {
    .what .top .title { font-size: 32px; }
    .what .top .desc { margin-bottom: 24px; }

    .why .title { font-size: 32px; margin-bottom: 24px; }
    .why .content .item { padding: 24px; }
    
    .explore .layout { gap: 24px; }
    .explore .head .title { font-size: 32px; }
    .explore .content .item { background: linear-gradient(180deg, #000000 44.35%, #131A23 98.41%); }
    .explore .content .item .left { gap: 16px; }
}

@media (max-width: 400px) {
    .explore .content .item .left { gap: 16px; grid-template-columns: 1fr; }
    .explore .content .item .left .img { order: 2; text-align: center; }
    .explore .content .item .left .small_title { order: 1; }
}
/* ! puprimecom|2026-06-08 15:35:38 ! */