@media (min-width: 768px) {
    .tabs-nav--modal .tabs-nav__btn {
        padding: 0 15px
    }

    .tabs-nav--page {
        display: flex;
        margin-top: -4px;
        margin-left: auto;
        width: 220px
    }

    .tabs-nav--title {
        margin-bottom: 10px
    }

    .tabs-nav__btn {
        height: 46px;
        padding: 0 12px
    }

    .tabs-nav__btn__small {
        height: 32px;
        padding: 0 20px
    }

    .tabs-nav__btn span {
        margin-bottom: 8px
    }
}

.tabs-nav-wrap {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin: 30px auto 6px
}

.post {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    margin-top: 24px;
    height: auto
}

.post__cover {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 16/9;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 10px
}

.post__cover img {
    position: absolute;
    z-index: 1;
    height: 100%;
    width: 100%;
    inset: 0;
    object-fit: cover
}

.post__meta {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    margin-bottom: 10px
}

.post__date {
    font-size: 14px;
    line-height: 24px;
    font-weight: 400;
    color: var(--tf-tc2);
    margin-right: 16px
}

.post__date:last-child {
    margin-right: 0
}

.post__title {

    color: var(--tf-tc);
    font-weight: 600;
    font-size: 24px;
    line-height: 32px;
    margin-bottom: 10px
}

.post__text {
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
    color: var(--tf-tc2);
    margin-bottom: 0
}

.post__content {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%
}

.post--big {
    padding-bottom: 24px;
    border-bottom: 1px solid var(--tf-border)
}

.post--big .post__cover {
    max-width: 480px
}

.post--big .post__title {
    font-size: 26px;
    line-height: 34px;
    font-weight: 700
}

@media (min-width: 768px) {
    .post__title {
        font-size: 26px;
        line-height: 34px
    }

    .post--big .post__title {
        font-size: 30px;
        line-height: 38px
    }
}

@media (min-width: 1200px) {
    .post__cover {
        transition: transform .4s ease
    }

    .post__title {
        transition: color .4s ease
    }

    .post:hover .post__title {
        color: var(--tf-active)
    }

    .post:hover .post__cover {
        transform: translateY(-8px)
    }

    .post--big {
        display: grid;
        gap: 0 24px;
        grid-template-columns:repeat(auto-fit, minmax(420px, 1fr));
        margin-bottom: 10px
    }

    .post--big .post__cover {
        max-width: 100%
    }
}

.blog-grid {
    display: grid;
    gap: 0 16px;
    grid-template-columns:repeat(1, 1fr)
}

@media (min-width: 576px) {
    .blog-grid {
        grid-template-columns:repeat(2, 1fr)
    }
}

@media (min-width: 768px) {
    .blog-grid {
        gap: 0 24px
    }
}

@media (min-width: 1400px) {
    .blog-grid {
        grid-template-columns:repeat(3, 1fr)
    }
}

.cards {
    display: grid;
    gap: 16px;
    grid-template-columns:repeat(2, 1fr)
}

@media (min-width: 768px) {
    .cards {
        gap: 24px;
        grid-template-columns:repeat(3, 1fr)
    }
}

@media (min-width: 1400px) {
    .cards {
        grid-template-columns:repeat(5, 1fr)
    }
}

.cardp {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    border-radius: 16px;
    padding: 16px;
    position: relative
}

.cardp:before {
    content: '';
    position: absolute;
    z-index: 1;
    top: 1px;
    right: 1px;
    bottom: 1px;
    left: 1px;
    background-color: #0b1725;
    border-radius: 15px
}

.cardp__icon {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 60px;
    border-radius: 8px;
    margin-bottom: 20px
}

.cardp__icon svg {
    width: 32px
}

.cardp__title {
    position: relative;
    z-index: 2;
    font-size: 16px;
    line-height: 20px;
    color: #fff;
    font-weight: 700;
    text-align: center;
    width: 100%;
    margin-bottom: 0
}

.cardp--green {
    background-image: linear-gradient(170.64deg, rgba(15, 247, 150, 0.2) 8.3%, rgba(15, 247, 150, 0.1) 24.61%, rgba(15, 247, 150, 0.484) 37.69%, rgba(15, 247, 150, 0.1) 52.82%, rgba(15, 247, 150, 0) 91.65%, rgba(15, 247, 150, 0.2) 96.46%)
}

.cardp--green .cardp__icon {
    background: linear-gradient(90deg, rgba(1, 224, 117, 0.08) 0%, rgba(0, 162, 85, 0.08) 100%)
}

.cardp--green .cardp__title span {
    background: linear-gradient(90deg, #01e075 0%, #00a255 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.cardp--yellow {
    background-image: linear-gradient(170.64deg, rgba(253, 202, 80, 0.2) 8.3%, rgba(253, 202, 80, 0.1) 24.61%, rgba(253, 202, 80, 0.484) 37.69%, rgba(253, 202, 80, 0.1) 52.82%, rgba(253, 202, 80, 0) 91.65%, rgba(253, 202, 80, 0.2) 96.46%)
}

.cardp--yellow .cardp__icon {
    background: linear-gradient(90deg, rgba(253, 202, 80, 0.08) 0%, rgba(224, 138, 61, 0.08) 100%)
}

.cardp--yellow .cardp__title span {
    background: linear-gradient(90deg, #fdca50 0%, #e08a3d 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.cardp--blue {
    background-image: linear-gradient(170.64deg, rgba(106, 207, 253, 0.2) 8.3%, rgba(106, 207, 253, 0.1) 24.61%, rgba(106, 207, 253, 0.484) 37.69%, rgba(106, 207, 253, 0.1) 52.82%, rgba(106, 207, 253, 0) 91.65%, rgba(106, 207, 253, 0.2) 96.46%)
}

.cardp--blue .cardp__icon {
    background: linear-gradient(270deg, rgba(34, 112, 212, 0.08) 0%, rgba(106, 207, 253, 0.08) 100%)
}

.cardp--blue .cardp__title span {
    background: linear-gradient(270deg, #2270d4 0%, #6acffd 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.cardp--pink {
    background-image: linear-gradient(170.64deg, rgba(255, 124, 232, 0.2) 8.3%, rgba(255, 124, 232, 0.1) 24.61%, rgba(255, 124, 232, 0.484) 37.69%, rgba(255, 124, 232, 0.1) 52.82%, rgba(255, 124, 232, 0) 91.65%, rgba(255, 124, 232, 0.2) 96.46%)
}

.cardp--pink .cardp__icon {
    background: linear-gradient(90deg, rgba(255, 124, 232, 0.08) 0%, rgba(252, 76, 109, 0.08) 100%)
}

.cardp--pink .cardp__title span {
    background: linear-gradient(90deg, #ff7ce8 0%, #fc4c6d 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.cardp--purple {
    background-image: linear-gradient(170.64deg, rgba(166, 123, 255, 0.2) 8.3%, rgba(166, 123, 255, 0.1) 24.61%, rgba(166, 123, 255, 0.484) 37.69%, rgba(166, 123, 255, 0.1) 52.82%, rgba(166, 123, 255, 0) 91.65%, rgba(166, 123, 255, 0.2) 96.46%)
}

.cardp--purple .cardp__icon {
    background: linear-gradient(90deg, rgba(166, 123, 255, 0.08) 0%, rgba(120, 55, 255, 0.08) 100%)
}

.cardp--purple .cardp__title span {
    background: linear-gradient(90deg, #a67bff 0%, #7837ff 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

@media (min-width: 768px) {
    .cardp {
        padding: 24px
    }

    .cardp__icon {
        height: 80px
    }

    .cardp__icon svg {
        width: 48px
    }
}

.events {
    display: grid;
    gap: 16px;
    grid-template-columns:repeat(1, 1fr)
}

@media (min-width: 768px) {
    .events {
        gap: 24px;
        grid-template-columns:repeat(2, 1fr)
    }
}

@media (min-width: 1400px) {
    .events {
        grid-template-columns:repeat(3, 1fr)
    }
}

.event {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    border-radius: 16px;
    padding: 16px;
    position: relative;
    padding: 1px;
    background-image: linear-gradient(170.64deg, rgba(15, 247, 150, 0.2) 8.3%, rgba(15, 247, 150, 0.1) 24.61%, rgba(15, 247, 150, 0.484) 37.69%, rgba(15, 247, 150, 0.1) 52.82%, rgba(15, 247, 150, 0) 91.65%, rgba(15, 247, 150, 0.2) 96.46%)
}

.event__content {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    position: relative;
    width: 100%;
    border-radius: 15px;
    background-color: #0b1725;
    overflow: hidden;
    padding: 16px
}

/* --------------------------------------------- */
/* Promosyon grid'inde metinleri gizle (sadece promos sayfası) */
/* --------------------------------------------- */
.blog-grid .post__meta,
.blog-grid .post__text {
    display: none !important;
}

/* Başlık kalsın, büyük ama bold olmayan tipografi */
.blog-grid .post__title {
    display: block !important;
    margin: 10px 0 0 !important;
    text-align: center !important;
    font-weight: 500 !important; /* bold değil */
    font-size: clamp(18px, 2.2vw, 24px) !important;
    line-height: 1.2 !important;
    color: var(--tf-tc) !important;
}

/* Görsel ile kart arasındaki boşluğu kaldır */
.blog-grid .post__cover {
    margin-bottom: 0 !important;
}
