
/*****************************/
/* 1я секция Lunest Info  */
:root {
    --lunest-bg-color: #ECEAE3;
}


.lunest-info-top {
    background-color: #F0EDE7;
border-radius: 20px;
    overflow: hidden;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 60px !important;
    box-sizing: border-box;
		margin: 20px 10px;
	  padding: 0px;
    height: 400px; 
   /* background-image: 
        url('/wp-content/themes/spicy/img/li1.gif'), 
       url('/wp-content/themes/spicy/img/li2.jpg');
    
    background-repeat: 
        no-repeat,
        repeat-x;  
    background-position: 
        right top,  
        left bottom; 

    background-size: 
        auto 100%,   
        auto 100%;   */
}

/* Настройка текста, чтобы он не сливался с фоном */
.lunest-info-top h1 {
    font-size: 48px !important;
    color: #2d3e33 !important;
    margin-bottom: 20px !important;
    position: relative;
    z-index: 2;
}

.lunest-info-top p {
    font-size: 18px !important;
    color: #2d3e33 !important;
    max-width: 550px !important;
    line-height: 1.6 !important;
    position: relative;
    z-index: 2;
}

/* Мобильная адаптация */
@media (max-width: 768px) {
    .lunest-info-top {
        padding: 40px 20px !important;
        text-align: center;
    }

    .lunest-info-top h1 {
        margin-top: 100px !important;
        font-size: 32px !important;
    }

    .lunest-info-top p {
        max-width: 100% !important;
        text-shadow: 0 0 10px #f4f6f0; /* Тень в цвет фона для читаемости */
    }
}

/***************************/
/* 2-я секция Lunest-info */
.lunest-info-2 {
    background-color: #f4f6f0;
    border-radius: 20px;
    padding: 10px 50px !important;
	 margin: 20px 10px;
    color: #2d3e33 !important;
}

/* Принудительный цвет для всех заголовков и абзацев в этой секции */
.lunest-info-2 h2, 
.lunest-info-2 p, 
.lunest-info-2 li {
    color: #2d3e33 !important;
}

/* Заголовок секции */
.lunest-info-2 h2 {
	  display: block;
    font-size: 24px !important;
    font-weight: bold !important;
    margin-bottom: 0px !important;
    letter-spacing: 0.5px;
}

/* Зеленая линия под заголовком */
.lunest-info-2 h2::after {
    content: "";
    display: block;
    width: 40px;
    height: 3px;
    background-color: #6ebb25; /* Ваш фирменный зеленый */
    margin-top: 8px;
    margin-bottom: 25px;
}

/* Стили для колонок */
.lunest-info-2 .wp-block-columns {
    align-items: flex-start;
}

/* Первая (широкая) колонка */
.lunest-info-2 .wp-block-column:first-child {
    padding-right: 30px;
}

/* Общие стили для текстовых блоков в колонках */
.lunest-info-2 p {
    font-size: 15px !important;
    line-height: 1.4 !important;
    margin-bottom: 15px !important;
}

/* Центрирование контента в колонках с иконками */
.lunest-info-2 .wp-block-column:not(:first-child) {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    /* Вертикальная разделительная линия между колонками */
    border-left: 1px solid rgba(45, 62, 51, 0.15); 
    padding-left: 10px;
    padding-right: 10px;
}

/* Убираем линию у первой текстовой колонки */
.lunest-info-2 .wp-block-column:first-child {
    padding-right: 20px;
}

/* Стили иконок */
.kuidas-icon {
    width: 100px;  /* Размер должен соответствовать вашим GIF */
    height: 100px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    margin-bottom: 15px;
}

/* Привязка ваших файлов */
.k-icon-1 { background-image: url('/wp-content/themes/spicy/img/kuidas1.gif'); }
.k-icon-2 { background-image: url('/wp-content/themes/spicy/img/kuidas2.gif'); }
.k-icon-3 { background-image: url('/wp-content/themes/spicy/img/kuidas3.gif'); }
.k-icon-4 { background-image: url('/wp-content/themes/spicy/img/kuidas4.gif'); }

/* Шрифт подписей под иконками */
.lunest-info-2 .wp-block-column:not(:first-child) p {
    font-weight: 500;
    margin-top: 5px;
}

/* секция 2 мобильные */
@media (max-width: 781px) {
    .lunest-info-2 {
        padding: 10px 20px !important;
    }
    
    .lunest-info-2 .wp-block-column:not(:first-child) {
        border-top: 1px solid rgba(45, 62, 51, 0.15); 
        padding-top: 15px;
        margin-top: 0px 20px;
        width: 100% !important;
        flex-direction: row !important;
        align-items: center !important; 
        text-align: left !important; 
        border-left: none !important; 
        padding-left: 20 !important;
        margin-bottom: 0px;            /* Добавляем отступ между блоками по вертикали */
    }

    /* Настройка иконки для мобильных */
    .lunest-info-2 .kuidas-icon {
        width: 60px !important;         /* Можно немного уменьшить размер иконки для мобильных */
        height: 60px !important;
        margin-bottom: 0 !important;    /* Убираем нижний отступ */
        margin-right: 15px !important;  /* Добавляем отступ справа, чтобы отодвинуть текст */
        flex-shrink: 0;                 /* Запрещаем иконке сжиматься */
    }

    /* Убираем лишние отступы у текста */
    .lunest-info-2 .wp-block-column:not(:first-child) p {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }

    /* Если первой колонке тоже нужно выравнивание (у вас там был другой стиль) */
    .lunest-info-2 .wp-block-column:first-child {
        padding-right: 0 !important;
        margin-bottom: 20px;
    }
}

/***************************/
/* ОБЩИЙ КОНТЕЙНЕР СЕКЦИИ (3-й ряд) */
.lunest-info-3.wp-block-columns {
    gap: 20px; 
    margin: 20px 10px;
}

/* 1. ЛЕВАЯ КОЛОНКА: MIDA ME JÄLGIME (СВЕТЛАЯ) */
.lunest-info-3 .monitoring-col {
    background-color: #f4f6f0;
    border-radius: 20px;   
    padding: 20px 40px !important; 
    color: #2d3e33 !important; /* Цвет текста — темно-зеленый */
}

.lunest-info-3 .monitoring-col h2 {
	  display: block;
    color: #2d3e33 !important;
    font-size: 24px !important;
    margin-bottom: 30px !important;
    text-transform: uppercase;
}

/* Зеленая линия под заголовком */
.lunest-info-3 .monitoring-col h2::after {
    content: "";
    display: block;
    width: 40px;
    height: 3px;
    background-color: #6ebb25; /* Ваш фирменный зеленый */
    margin-top: 8px;
    margin-bottom: 0px;
}

/* Стилизация списка слева */
.lunest-info-3 .monitoring-col ul {
    list-style: none !important; /* Убираем стандартные маркеры */
    padding: 0 !important;
    margin: 0 !important;
}

.lunest-info-3 .monitoring-col li {
    position: relative;
    padding: 15px 0 15px 60px; /* Отступ слева под иконку */
    border-bottom: 1px dotted rgba(45, 62, 51, 0.3); /* Пунктирная линия между пунктами */
    display: flex;
    align-items: center;
    min-height: 10px;
}

.lunest-info-3 .monitoring-col li:last-child {
    border-bottom: none;
}

/* Добавление иконок через псевдоэлементы для левой колонки */
.lunest-info-3 .monitoring-col li::before {
    content: "";
    position: absolute;
    left: 0;
    width: 45px;
    height: 45px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

/* Назначение GIF-иконок для левого списка по порядку (1-4) */
.lunest-info-3 .monitoring-col li:nth-child(1)::before { background-image: url('/wp-content/themes/spicy/img/mida-me-jalgime1.gif'); }
.lunest-info-3 .monitoring-col li:nth-child(2)::before { background-image: url('/wp-content/themes/spicy/img/mida-me-jalgime2.gif'); }
.lunest-info-3 .monitoring-col li:nth-child(3)::before { background-image: url('/wp-content/themes/spicy/img/mida-me-jalgime3.gif'); }
.lunest-info-3 .monitoring-col li:nth-child(4)::before { background-image: url('/wp-content/themes/spicy/img/mida-me-jalgime4.gif'); }


/* 2. ПРАВАЯ КОЛОНКА: MIKS SEE ON VAJALIK (ТЕМНАЯ) */
.lunest-info-3 .importance-col {
    background-color: #2d3e33; /* Темно-зеленый фон */
    border-radius: 25px;
    padding-top: 20px !important;
	  padding-left: 20px !important;
	  padding-right: 20px !important;
	padding-bottom: 0px !important;
    color: #ffffff !important; /* Белый текст */
}

.lunest-info-3 .importance-col h2, 
.lunest-info-3 .importance-col p {
    color: #ffffff !important;
}

.lunest-info-3 .importance-col h2 {
	  display: block;
    font-size: 24px !important;
    margin-bottom: 20px !important;
    text-transform: uppercase;
}

/* Зеленая линия под заголовком */
.lunest-info-3 .importance-col h2::after {
    content: "";
    display: block;
    width: 40px;
    height: 3px;
    background-color: #6ebb25; /* Ваш фирменный зеленый */
    margin-top: 8px;
    margin-bottom: 0px;
}

/* Внутренние 3 колонки внутри темного блока */
.lunest-info-3 .importance-col .wp-block-columns {
    margin-top: 0px !important;
    padding-top: 00px;
}

.lunest-info-3 .importance-col .wp-block-column {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 10px 0px 0px 0px !important;
	
}


/* Иконки для нижнего ряда темного блока */
.lunest-info-3 .importance-col .wp-block-column::before {
    content: "";
    width: 80px;
    height: 80px;
    margin-bottom: 15px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

/* Назначение GIF-иконок для нижнего ряда по порядку (1-3) */
.lunest-info-3 .importance-col .wp-block-column:nth-child(1)::before { background-image: url('/wp-content/themes/spicy/img/miks_see_on_valik1.gif'); }
.lunest-info-3 .importance-col .wp-block-column:nth-child(2)::before { background-image: url('/wp-content/themes/spicy/img/miks_see_on_valik2.gif'); }
.lunest-info-3 .importance-col .wp-block-column:nth-child(3)::before { background-image: url('/wp-content/themes/spicy/img/miks_see_on_valik3.gif'); }

.lunest-info-3 .importance-col .wp-block-column p {
    font-size: 14px !important;
    line-height: 1.2 !important;
}

.lunest-info-3 .importance-col p:nth-child(3) {
	margin-bottom: 0px !important;
}

/* АДАПТАЦИЯ ДЛЯ МОБИЛЬНЫХ */
@media (max-width: 781px) {
    .lunest-info-3 .importance-col .wp-block-column {
        flex-direction: row !important; 
        align-items: center !important; 
        text-align: left !important; 
        padding: 0px 0зч !important; 
    }

    /* Настраиваем псевдоэлемент (иконку) */
    .lunest-info-3 .importance-col .wp-block-column::before {
        width: 60px !important;   
        height: 60px !important;
        margin-bottom: 0 !important;
        margin-right: 20px !important;    
        flex-shrink: 0 !important;      
    }

    /* Убираем лишние отступы у параграфов внутри этих колонок */
    .lunest-info-3 .importance-col .wp-block-column p {
        margin: 0 !important;
        font-size: 15px !important;         /* Можно чуть увеличить шрифт для читабельности */
    }
    
	
    .lunest-info-3 .importance-col .wp-block-column {
  border-left: none !important;
   border-top: 1px solid rgba(255, 255, 255, 0.2);
   padding-top: 20px !important;
   margin-top: 10px;
    }
}

/****************************/
/* КОНТЕЙНЕР 4-ГО РЯДА */
.lunest-info-4.wp-block-columns {
    background-color: #2A4332;
    border-radius: 20px;    
    padding: 20px 40px !important;  
    color: #ffffff !important; 
    align-items: center;  
    gap: 0; 
	margin: 20px 10px;
}

/* ОБЩИЕ СТИЛИ ТЕКСТА */
.lunest-info-4 h2, 
.lunest-info-4 p {
    color: #ffffff !important;
    margin: 0 !important;
}


/* ПЕРВАЯ КОЛОНКА (ЗАГОЛОВОК + ИКОНКА СЛЕВА) */
.lunest-info-4 .wp-block-column:nth-child(1) {
    display: flex;
    flex-direction: column; /* Элементы встают вертикально */
    align-items: flex-start; /* Выравнивание по левому краю */
    justify-content: center; /* Центрирование по вертикали внутри блока */
    position: relative;
    padding-left: 120px !important; /* Место под большую иконку слева */
    padding-right: 30px !important;
    min-height: 120px; /* Чтобы иконка не обрезалась, если текста мало */
}

/* Большая иконка с сердцем (остается на месте слева) */
.lunest-info-4 .wp-block-column:nth-child(1)::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%); /* Центрируем иконку точно по центру высоты */
    width: 100px;
    height: 100px;
    background-image: url('/wp-content/themes/spicy/img/miks_see_on_oluline1.gif');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

/* Настройки текста в первой колонке */
.lunest-info-4 .wp-block-column:nth-child(1) h2 {
    margin-bottom: 5px !important;
}

.lunest-info-4 .wp-block-column:nth-child(1) p {
    font-size: 16px !important;
    opacity: 0.9;
}

.lunest-info-4 h2 {
	  display: block;
    font-size: 24px !important;
    text-transform: uppercase;
    line-height: 1.2 !important;
}

.lunest-info-4 h2::after {
    content: "";
    display: block;
    width: 40px;
    height: 3px;
    background-color: #6ebb25; /* Зеленая черта под заголовком */
    margin-top: 10px;
    margin-bottom: 10px;
}

/* СТИЛИ ДЛЯ ТРЕХ ПРАВЫХ КОЛОНОК (С ИКОНКАМИ СВЕРХУ) */
.lunest-info-4 .wp-block-column:not(:nth-child(1)) {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 20px !important;
    border-left: 1px solid rgba(255, 255, 255, 0.2); /* Вертикальные линии разделения */
}

/* Общий стиль иконок для трех правых колонок */
.lunest-info-4 .wp-block-column:not(:nth-child(1))::before {
    content: "";
    width: 130px;
    height: 65px;
    margin-bottom: 15px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

/* Назначение конкретных GIF для колонок 2, 3 и 4 */
.lunest-info-4 .wp-block-column:nth-child(2)::before { background-image: url('/wp-content/themes/spicy/img/miks_see_on_oluline2.gif'); }
.lunest-info-4 .wp-block-column:nth-child(3)::before { background-image: url('/wp-content/themes/spicy/img/miks_see_on_oluline3.gif'); }
.lunest-info-4 .wp-block-column:nth-child(4)::before { background-image: url('/wp-content/themes/spicy/img/miks_see_on_oluline4.gif'); }

.lunest-info-4 p {
    font-size: 14px !important;
    line-height: 1.3 !important;
}

/* МОБИЛЬНАЯ АДАПТАЦИЯ */
@media (max-width: 781px) {
    .lunest-info-4.wp-block-columns {
 flex-direction: column;
 padding: 30px 20px !important;
 margin: 0px;
    }
	
	.lunest-info-4 .wp-block-column:nth-child(1) h2  {
		padding-left: 0px;
		margin: 0px!important;
		
	}
.lunest-info-4 .wp-block-column:nth-child(1)::before {
  position: absolute !important;
  margin-bottom: 20px;
	width: 60px;
	top: 10px
    }

    .lunest-info-4 .wp-block-column {
  width: auto !important;
  border-left: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
    }

    .lunest-info-4 .wp-block-column:nth-child(1) {
  flex-direction: column;
  text-align: center;
  margin-bottom: 20px;
    }

    .lunest-info-4 .wp-block-column:nth-child(1)::before {
   position: static;
   margin-bottom: 10px;
			
    }

    .lunest-info-4 h2::after {
        margin-left: auto;
        margin-right: auto;
    }

    .lunest-info-4 .wp-block-column:not(:nth-child(1)) {
			flex-direction: row;
		text-align: left;
        border-top: 1px solid rgba(255, 255, 255, 0.2); /* Горизонтальные линии на мобильных */
 padding-top: 10px !important;
 padding-left: 0px !important;
    }
}

/*****************************/
/* 5. СЕКЦИЯ: PROJEKTI ROLL */
.lunest-info-5 {
	  background-color: #F2F0EC;
    background-image: url('/wp-content/themes/spicy/img/projekti2.gif');
    background-repeat: no-repeat; /* Повторение узора */
    background-position: right;
    border-radius: 20px; /* Скругление углов контейнера */
    padding: 0px !important;
    overflow: hidden; 
	margin: 20px 10px;
}

/* Внутренняя колонка, содержащая текст */
.lunest-info-5 .wp-block-column {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 20px 60px !important;
    /* Увеличиваем отступ слева, чтобы освободить место под иконку */
    padding-left: 180px !important; 
    color: #2d3e33 !important;
    /* Обязательно добавляем relative, чтобы иконка позиционировалась внутри */
    position: relative; 
    min-height: 200px; /* Минимальная высота, чтобы иконка не вылезала */
}

/* Иконка лупы слева */
.lunest-info-5 .wp-block-column::before {
    content: "";
    position: absolute; 
    left: 20px; 
    top: 50%; 
    transform: translateY(-50%); 
    width: 130px;  
    height: 130px;     
    background-image: url("/wp-content/themes/spicy/img/projekti1.gif");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

/* Настройки заголовка, чтобы он был как на макете */
.lunest-info-5 h2 {
    margin-top: 0 !important;
    margin-bottom: 10px !important;
}



/* Стилизация заголовка */
.lunest-info-5 h2 {
	  display: block;
    color: #2d3e33 !important;
    font-size: 24px !important;
    font-weight: bold !important;
    text-transform: uppercase; /* Все буквы заглавные */
    margin-bottom: 20px !important;
    line-height: 1.1 !important;
}

/* Зеленая линия под заголовком */
.lunest-info-5 h2::after {
    content: "";
    display: block;
    width: 50px;
    height: 4px;
    background-color: #6ebb25; /* Фирменный зеленый цвет */
    margin-top: 15px;
}


/* Стилизация абзацев */
.lunest-info-5 p {
    color: #2d3e33 !important;
    font-size: 18px !important;
    line-height: 1.5 !important;
    max-width: 50%; /* Ограничиваем ширину текста для удобства чтения */
    margin-bottom: 15px !important;
}

/* Адаптация для мобильных устройств */
@media (max-width: 781px) {
.lunest-info-5 .wp-block-column {
 padding: 40px 20px !important;
  min-height: auto;
  background-size: 150% auto; 
    }

.lunest-info-5 h2 {
 font-size: 24px !important;
    }
	.lunest-info-5 p {
	text-align: left;
	max-width: 100%;
	}
	.lunest-info-5 h2::after {
		margin-left: 230px;
}

.lunest-info-5 {
		background-size: 35% auto, auto auto;
		background-position: top right;
    
	}
	
	.lunest-info-5 h2 {
		padding-left: 40px;
		padding-top: 0px;
	}

    .lunest-info-5 .wp-block-column {
 padding-left: 20px !important;
 padding-top: 80px !important;
 text-align: center;
 align-items: center;
 
    }
    
    .lunest-info-5 .wp-block-column::before {
   left: 0px;
   top: 70px;
    width: 65px;  
    height: 65px;  
    }
}


/******************************/
/* 6. СЕКЦИЯ: КОНТАКТЫ */
.lunest-info-6 {
    background-color: #F1F0EC;
    border-radius: 20px; 
    padding: 20px 0px !important;
    color: #2d3e33 !important;
    position: relative;
    overflow: hidden;
	 margin: 20px 10px;
}

/* Заголовок секции */
.lunest-info-6 h2 {
	  display: block;
    color: #2d3e33 !important;
    font-size: 24px !important;
    text-transform: uppercase;
    margin-bottom: 5px !important;
}

/* Зеленая линия под заголовком */
.lunest-info-6 h2::after {
    content: "";
    display: block;
    width: 40px;
    height: 3px;
    background-color: #6ebb25;
    margin-top: 8px;
    margin-bottom: 0px;
}

/* ОСНОВНАЯ БОЛЬШАЯ ИКОНКА (Конверт в круге) */
.lunest-info-6 > .wp-block-column:first-child {
    padding-left: 110px !important; 
    position: relative;
}

.lunest-info-6 > .wp-block-column p {
	margin-bottom: 0px;
}
/*.lunest-info-6 > .wp-block-column:first-child::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0px;
    width: 110px;
    height: 110px;
    background-image: url('/wp-content/themes/spicy/img/kontakt1.gif');
    background-size: contain;
    background-repeat: no-repeat;
}*/

/* ТРИ МАЛЕНЬКИЕ КОЛОНКИ С ИКОНКАМИ */
.lunest-info-6 .wp-block-columns .wp-block-column {
    position: relative;
    padding-left: 45px !important; /* Место под маленькие иконки */
    padding-top: 10px;
    min-height: 50px;
	margin-bottom: 0em;
}

.lunest-info-6 .wp-block-columns .wp-block-column::before {
    content: "";
    position: absolute;
    left: 0;
    width: 45px;
    height: 45px;
    background-size: contain;
    background-repeat: no-repeat;
}

/* Назначение иконок 2, 3 и 4 по порядку */
.lunest-info-6 .wp-block-columns .wp-block-column:nth-child(1)::before { background-image: url('/wp-content/themes/spicy/img/kontakt2.gif'); }
.lunest-info-6 .wp-block-columns .wp-block-column:nth-child(2)::before { background-image: url('/wp-content/themes/spicy/img/kontakt3.gif'); }
.lunest-info-6 .wp-block-columns .wp-block-column:nth-child(3)::before { background-image: url('/wp-content/themes/spicy/img/kontakt4.gif'); }.lunest-info-6 .wp-block-columns .wp-block-column:nth-child(4)::before { background-image: url('/wp-content/themes/spicy/img/kontakt5.gif'); }


/* Ссылка в последней колонке */
.lunest-info-6 .li-kontakt a {
    color: #2d3e33 !important;
    text-decoration: none;
    font-size: 15px;    line-height: 2.4;
    font-weight: 500;
}

/* Ссылка в последней колонке */
.lunest-info-6 .li-kontakt a {
    color: #2d3e33 !important;
    text-decoration: none;
    font-size: 14px;
    line-height: 1.3;
}

.lunest-info-6 .li-kontakt a:hover {
    text-decoration: underline;
}

/* АДАПТАЦИЯ ДЛЯ МОБИЛЬНЫХ */
@media (max-width: 781px) {
	.lunest-info-6 p.li-kontakt {
		min-height: 90px;
		padding: 30px 0 0 0;
	}
}