@font-face { font-family: 'Montserrat'; src: url('/fonts/Montserrat-Regular.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'Montserrat'; src: url('/fonts/Montserrat-Bold.woff2') format('woff2'); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'Montserrat'; src: url('/fonts/Montserrat-Black.woff2') format('woff2'); font-weight: 900; font-style: normal; font-display: swap; }

.hide-scrollbar::-webkit-scrollbar { display: none; }
.hide-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

body::-webkit-scrollbar { width: 8px; }
body::-webkit-scrollbar-track { background: #060608; }
body::-webkit-scrollbar-thumb { background: #F07C27; border-radius: 4px; }

@keyframes bgBreathe {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}
.bg-premium-dark {
    background: linear-gradient(-45deg, #050507, #16161e, #0a0a0f, #050507);
    background-size: 400% 400%;
    animation: bgBreathe 15s ease infinite;
}

.magic-card {
    position: relative;
    overflow: hidden;
    background: #111115;
    border: 1px solid rgba(255, 255, 255, 0.08);
    transform: translateZ(0);
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.magic-card::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 1.5px;
    background: radial-gradient(600px circle at var(--mouse-x, 0) var(--mouse-y, 0), rgba(240, 124, 39, 0.65), transparent 40%);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    opacity: 0;
    transition: opacity 0.4s ease;
    pointer-events: none;
    z-index: 10;
}

.magic-card::after {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(600px circle at var(--mouse-x, 0) var(--mouse-y, 0), rgba(240, 124, 39, 0.08), transparent 40%);
    border-radius: inherit;
    opacity: 0;
    transition: opacity 0.4s ease;
    pointer-events: none;
    z-index: 1;
}

.magic-wrapper:hover .magic-card::before,
.magic-wrapper:hover .magic-card::after { opacity: 1; }
.magic-wrapper:hover .magic-card { border-color: rgba(255, 255, 255, 0.12); }
.magic-content { position: relative; z-index: 2; }

/* Контент статьи (Quill-сгенерированный HTML) */
.article-content h2 { font-size: 1.5rem; font-weight: 900; color: white; margin-top: 2rem; margin-bottom: 1rem; }
.article-content h3 { font-size: 1.25rem; font-weight: 700; color: white; margin-top: 1.5rem; margin-bottom: 0.75rem; }
.article-content p { margin-bottom: 1.25rem; line-height: 1.75; }
.article-content img { width: 100%; border-radius: 1rem; margin-top: 2rem; margin-bottom: 2rem; border: 1px solid rgba(255,255,255,0.1); box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.5); }
.article-content ul { list-style-type: disc; margin-left: 1.5rem; margin-bottom: 1.25rem; }
.article-content ol { list-style-type: decimal; margin-left: 1.5rem; margin-bottom: 1.25rem; }
.article-content a { color: #F07C27; text-decoration: underline; }

/* Фильтры каталога */
.filter-btn.active { background: #F07C27 !important; color: #000 !important; border-color: #F07C27 !important; }
