/* bruschatka */
.ct-container-full,

        .ct-container-full * {

            display: none !important;

            visibility: hidden !important;

            opacity: 0 !important;

            height: 0 !important;

            margin: 0 !important;

            padding: 0 !important;

            overflow: hidden !important;

            pointer-events: none !important;

        }

        /* Основные стили */

        body {

            margin: 0;

            padding: 0;

            overflow-x: hidden;

            background-color: #f8f9fa;

            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;

            color: #333;

        }

        /* Шапка */

        #paving-header-banner {

            position: relative;

            width: 100%;

            height: 60vh;

            min-height: 350px;

            display: flex;

            align-items: center;

            justify-content: center;

            overflow: hidden;

            margin: 0 !important;

            padding: 0 !important;

            z-index: 10;

            box-sizing: border-box;

        }

        .parallax-background {

            position: absolute;

            top: 0;

            left: 0;

            width: 100%;

            height: 100%;

            background-image: url('https://ritual-uslugi31.ru/wp-content/uploads/2025/08/2x_realesrgan-x4plus-1.png');

            background-size: cover;

            background-position: center;

            background-attachment: fixed;

            z-index: 1;

        }

        .gradient-overlay {

            position: absolute;

            top: 0;

            left: 0;

            width: 100%;

            height: 100%;

            background: linear-gradient(to bottom, rgba(25, 42, 61, 0.5), rgba(25, 42, 61, 0.85));

            z-index: 2;

        }

        .content-wrapper {

            position: relative;

            z-index: 4;

            text-align: center;

            padding: 20px;

            max-width: 900px;

            width: 90%;

        }

        .text-content {

            opacity: 0;

            animation: textAppear 1.5s ease forwards;

            animation-delay: 0.3s;

        }

        .title {

            font-size: 3rem;

            font-weight: 700;

            color: #efcc4a;

            text-shadow: 0 2px 8px rgba(0,0,0,0.4);

            margin-bottom: 15px;

            line-height: 1.2;

        }

        .subtitle {

            font-size: 1.6rem;

            color: #fff;

            text-shadow: 0 1px 4px rgba(0,0,0,0.3);

            line-height: 1.5;

            opacity: 0.9;

            max-width: 800px;

            margin-left: auto;

            margin-right: auto;

        }

        @keyframes textAppear {

            from { opacity: 0; transform: translateY(20px); }

            to { opacity: 1; transform: translateY(0); }

        }

        /* Разделители */

        .section-divider {

            display: block;

            width: 100%;

            height: 4px;

            background: linear-gradient(90deg, #192a3d, #efcc4a, #192a3d);

            animation: gradientAnimation 3s ease infinite;

            background-size: 200% 100%;

            margin: 0;

            padding: 0;

        }

        @keyframes gradientAnimation {

            0% { background-position: 100% 0; }

            100% { background-position: -100% 0; }

        }

        /* Информационный блок */

        .paving-info-section {

            padding: 80px 0;

            background: #ffffff;

        }

        .container {

            max-width: 1200px;

            margin: 0 auto;

            padding: 0 20px;

        }

        .section-header {

            text-align: center;

            margin-bottom: 50px;

        }

        .section-title {

            font-size: 2.5rem;

            color: #192a3d;

            font-weight: 700;

            margin-bottom: 15px;

            position: relative;

            display: inline-block;

        }

        .section-title::after {

            content: "";

            position: absolute;

            bottom: -10px;

            left: 50%;

            transform: translateX(-50%);

            width: 100px;

            height: 4px;

            background: #efcc4a;

            border-radius: 2px;

        }

        .section-description {

            font-size: 1.25rem;

            color: #4a5568;

            max-width: 800px;

            margin: 30px auto 0;

            line-height: 1.6;

        }

        /* Галерея */

        .gallery-section {

            padding: 80px 0;

            background: #ffffff;

        }

        .gallery-grid {

            display: grid;

            grid-template-columns: repeat(3, 1fr);

            gap: 25px;

            margin-bottom: 30px;

        }

        .gallery-item {

            border-radius: 12px;

            overflow: hidden;

            box-shadow: 0 8px 25px rgba(25, 42, 61, 0.1);

            transition: transform 0.3s ease;

            opacity: 0;

            transform: translateY(30px);

            transition: opacity 0.6s ease, transform 0.6s ease;

        }

        .gallery-item:hover {

            transform: translateY(-5px);

        }

        .image-wrapper {

            position: relative;

            height: 300px;

            overflow: hidden;

            border-radius: 12px;

            cursor: pointer;

        }

        .image-wrapper img {

            width: 100%;

            height: 100%;

            object-fit: cover;

            transition: transform 0.5s ease;

        }

        .zoom-icon {

            position: absolute;

            top: 50%;

            left: 50%;

            transform: translate(-50%, -50%);

            width: 60px;

            height: 60px;

            background: rgba(239, 204, 74, 0.8);

            border-radius: 50%;

            display: flex;

            align-items: center;

            justify-content: center;

            opacity: 0;

            transition: opacity 0.3s ease;

            z-index: 3;

        }

        .zoom-icon i {

            font-size: 24px;

            color: #192a3d;

        }

        .image-wrapper::before {

            content: "";

            position: absolute;

            top: 0;

            left: 0;

            width: 100%;

            height: 100%;

            background: rgba(0,0,0,0.3);

            opacity: 0;

            transition: opacity 0.3s ease;

            z-index: 2;

        }

        .image-wrapper:hover::before {

            opacity: 1;

        }

        /* Модальное окно */

        .gallery-modal {

            display: none;

            position: fixed;

            top: 0;

            left: 0;

            width: 100%;

            height: 100%;

            background: rgba(0,0,0,0.9);

            z-index: 1000;

            align-items: center;

            justify-content: center;

        }

        .modal-content {

            max-width: 90%;

            max-height: 90%;

        }

        .modal-content img {

            max-width: 100%;

            max-height: 80vh;

            display: block;

            margin: 0 auto;

            border: 3px solid #efcc4a;

            border-radius: 8px;

        }

        .close-modal {

            position: absolute;

            top: 30px;

            right: 30px;

            font-size: 40px;

            color: #fff;

            cursor: pointer;

            transition: color 0.3s;

        }

        .close-modal:hover {

            color: #efcc4a;

        }

        .prev-photo, .next-photo {

            position: absolute;

            top: 50%;

            transform: translateY(-50%);

            font-size: 40px;

            color: #fff;

            cursor: pointer;

            transition: color 0.3s;

            padding: 20px;

        }

        .prev-photo:hover, .next-photo:hover {

            color: #efcc4a;

        }

        .prev-photo {

            left: 30px;

        }

        .next-photo {

            right: 30px;

        }

        .image-counter {

            position: absolute;

            bottom: 30px;

            left: 50%;

            transform: translateX(-50%);

            color: #fff;

            font-size: 18px;

            background: rgba(25,42,61,0.7);

            padding: 8px 20px;

            border-radius: 20px;

        }

        /* Сферы применения */

        .applications-section {

            padding: 80px 0;

            background: #f8f9fa;

        }

        .applications-grid {

            display: grid;

            grid-template-columns: repeat(3, 1fr);

            gap: 30px;

            margin-top: 50px;

        }

        .application-card {

            background: #fff;

            border-radius: 12px;

            padding: 30px 25px;

            text-align: center;

            box-shadow: 0 5px 20px rgba(0,0,0,0.05);

            transition: all 0.3s ease;

            opacity: 0;

            transform: translateY(30px);

            transition: opacity 0.6s ease, transform 0.6s ease;

        }

        .application-card:hover {

            transform: translateY(-10px);

            box-shadow: 0 15px 30px rgba(0,0,0,0.1);

        }

        .app-icon {

            width: 80px;

            height: 80px;

            background: #efcc4a;

            color: #192a3d;

            border-radius: 50%;

            display: flex;

            align-items: center;

            justify-content: center;

            margin: 0 auto 20px;

            font-size: 30px;

            transition: all 0.3s ease;

        }

        .application-card:hover .app-icon {

            transform: scale(1.1);

            background: #192a3d;

            color: #efcc4a;

        }

        .app-title {

            font-size: 1.4rem;

            color: #192a3d;

            margin-bottom: 15px;

        }

        .app-description {

            color: #4a5568;

            line-height: 1.6;

        }

        /* Процесс */

        .process-section {

            padding: 80px 0;

            background: linear-gradient(135deg, #192a3d 0%, #2a3b4e 100%);

            color: #fff;

        }

        .process-section .section-title {

            color: #efcc4a;

        }

        .process-section .section-title::after {

            background: #fff;

        }

        .process-section .section-description {

            color: rgba(255,255,255,0.85);

        }

        .process-steps {

            display: flex;

            flex-direction: column;

            gap: 40px;

            margin-top: 50px;

        }

        .step-row {

            display: flex;

            justify-content: center;

            gap: 30px;

            flex-wrap: wrap;

        }

        .step {

            background: rgba(255,255,255,0.1);

            border-radius: 12px;

            padding: 30px 20px;

            text-align: center;

            box-shadow: 0 5px 15px rgba(0,0,0,0.1);

            transition: all 0.3s ease;

            opacity: 0;

            transform: translateY(30px);

            transition: opacity 0.6s ease, transform 0.6s ease;

            flex: 0 0 calc(33.333% - 30px);

            max-width: calc(33.333% - 30px);

            min-width: 280px;

            backdrop-filter: blur(5px);

            border: 1px solid rgba(239, 204, 74, 0.2);

        }

        .step:hover {

            transform: translateY(-10px);

            box-shadow: 0 15px 30px rgba(0,0,0,0.2);

            background: rgba(239, 204, 74, 0.15);

            border: 1px solid rgba(239, 204, 74, 0.4);

        }

        .step-icon {

            width: 80px;

            height: 80px;

            background: #efcc4a;

            color: #192a3d;

            border-radius: 50%;

            display: flex;

            align-items: center;

            justify-content: center;

            margin: 0 auto 20px;

            font-size: 30px;

            transition: all 0.3s ease;

        }

        .step:hover .step-icon {

            transform: scale(1.1);

            background: #fff;

            color: #192a3d;

        }

        .step-title {

            font-size: 1.4rem;

            color: #efcc4a;

            margin-bottom: 15px;

        }

        .step-description {

            color: rgba(255,255,255,0.85);

            line-height: 1.6;

        }

        /* FAQ */

        .paving-faq-section {

            padding: 80px 0;

            background: #f8f9fa;

        }

        .paving-faq-section .section-header {

            text-align: center;

            margin-bottom: 60px;

        }

        .paving-faq-section .section-title {

            font-size: 2.5rem;

            color: #192a3d;

            font-weight: 700;

            margin-bottom: 15px;

            position: relative;

            display: inline-block;

        }

        .paving-faq-section .section-title::after {

            content: "";

            position: absolute;

            bottom: -10px;

            left: 50%;

            transform: translateX(-50%);

            width: 100px;

            height: 4px;

            background: #efcc4a;

            border-radius: 2px;

        }

        .paving-faq-section .section-subtitle {

            font-size: 1.25rem;

            color: #4a5568;

            max-width: 800px;

            margin: 30px auto 0;

            line-height: 1.6;

        }

        .paving-faq-section .paving-faq {

            max-width: 900px;

            margin: 0 auto;

        }

        .paving-faq-section .faq-item {

            margin-bottom: 20px;

            border-radius: 12px;

            overflow: hidden;

            box-shadow: 0 5px 15px rgba(0,0,0,0.05);

        }

        .paving-faq-section .faq-question {

            padding: 20px;

            background: #fff;

            cursor: pointer;

            display: flex;

            justify-content: space-between;

            align-items: center;

            font-size: 1.2rem;

            font-weight: 600;

            color: #192a3d;

            transition: all 0.3s ease;

        }

        .paving-faq-section .faq-question::after {

            content: '+';

            font-size: 1.5rem;

            transition: transform 0.3s ease;

        }

        .paving-faq-section .faq-question.active {

            background: #efcc4a;

            color: #192a3d;

        }

        .paving-faq-section .faq-question.active::after {

            transform: rotate(45deg);

        }

        .paving-faq-section .faq-answer {

            padding: 0 20px;

            max-height: 0;

            overflow: hidden;

            background: #fff;

            transition: max-height 0.3s ease, padding 0.3s ease;

        }

        .paving-faq-section .faq-answer.active {

            padding: 20px;

            max-height: 500px;

        }

        /* Консультация */

        .paving-consultation-section {

            padding: 80px 0;

            background: #192a3d;

            text-align: center;

            position: relative;

            margin: 0;

            width: 100%;

        }

        .paving-consultation-section .cta-content {

            position: relative;

            z-index: 2;

            max-width: 700px;

            margin: 0 auto;

            padding: 0 20px;

        }

        .paving-consultation-section h2 {

            font-size: 2.5rem;

            color: #fff;

            margin-bottom: 15px;

        }

        .paving-consultation-section p {

            font-size: 1.2rem;

            color: rgba(255,255,255,0.9);

            margin-bottom: 30px;

        }

        .paving-consultation-section .cta-button {

            display: inline-block;

            padding: 15px 40px;

            background: #efcc4a;

            color: #192a3d !important;

            text-decoration: none;

            font-size: 1.2rem;

            font-weight: 600;

            border-radius: 6px;

            transition: all 0.3s ease;

            border: 2px solid #efcc4a;

        }

        .paving-consultation-section .cta-button:hover {

            background: #fce772;

            transform: translateY(-3px);

            box-shadow: 0 5px 15px rgba(239, 204, 74, 0.3);

        }

        /* Адаптивность */

        @media (max-width: 1200px) {

            .title { font-size: 2.6rem; }

            .subtitle { font-size: 1.4rem; }

            .gallery-grid, .applications-grid { gap: 20px; }

        }

        @media (max-width: 1024px) {

            .parallax-background { background-attachment: scroll !important; }

        }

        @media (max-width: 992px) {

            #paving-header-banner { height: 50vh; }

            .title { font-size: 2.2rem; }

            .subtitle { font-size: 1.2rem; }

            .section-title { font-size: 2rem; }

            .section-description { font-size: 1.15rem; }

            .gallery-grid, .applications-grid { grid-template-columns: repeat(2, 1fr); }

            .step, .application-card {

                flex: 0 0 calc(50% - 30px);

                max-width: calc(50% - 30px);

            }

        }

        @media (max-width: 768px) {

            .section-header { margin-bottom: 40px; }

            .section-divider { height: 3px; }

            .title { font-size: 2rem; }

            .subtitle { font-size: 1.1rem; }

            .paving-consultation-section { padding: 60px 0; }

            .image-wrapper { height: 250px; }

            .step, .application-card {

                flex: 0 0 100%;

                max-width: 100%;

            }

        }

        @media (max-width: 576px) {

            #paving-header-banner { height: 40vh; min-height: 300px; }

            .title { font-size: 1.8rem; }

            .subtitle { font-size: 1rem; }

            .gallery-grid, .applications-grid { grid-template-columns: 1fr; max-width: 500px; margin: 0 auto; }

            .section-title { font-size: 1.7rem; }

            .section-title::after { width: 70px; }

            .section-description { font-size: 1rem; }

            .paving-consultation-section h2 { font-size: 1.8rem; }

            .paving-consultation-section p { font-size: 1.1rem; }

            .paving-consultation-section .cta-button { padding: 12px 30px; font-size: 1.1rem; }

            .image-wrapper { height: 220px; }

        }
