/* Контактная панель */
.contact-inner{width:100%;max-width:900px;margin:0 auto;padding:10px}
.contact-panel{
  width:100%;
  background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(0,0,0,0.18));
  border-radius:14px;
  padding:20px;
  overflow: visible;
  box-shadow:0 10px 40px rgba(0,0,0,0.6);
  border:1px solid rgba(255,255,255,0.03);
}

/* Уведомление сверху */
.notice{
  display:flex;
  gap:14px;
  align-items:flex-start;
  background:linear-gradient(90deg, rgba(27,182,118,0.06), transparent);
  padding:14px;
  border-radius:10px;
  margin-bottom:18px;
  color:var(--muted);
  font-weight:600;
}
.notice i{
  color:var(--green-1);
  font-size:24px;
  flex:0 0 28px;
}

/* Форма */
.appeal-form{display:flex;flex-direction:column;gap:12px}
.field{display:flex;flex-direction:column;gap:8px;font-size:14px}
.field span{color:var(--muted);font-weight:700}
.field input[type="text"],
.field input[type="email"],
.field input[type="tel"],
.field select,
.field textarea,
.field input[type="file"]{
  background:rgba(255,255,255,0.02);
  border:1px solid rgba(255,255,255,0.04);
  color:var(--text-light);
  padding:12px 14px;
  border-radius:10px;
  outline:none;
  font-size:14px;
  -webkit-appearance:none;
  appearance:none;
  position: relative; 
  z-index: 9999;
}
.field input[type="file"]{padding:8px 12px}

.field option {
    background-color: rgba(255,255,255,0.02);
    background:rgba(255,255,255,0.02);
    color:black;
    -webkit-appearance:none;
  appearance:none;
}

/* Кастомный select */
.field select{
  -webkit-appearance:none;
  appearance:none;
  position: relative; 
  z-index: 9999;
  background:
    linear-gradient(90deg, rgba(255,255,255,0.02), rgba(0,0,0,0.06)),
    linear-gradient(90deg,var(--green-1),var(--green-2));
  background-origin: padding-box;
  color:var(--text-light);
  padding:12px 40px 12px 14px;
  border:1px solid rgba(255,255,255,0.04);
  border-radius:10px;
  font-size:14px;
  cursor:pointer;
  outline:none;
  box-shadow: inset 0 -8px 24px rgba(0,0,0,0.35);
  transition:box-shadow 180ms, border-color 180ms, transform 80ms;
  background-repeat:no-repeat;
  background-position: right 12px center;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path fill='%23eef2ee' d='M6 8L0 0h12z'/></svg>");
}

/* Ховер / фокус */
.field select:hover{ border-color: rgba(255,255,255,0.08); box-shadow:0 6px 26px rgba(0,0,0,0.45)}
.field select:focus{ box-shadow:0 8px 30px rgba(20,168,91,0.12); border-color: rgba(20,168,91,0.6); }

/* Для плейсхолдера (первый option) */
.field select option[disabled][value=""]{ color:var(--muted) }

/* Мобильные исправления */
@media (pointer:coarse){
  .field select{ padding-right:18px; background-position:right 8px center }
}

/* Ряд для двух колонок */
.row{display:flex;gap:12px}
.row .field{flex:1}

/* Текстовое поле */
.field textarea{resize:vertical;min-height:120px;line-height:1.4}

/* Кнопка */
.form-actions{display:flex;justify-content:flex-end;margin-top:6px}
.btn-submit{
  background:linear-gradient(90deg,var(--green-1),var(--green-2));
  color:#07120c;
  padding:12px 18px;
  border-radius:10px;
  font-weight:800;
  border:none;
  cursor:pointer;
  box-shadow:0 8px 30px rgba(20,168,91,0.14);
}
.btn-submit:active{transform:translateY(1px)}

/* Адаптив */
@media (max-width:820px){
  .row{flex-direction:column}
  .hero{padding:24px}
  .contact-panel{padding:16px}
}


/* Мобильная адаптация контактной панели */
@media (max-width:600px){
  .contact-inner{padding:8px;max-width:100%}
  .contact-panel{
    padding:14px;
    border-radius:12px;
    box-shadow:0 8px 30px rgba(0,0,0,0.55);
  }

  /* Уведомление */
  .notice{
    flex-direction:row;
    gap:10px;
    align-items:center;
    padding:10px;
    font-size:13px;
  }
  .notice i{font-size:20px;flex:0 0 24px}

  /* Форма — общие */
  .appeal-form{gap:10px}
  .field{gap:6px;font-size:15px}
  .field span{font-size:13px}

  /* Инпуты */
  .field input[type="text"],
  .field input[type="email"],
  .field input[type="tel"],
  .field select,
  .field textarea,
  .field input[type="file"]{
    width:100%;
    padding:12px 14px;
    font-size:15px;
    border-radius:10px;
  }
  .field input[type="file"]{padding:10px 12px}

  /* Select — нативнее и полноширинный */
  .field select{
    width:100%;
    padding-right:36px; /* место для стрелки */
    background-position:right 12px center;
    font-size:15px;
    -webkit-appearance:none;
    appearance:none;
  }
  @media (pointer:coarse){
    .field select{padding-right:28px;background-position:right 8px center}
  }

  .field option{font-size:15px}

  /* Список в две колонки -> колонка */
  .row{flex-direction:column;gap:10px}
  .row .field{width:100%}

  /* Текстовое поле */
  .field textarea{min-height:110px;font-size:15px}

  /* Кнопка */
  .form-actions{justify-content:stretch}
  .btn-submit{
    width:100%;
    padding:12px;
    font-size:16px;
    border-radius:10px;
  }

  /* Убрать отрицательное позиционирование/overflow, если есть */
  .contact-panel, .contact-inner, .field, .row{overflow:visible}
  .contact-panel [style], .contact-inner [style]{left:auto;right:auto;width:100%}
}