/* ============================================
   ФИРМЕННЫЕ ПАТТЕРНЫ (subtle / premium)
   Версия с PNG-файлами
   ============================================ */

:root {
    --pattern-dots: url('../assets/images/pattern-dots.png');
    --pattern-waves: url('../assets/images/pattern-waves.png');
}

/* ===== ОСНОВНОЙ ФОН САЙТА ===== */
.bg-pattern-subtle {
    position: relative;
    background-color: #F2E6F0 !important;
    background-image: none !important;
}

.bg-pattern-subtle::before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: var(--pattern-dots);
    background-size: 500px 800px;
    background-repeat: repeat;
    opacity: 0.2; /* Подберите под свой вкус: 0.08 – 0.15 */
    pointer-events: none;
    z-index: 0;
}

/* Контент поверх паттерна */
body > * {
    position: relative;
    z-index: 1;
}

/* ===== HERO — ДОПОЛНИТЕЛЬНЫЙ ПАТТЕРН ===== */
.hero {
    position: relative;
    overflow: hidden;
}

.hero::after {
    content: "";
    position: absolute;
    top: -10%;
    right: -5%;
    width: 60%;
    height: 110%;
    background-image: var(--pattern-waves);
    background-size: 250px 250px;
    background-repeat: no-repeat;
    background-position: center;
    opacity: 0.12;
    mix-blend-mode: multiply;
    pointer-events: none;
    z-index: 0;
}

.hero__grid {
    position: relative;
    z-index: 2;
}

/* ===== КАРТОЧКИ С ЛЁГКИМ ПАТТЕРНОМ ===== */
.card--pattern {
    position: relative;
    overflow: hidden;
}

.card--pattern::before {
    content: "";
    position: absolute;
    bottom: 0;
    right: 0;
    width: 120px;
    height: 120px;
    background-image: var(--pattern-dots);
    background-size: 60px 60px;
    background-repeat: no-repeat;
    opacity: 0.08;
    pointer-events: none;
    z-index: 0;
}

/* ===== АДАПТИВ ===== */
@media (max-width: 768px) {
    .bg-pattern-subtle::before {
        background-size: 120px 120px;
        opacity: 0.07;
    }
    
    .hero::after {
        opacity: 0.08;
        background-size: 180px;
        width: 80%;
    }
}