.captcha-wrapper {
    display: flex;
    justify-content: center; /* Центрує по горизонталі */
    margin-bottom: 20px;     /* Відступ до кнопки */
    width: 100%;
}
		
		:root {
            --bg-dark: #080808; /* Темно-сірий фон */
            /* --bg-section: #363636; /* Світліший сірий для блоків */
			--bg-section: #222; /* Світліший сірий для блоків */
            --accent-blue: #3498db;
            --text-main: #f5f5f5;
            --text-muted: #bdc3c7;
        }

        body { 
            font-family: 'Helvetica Neue', Arial, sans-serif; 
            margin: 0; padding: 0; 
            scroll-behavior: smooth; 
            background-color: var(--bg-dark); 
            color: var(--text-main); 
        }
        
        /* Навігація */
        nav { 
            position: fixed; top: 0; width: 100%; 
            background: rgba(52, 152, 219, 0.8); 
            backdrop-filter: blur(5px);
            z-index: 1000; display: flex; justify-content: center; padding: 15px 0; 
        }
        nav a { margin: 0 15px; text-decoration: none; color: var(--text-main); font-weight: 500; transition: 0.3s; }
        nav a:hover { color: var(--accent-blue); }

        /* Шапка з відео-анімацією */
        header { 
            margin-top: 50px;
            width: 100%; 
            height: 400px; /* Приклад висоти XXXpx */
            position: relative;
            overflow: hidden;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        header video {
          display: block;
          // width: 100%;    /* Відео завжди займає всю ширину */
          height: auto;   /* Висота підлаштовується автоматично, щоб не обрізати */
          z-index: 1;
          filter: brightness(0.7);
        }

.header-content { 
    position: absolute; /* Текст буде поверх відео */
    text-align: center; 
    z-index: 2; 
    text-shadow: 2px 2px 10px rgba(0,0,0,0.8);
    width: 100%;
}
        section { padding: 80px 20px; max-width: 1200px; margin: 0 auto; }
        h2 { text-align: center; color: var(--accent-blue); margin-bottom: 40px; }

        /* Сітка фото */
        .photo-grid {
            display: grid;
            grid-template-columns: repeat(3, 324px);
            grid-template-rows: repeat(4, 240px);
            gap: 20px;
            justify-content: center;
        }
        .photo-item {
            width: 324px; height: 240px;
            background: #444; cursor: pointer;
            overflow: hidden; border-radius: 4px;
            border: 1px solid #555;
        }
        .photo-item img { width: 100%; height: 100%; object-fit: cover; transition: 0.4s; }
        .photo-item:hover img { transform: scale(1.1); filter: brightness(1.2); }

        /* Модальне вікно */
/* Кнопка закриття */
.close-modal {
    position: absolute;
    top: 20px;
    right: 40px;
    color: #f1f1f1;
    font-size: 60px;
    font-weight: bold;
    cursor: pointer;
    transition: 0.3s;
    z-index: 2100;
    line-height: 1;
}

.close-modal:hover {
    color: var(--accent-blue);
    transform: scale(1.2);
}

/* Додамо плавне відкриття модального вікна */
.modal {
    display: none; 
    position: fixed;
    top: 0; left: 0; 
    width: 100%; height: 100%;
    background: rgba(0,0,0,0.9); 
    z-index: 2000;
    justify-content: center; 
    align-items: center;
    transition: 0.3s;
}

/* Заборона прокрутки сторінки при відкритому фото */
body.modal-open {
    overflow: hidden;
}
        .modal img { width: 1920px; max-width: 90%; height: auto; border: 2px solid var(--accent-blue); }

        /* Відео YouTube */
        .video-wrapper { 
		          max-width: 800px; 
				  margin: 0 auto; 
				  // padding: 0 15px;
		}
        .video-container { position: relative; padding-bottom: 56.25%; height: 0; }
        .video-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; border-radius: 8px; }
        .video-container video { width: 100%; height: auto; border-radius: 8px; border: 1px solid #555; box-shadow: 0 4px 20px rgba(0,0,0,0.4); background-color: #000; }

        /* Таблиця та форма */
        .price-table { width: 100%; border-collapse: collapse; background: var(--bg-section); }
        .price-table th, .price-table td { border: 1px solid #555; padding: 15px; text-align: left; }
        .price-table th { background: #444; }
        
        form { display: flex; flex-direction: column; gap: 15px; max-width: 500px; margin: 0 auto; }
        input, textarea, button { 
            padding: 12px; border-radius: 4px; border: 1px solid #555; 
            background: #444; color: white; font-size: 16px; 
        }
        button { background: var(--accent-blue); cursor: pointer; font-weight: bold; border: none; }
        button:hover { background: #2980b9; }

        footer { background: #1a1a1a; padding: 60px 20px; text-align: center; }
        .map-container { margin-top: 30px; margin: auto; max-width: 1200px; border-radius: 10px; overflow: hidden; border: 1px solid #555; }
        /* Адаптивність для мобільних пристроїв */
@media (max-width: 768px) {
    /* Центруємо текст у всіх секціях */
    section, .header-content, footer {
        text-align: center;
    }

    /* Шапка: центруємо вміст */
    header {
        height: 300px; /* Трохи зменшуємо висоту для мобільних */
    }

	header video {
			width: auto;         /* Скидаємо жорстку ширину 100% */
			height: 70%;         /* Встановлюємо бажані 70% від висоти шапки */
			top: 50%;            /* Центруємо відео по вертикалі всередині шапки */
			left: 50%;           /* Центруємо по горизонталі */
			transform: translate(-50%, -50%);
			position: absolute;
		}
	}

    .header-content h1 {
        font-size: 1.8rem;
    }
    /* Галерея: перетворюємо на 1 стовпчик */
    .photo-grid {
        grid-template-columns: 1fr; /* Одна колонка на всю ширину */
        grid-template-rows: auto;
        gap: 15px;
        justify-items: center;
    }

    /* Адаптуємо розмір фото під ширину екрана */
    .photo-item {
        width: 100%;
        max-width: 324px; /* Але не більше вашого макета */
        height: 240px;
    }

    /* Ціни: робимо таблицю зручною для читання */
    .price-table {
        font-size: 14px;
    }
    .price-table th, .price-table td {
        padding: 10px 5px;
    }

    /* Форма замовлення на весь екран */
    form {
        width: 100%;
        padding: 0 10px;
        box-sizing: border-box;
    }

    /* Навігація: робимо посилання дрібнішими, щоб влізли в рядок */
    nav a {
        margin: 0 5px;
        font-size: 15px;
    }
}

/* Контейнер для іконок */
.social-icons {
    display: flex;
    justify-content: center; /* Центруємо іконки на сторінці */
    gap: 20px;               /* Відступ між іконками */
    margin: 20px 0;
}

/* Загальні стилі для кнопок-іконок */
.social-icons a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    background: #444;        /* Темно-сірий фон кнопки під ваш дизайн */
    color: #fff;             /* Білий колір самої іконки */
    font-size: 30px;         /* Розмір значка всередині */
    border-radius: 50%;      /* Робимо кнопку ідеально круглою */
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
}

/* Ефект при наведенні на Telegram (фірмовий блакитний колір) */
.social-icons a.icon-tg:hover {
    background: #24A1DE;
    transform: translateY(-5px); /* Кнопка злегка підстрибує вгору */
    box-shadow: 0 6px 15px rgba(36, 161, 222, 0.4);
}

/* Ефект при наведенні на Viber (фірмовий фіолетовий колір) */
.social-icons a.icon-viber:hover {
    background: #735F92;
    transform: translateY(-5px);
    box-shadow: 0 6px 15px rgba(115, 95, 146, 0.4);
}

.social-icons table {
    margin: 0 auto; /* Центрує таблицю по горизонталі */
    text-align: center; /* Центрує текст (Telegram/Viber) всередині комірок */
}