/* ─── CSCAT BLOCK ─────────────────────────────────── */
.cscat-wrap {
 margin: 40px 0 20px;
 font-family: 'Exo 2', sans-serif;

}
 
/* ── BANNER ── */
.cscat-banner-wrap {
 position: relative;
 width: 100%;
 height: 300px;
 border-radius: 14px 14px 0 0;
 overflow: hidden;
}
.cscat-banner-wrap img {
 width: 100%;
 height: 100%;
 object-fit: cover;
 display: block;
 filter: brightness(.7);
 transition: transform .5s ease, filter .5s ease;
}
.cscat-banner-wrap:hover img {
 transform: scale(1.03);
 filter: brightness(.85);
}
/* градиент снизу — плавный переход к телу */
.cscat-banner-wrap::after {
 content: '';
 position: absolute;
 bottom: 0; left: 0; right: 0;
 height: 60%;
 background: linear-gradient(to top, #1a1a1a 0%, transparent 100%);
 pointer-events: none;
}
/* заголовок поверх баннера */
.cscat-banner-title {
 position: absolute;
 bottom: 16px; left: 20px; right: 20px;
 z-index: 2;
 display: flex;
 align-items: center;
 gap: 10px;
 font-size: 20px;
 font-weight: 700;
 color: #fff;
 letter-spacing: .4px;
 text-shadow: 0 2px 8px rgba(0,0,0,.6);
}
.cscat-banner-title::before {
 content: '';
 display: block;
 flex-shrink: 0;
 width: 4px;
 height: 24px;
 background: #e44c01;
 border-radius: 3px;
}
 
/* ── BODY ── */
.cscat-body {
 background: #10131a;

 border-top: none;
 border-radius: 0 0 14px 14px;
 padding: 22px 24px 24px;
}
 
/* без баннера — полный радиус */
.cscat-wrap.no-banner .cscat-body {
 border-radius: 14px;
 border-top: 3px solid #e44c01;
}
.cscat-wrap.no-banner .cscat-title {
 display: flex;
 align-items: center;
 gap: 10px;
 font-size: 18px;
 font-weight: 700;
 color: #1a1a1a;
 margin-bottom: 14px;
 letter-spacing: .3px;
}
.cscat-wrap.no-banner .cscat-title::before {
 content: '';
 flex-shrink: 0;
 width: 4px; height: 20px;
 background: #e44c01;
 border-radius: 3px;
}
 
/* ── DESCRIPTION TEXT ── */
.cscat-desc {
 font-size: 14px;
 line-height: 1.75;
 color: #3a3a3a;
 hyphens: auto;
}
.cscat-desc p { margin: 0 0 10px; }
.cscat-desc p:last-child { margin-bottom: 0; }
.cscat-desc a { color: #e44c01; text-decoration: none; font-weight: 600; }
.cscat-desc a:hover { color: #c43d00; text-decoration: underline; }
 
@media (max-width: 640px) {
 .cscat-banner-wrap { height: 160px; }
 .cscat-banner-title { font-size: 16px; }
 .cscat-body { padding: 16px 16px 20px; }
}


/* ─── CSCAT BLOCK ─────────────────────────────────── */
.cscat-wrap {
 margin: 40px 0 20px;
 font-family: 'Exo 2', sans-serif;

}
 
/* ── BANNER ── */
.cscat-banner-wrap {
 position: relative;
 width: 100%;
 height: 300px;
 border-radius: 14px 14px 0 0;
 overflow: hidden;
}
.cscat-banner-wrap img {
 width: 100%;
 height: 100%;
 object-fit: cover;
 display: block;
 filter: brightness(.7);
 transition: transform .5s ease, filter .5s ease;
}
.cscat-banner-wrap:hover img {
 transform: scale(1.03);
 filter: brightness(.85);
}
/* градиент снизу — плавный переход к телу */
.cscat-banner-wrap::after {
 content: '';
 position: absolute;
 bottom: 0; left: 0; right: 0;
 height: 60%;
 background: linear-gradient(to top, #1a1a1a 0%, transparent 100%);
 pointer-events: none;
}
/* заголовок поверх баннера */
.cscat-banner-title {
 position: absolute;
 bottom: 16px; left: 20px; right: 20px;
 z-index: 2;
 display: flex;
 align-items: center;
 gap: 10px;
 font-size: 20px;
 font-weight: 700;
 color: #fff;
 letter-spacing: .4px;
 text-shadow: 0 2px 8px rgba(0,0,0,.6);
}
.cscat-banner-title::before {
 content: '';
 display: block;
 flex-shrink: 0;
 width: 4px;
 height: 24px;
 background: #e44c01;
 border-radius: 3px;
}
 
/* ── BODY ── */
.cscat-body {
 background: #10131a;

 border-top: none;
 border-radius: 0 0 14px 14px;
 padding: 22px 24px 24px;
}
 
/* без баннера — полный радиус */
.cscat-wrap.no-banner .cscat-body {
 border-radius: 14px;
 border-top: 3px solid #e44c01;
}
.cscat-wrap.no-banner .cscat-title {
 display: flex;
 align-items: center;
 gap: 10px;
 font-size: 18px;
 font-weight: 700;
 color: #1a1a1a;
 margin-bottom: 14px;
 letter-spacing: .3px;
}
.cscat-wrap.no-banner .cscat-title::before {
 content: '';
 flex-shrink: 0;
 width: 4px; height: 20px;
 background: #e44c01;
 border-radius: 3px;
}
 
/* ── DESCRIPTION TEXT ── */
.cscat-desc {
 font-size: 14px;
 line-height: 1.75;
 color: #3a3a3a;
 hyphens: auto;
}
.cscat-desc p { margin: 0 0 10px; }
.cscat-desc p:last-child { margin-bottom: 0; }
.cscat-desc a { color: #e44c01; text-decoration: none; font-weight: 600; }
.cscat-desc a:hover { color: #c43d00; text-decoration: underline; }
 
@media (max-width: 640px) {
 .cscat-banner-wrap { height: 160px; }
 .cscat-banner-title { font-size: 16px; }
 .cscat-body { padding: 16px 16px 20px; }
}


/* ─── CSCAT BLOCK ─────────────────────────────────── */
.cscat-wrap {
 margin: 40px 0 20px;
 font-family: 'Exo 2', sans-serif;

}
 
/* ── BANNER ── */
.cscat-banner-wrap {
 position: relative;
 width: 100%;
 height: 300px;
 border-radius: 14px 14px 0 0;
 overflow: hidden;
}
.cscat-banner-wrap img {
 width: 100%;
 height: 100%;
 object-fit: cover;
 display: block;
 filter: brightness(.7);
 transition: transform .5s ease, filter .5s ease;
}
.cscat-banner-wrap:hover img {
 transform: scale(1.03);
 filter: brightness(.85);
}
/* градиент снизу — плавный переход к телу */
.cscat-banner-wrap::after {
 content: '';
 position: absolute;
 bottom: 0; left: 0; right: 0;
 height: 60%;
 background: linear-gradient(to top, #1a1a1a 0%, transparent 100%);
 pointer-events: none;
}
/* заголовок поверх баннера */
.cscat-banner-title {
 position: absolute;
 bottom: 16px; left: 20px; right: 20px;
 z-index: 2;
 display: flex;
 align-items: center;
 gap: 10px;
 font-size: 20px;
 font-weight: 700;
 color: #fff;
 letter-spacing: .4px;
 text-shadow: 0 2px 8px rgba(0,0,0,.6);
}
.cscat-banner-title::before {
 content: '';
 display: block;
 flex-shrink: 0;
 width: 4px;
 height: 24px;
 background: #e44c01;
 border-radius: 3px;
}
 
/* ── BODY ── */
.cscat-body {
 background: #10131a;

 border-top: none;
 border-radius: 0 0 14px 14px;
 padding: 22px 24px 24px;
}
 
/* без баннера — полный радиус */
.cscat-wrap.no-banner .cscat-body {
 border-radius: 14px;
 border-top: 3px solid #e44c01;
}
.cscat-wrap.no-banner .cscat-title {
 display: flex;
 align-items: center;
 gap: 10px;
 font-size: 18px;
 font-weight: 700;
 color: #1a1a1a;
 margin-bottom: 14px;
 letter-spacing: .3px;
}
.cscat-wrap.no-banner .cscat-title::before {
 content: '';
 flex-shrink: 0;
 width: 4px; height: 20px;
 background: #e44c01;
 border-radius: 3px;
}
 
/* ── DESCRIPTION TEXT ── */
.cscat-desc {
 font-size: 14px;
 line-height: 1.75;
 color: #fff;
 hyphens: auto;
}
.cscat-desc p { margin: 0 0 10px; }
.cscat-desc p:last-child { margin-bottom: 0; }
.cscat-desc a { color: #e44c01; text-decoration: none; font-weight: 600; }
.cscat-desc a:hover { color: #c43d00; text-decoration: underline; }
 
@media (max-width: 640px) {
 .cscat-banner-wrap { height: 160px; }
 .cscat-banner-title { font-size: 16px; }
 .cscat-body { padding: 16px 16px 20px; }
}