/* --- Батьківська форма --- */
#gform_4,
#gform_3 {
  background: #1d1e28;
  padding: 30px;
  border-radius: 16px;
  max-width: 1200px;
  margin: 0 auto;
  font-family: "Helvetica", sans-serif;
}

/* --- Стили для всіх полів (input, select, textarea) --- */
#gform_4 .gfield input,
#gform_3 .gfield input,
#gform_4 .gfield select,
#gform_3 .gfield select,
#gform_4 .gfield textarea,
#gform_3 .gfield textarea {
  width: 100%;
  height: 50px;
  border-radius: 25px;
  border: none;
  padding: 20px;
  background: #2c2d39;
  color: #25dadb;
  font-size: 14px;
  box-sizing: border-box;
  transition: background 0.3s, box-shadow 0.3s;
  outline: none; /* При фокусі прибираємо обводку */
}

/* --- Стили для textarea --- */
#gform_4 .gfield textarea,
#gform_3 .gfield textarea {
  height: 150px;
  resize: vertical;
  line-height: 1.6;
  white-space: pre-wrap;
  word-break: break-word;
  overflow-wrap: break-word;
}

/* --- Мітки полів --- */
#gform_4 .gfield_label,
#gform_3 .gfield_label {
  font-size: 13px;
  margin-bottom: 5px;
  display: block;
  color: #aaa;
}

/* --- Загальні стилі для блоків полів --- */
#gform_4 .gfield,
#gform_3 .gfield {
  width: 100%;
  display: block;
  clear: both;
  margin-bottom: 20px;
}

/* --- Чекбокси --- */
#gform_4 .gfield_checkbox li,
#gform_3 .gfield_checkbox li {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
  line-height: 1.6;
}

/* --- Стилі для чекбокса --- */
#gform_4 .gfield-choice-input[type="checkbox"],
#gform_3 .gfield-choice-input[type="checkbox"] {
  width: 20px;
  height: 20px;
  accent-color: #25dadb;
  cursor: pointer;
  flex-shrink: 0;
  margin: 0;
}

/* --- Текст поруч із чекбоксом --- */
#gform_4 .gfield_checkbox li label,
#gform_3 .gfield_checkbox li label,
#gform_4 .gform-field-label--type-inline,
#gform_3 .gform-field-label--type-inline {
  font-size: 16px;
  color: #ddd;
  cursor: pointer;
  white-space: normal;
  flex: 1;
  margin: 0;
}

/* --- Центрування кнопки відправки у формі #gform_4 --- */
#gform_4 .gform_footer,
#gform_3 .gform_footer {
  display: flex !important;
  justify-content: center !important;
  position: relative !important;
}

#gform_4 .gform_footer .gform_button,
#gform_3 .gform_footer .gform_button {
  position: relative !important;
  margin: 0 auto !important;
  float: none !important;
  right: auto !important;
  bottom: auto !important;
}

/* --- Обов'язкові поля: стилі для символа * (якщо потрібно) --- */
#gform_4 .gfield_label .gfield_required,
#gform_3 .gfield_label .gfield_required {
  color: #d3f157;
  margin-left: 1px;
}

/* --- Стилі для select (включаючи поле вибору) --- */
#gform_4 .gfield select,
#gform_3 .gfield select {
  width: 100%;
  height: 50px;
  border-radius: 25px;
  border: none;
  padding: 0 20px;
  background: #2c2d39;
  color: #25dadb;
  font-size: 14px;
  box-sizing: border-box;
  transition: background 0.3s, box-shadow 0.3s;
  appearance: none; /* Прибираємо стандартне оформлення браузера */
  -webkit-appearance: none; /* Для Safari */
  -moz-appearance: none; /* Для Firefox */
}

/* --- Стрілка вниз (іконка для випадаючого списку) --- */
#gform_4 .ginput_container_select,
#gform_3 .ginput_container_select {
  position: relative;
}

/* --- Зміна стрілки при відкритті списку --- */
#gform_4 .ginput_container_select::after,
#gform_3 .ginput_container_select::after {
  content: '▼';
  font-size: 16px;
  color: #25dadb;
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-50%);
  pointer-events: none;
  transition: transform 0.3s ease; /* Анімація для стрілки */
}

/* --- Коли поле в фокусі або активне --- */
#gform_4 .ginput_container_select:focus-within::after,
#gform_3 .ginput_container_select:focus-within::after {
  transform: translateY(-50%) rotate(180deg); /* Поворот стрілки при відкритті */
}html {
  scroll-behavior: smooth;
}

:target {
  scroll-margin-top: 125px; /* подстрой под высоту своего хедера */
}.accordion-block-free {
  margin: 5.625rem 0 5.625rem;
}.map-container {
    position: relative;
    width: 100%;
}

.map-container svg {
    width: 100%;
    height: auto;
    display: block;
}

.map-container svg path {
    fill: #062020;
    stroke: #25dadb;
    stroke-width: 0.5;
    transition: fill 0.3s ease;
}

.map-container svg path:hover {
    fill: #041616;
    cursor: default;
}

.map-container .marker-group {
    cursor: pointer;
    transition: transform 0.2s ease;
    transform-box: fill-box;
    transform-origin: center;
}

.map-container .marker-group:hover {
    transform: scale(1.3);
}

.map-container .tooltip {
    position: absolute;
    background: #000; /* Черный фон */
    color: #d3f157;    /* Цвет текста */
    padding: 8px 12px;
    border-radius: 6px;
    font-size: 14px;
    pointer-events: none;
    opacity: 0;
    max-width: calc(100% - 16px);
    box-sizing: border-box;
    white-space: normal;
    overflow-wrap: anywhere;
    transition: opacity 0.3s ease;
    z-index: 10;
}
.map-container .tooltip.visible {
    opacity: 1;
}

.map-container .marker-group:focus-visible {outline:2px solid #d3f157;outline-offset:3px;}
@media(prefers-reduced-motion:reduce){.map-container .marker-group,.map-container .tooltip,.map-container svg path{transition:none;}}

.map-container .marker-group:focus:not(:focus-visible) {outline:none;}
/*# sourceMappingURL=components.css.map */