/* ============================================================
   ND Premium — Reviews Section
   /assets/css/nd-premium/reviews.css

   Макет (1200px контент):
   [  platform 520px  ][  grid 650px  ]
   grid = 2×2 карточек 310×370, gap ~30px
   ============================================================ */

.ndp-rev {
    background: #1a1a1a;
    width: 100%;
    overflow: hidden;
	margin-top: -1px;
}

.ndp-rev__block {
    display: flex;
    flex-direction: column;
    gap: 50px;
    align-items: center;
    padding-bottom: 100px;
}


.ndp-rev .section-header {
    position: relative;
    margin-left: 0px;
    display: flex;
    flex-direction: column;
    overflow: visible;
    max-width: 1280px;
    width: 100%;
    gap: 50px;
    align-items: flex-end;
    padding: 0 40px;
}
.ndp-rev .section-header__title {
    padding-left: 0px;
    white-space: wrap;
    max-width: 395px;
}


.ndp-rev .section-header__decor--img {
    width: 529px;
    margin-bottom: -119px;
}

/* ── Основной фрейм ── */
.ndp-rev__frame {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    gap: 30px;
    width: 100%;
    max-width: 1280px;
    padding: 0 40px;
}

/* ── Левый блок — платформа ── */
.ndp-rev__platform {
    flex: 0 0 520px;
    background: #202020;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    text-decoration: none;
    box-shadow:
        0 14px 64px -4px rgba(24, 39, 75, 0.12),
        0  8px 22px -6px rgba(24, 39, 75, 0.12);
    transition: background 0.2s ease;
    min-height: 400px;
}

.ndp-rev__platform:hover {
    background: #2a2a2a;
}

.ndp-rev__platform-icon {
    width: 174px;
    height: 174px;
    object-fit: cover;
    border-radius: 50%;
}

.ndp-rev__platform-fallback {
    width: 174px;
    height: 174px;
    background: #fc3f1d;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-family: 'Manrope', sans-serif;
    font-size: 80px;
    font-weight: 700;
}

/* ── Правый блок — сетка 2×2 ── */
.ndp-rev__grid {
    flex: 1 1 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 370px 370px;
    gap: 30px;
}

/* Карточка видеоотзыва */
.ndp-rev__card {
    position: relative;
    background: #ffffff;
    overflow: hidden;
    display: block;
    box-shadow:
        0 14px 64px -4px rgba(24, 39, 75, 0.12),
        0  8px 22px -6px rgba(24, 39, 75, 0.12);
    transition: transform 0.2s ease;
}

.ndp-rev__card:hover {
    transform: scale(1.02);
}

.ndp-rev__card img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    display: block;
}

/* Play-кнопка поверх фото */
.ndp-rev__play {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.2s ease;
    z-index: 2;
}

.ndp-rev__card:hover .ndp-rev__play {
    opacity: 1;
}

/* ============================================================
   Адаптив
   ============================================================ */

@media (max-width: 1440px){
	
.ndp-rev .section-header__title {max-width: 293px;}
	.ndp-rev .section-header__decor--img {
    width: 375px;
    margin-bottom: -95px;
}
}


@media (max-width: 1100px) {
    .ndp-rev__platform { flex: 0 0 380px; }
    .ndp-rev__grid { grid-template-rows: 300px 300px; gap: 20px; }
}

@media (max-width: 900px) {


.ndp-rev .section-header__title {
    max-width: 193px;
}
.ndp-rev .section-header__decor--img {
    width: 270px;
    margin-bottom: -80px;
}
    .ndp-rev__frame {
        flex-direction: column;
        align-items: stretch;
    }

    .ndp-rev__platform {
        flex: none;
        min-height:300px;
    }

    .ndp-rev__grid {
        grid-template-rows: 425px 425px;
    }
}

@media (max-width: 600px) {
    .ndp-rev__block  { gap: 0; padding-bottom: 60px; }
    .ndp-rev__frame  { padding: 20px 24px; gap: 16px; }
    .ndp-rev__grid   {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 300px 300px;
        gap: 12px;
    }
.ndp-rev .section-header {
    padding: 0 24px;
}


    .ndp-rev__platform-icon,
    .ndp-rev__platform-fallback { width: 100px; height: 100px; font-size: 48px; }
}
