/* ============================================================
   CATALOG CLEAN FRAME FINAL V103

   ВАЖНО:
   - размеры НЕ задаём
   - сетку НЕ задаём
   - высоту НЕ задаём
   - ширину НЕ задаём
   - hover transform НЕ трогаем

   Только визуал карточки.
   ============================================================ */


/* ============================================================
   1. САМА КАРТОЧКА

   Никакой border внутри.
   Никакого inset-shadow.
   ============================================================ */

.catalog-page .catalog-folder-card{

    position:relative!important;

    overflow:hidden!important;

    border:0!important;
    outline:0!important;

    background:transparent!important;
    background-image:none!important;

    border-radius:18px!important;

    /*
     * ВАЖНО:
     * это ВНЕШНИЙ контур, а не inset.
     * Поэтому внутри карточки никаких полос.
     */
    box-shadow:
        0 0 0 1px rgba(25,25,25,.30)!important;
}


/* DARK */

html[data-site-theme="dark"]
.catalog-page .catalog-folder-card{

    box-shadow:
        0 0 0 1px rgba(255,255,255,.24)!important;
}


/* LIGHT */

html[data-site-theme="light"]
.catalog-page .catalog-folder-card{

    box-shadow:
        0 0 0 1px rgba(20,20,20,.30)!important;
}


/* ============================================================
   2. КАРТИНКА ФИЗИЧЕСКИ ЗАПОЛНЯЕТ ВСЮ КАРТОЧКУ
   ============================================================ */

.catalog-page .catalog-folder-card > img,

.catalog-page .catalog-folder-card
img.catalog-category-theme-image-v73,

.catalog-page .catalog-folder-card
img[class*="theme-image"]{

    position:absolute!important;

    inset:0!important;

    display:block!important;

    width:100%!important;
    height:100%!important;

    min-width:100%!important;
    min-height:100%!important;

    max-width:none!important;
    max-height:none!important;

    object-fit:cover!important;
    object-position:center!important;

    margin:0!important;
    padding:0!important;

    border:0!important;
    outline:0!important;

    box-shadow:none!important;

    border-radius:0!important;
}


/* ============================================================
   3. ЕСЛИ МЕЖДУ CARD И IMG ЕСТЬ WRAPPER
   ============================================================ */

.catalog-page .catalog-folder-card > picture,

.catalog-page .catalog-folder-card > figure,

.catalog-page .catalog-folder-card
[class*="media"],

.catalog-page .catalog-folder-card
[class*="image-wrap"],

.catalog-page .catalog-folder-card
[class*="image-wrapper"],

.catalog-page .catalog-folder-card
[class*="photo-wrap"],

.catalog-page .catalog-folder-card
[class*="thumb"]{

    position:absolute!important;

    inset:0!important;

    width:100%!important;
    height:100%!important;

    margin:0!important;
    padding:0!important;

    border:0!important;
    outline:0!important;

    box-shadow:none!important;

    background:none!important;

    border-radius:0!important;

    overflow:hidden!important;
}


.catalog-page .catalog-folder-card > picture > img,

.catalog-page .catalog-folder-card > figure > img,

.catalog-page .catalog-folder-card
[class*="media"] > img,

.catalog-page .catalog-folder-card
[class*="image-wrap"] > img,

.catalog-page .catalog-folder-card
[class*="image-wrapper"] > img,

.catalog-page .catalog-folder-card
[class*="photo-wrap"] > img,

.catalog-page .catalog-folder-card
[class*="thumb"] > img{

    position:absolute!important;

    inset:0!important;

    display:block!important;

    width:100%!important;
    height:100%!important;

    object-fit:cover!important;
    object-position:center!important;

    margin:0!important;
    padding:0!important;

    border:0!important;
    outline:0!important;

    box-shadow:none!important;

    border-radius:0!important;
}


/* ============================================================
   4. УБИРАЕМ ЛЮБЫЕ ПОЛОСЫ, СОЗДАННЫЕ PSEUDO-ELEMENT'АМИ
   ВНУТРЕННИХ ОБЁРТОК
   ============================================================ */

.catalog-page .catalog-folder-card
[class*="media"]::before,

.catalog-page .catalog-folder-card
[class*="media"]::after,

.catalog-page .catalog-folder-card
[class*="image"]::before,

.catalog-page .catalog-folder-card
[class*="image"]::after,

.catalog-page .catalog-folder-card
picture::before,

.catalog-page .catalog-folder-card
picture::after,

.catalog-page .catalog-folder-card
figure::before,

.catalog-page .catalog-folder-card
figure::after{

    content:none!important;

    display:none!important;

    border:0!important;

    background:none!important;

    box-shadow:none!important;
}


/* ============================================================
   5. НИКАКИХ SEPARATOR / HR
   ============================================================ */

.catalog-page .catalog-folder-card hr,

.catalog-page .catalog-folder-card
[class*="divider"],

.catalog-page .catalog-folder-card
[class*="separator"]{

    display:none!important;
}


/* ============================================================
   6. ТЕКСТОВЫЕ HTML-НАДПИСИ С КАРТОЧКИ УБРАНЫ
   Сам текст внутри изображения, естественно, остаётся.
   ============================================================ */

.catalog-page .catalog-folder-card
[class*="title"],

.catalog-page .catalog-folder-card
[class*="caption"],

.catalog-page .catalog-folder-card
[class*="category-name"],

.catalog-page .catalog-folder-card
[class*="label"]{

    display:none!important;
}


/* ============================================================
   7. СТРЕЛКА ПОВЕРХ КАРТИНКИ
   ============================================================ */

.catalog-page .catalog-folder-card
[class*="arrow"]{

    display:flex!important;

    position:absolute!important;

    z-index:30!important;
}


/* ============================================================
   8. HOVER

   НЕ трогаем увеличение/transform.
   Только рамка должна оставаться той же.
   ============================================================ */

html[data-site-theme="light"]
.catalog-page .catalog-folder-card:hover{

    border:0!important;

    box-shadow:
        0 0 0 1px rgba(20,20,20,.30)!important;
}


html[data-site-theme="dark"]
.catalog-page .catalog-folder-card:hover{

    border:0!important;

    box-shadow:
        0 0 0 1px rgba(255,255,255,.24)!important;
}


/* ============================================================
   9. MOBILE — только radius, размеры не трогаем
   ============================================================ */

@media(max-width:700px){

    .catalog-page .catalog-folder-card{

        border-radius:14px!important;
    }

}