/* ==========================================================================
   İletişim — tek premium panel (koyu bilgi alanı + harita) ve altında
   çizgi tabanlı sade teklif formu. Kart yığını YOK.
   ========================================================================== */

/* ---- Panel ------------------------------------------------------------- */
.contact__panel {
  display: grid;
  border-radius: var(--radius-lg);
  overflow: hidden;
  isolation: isolate;
  background: var(--color-dark);
  box-shadow: var(--shadow-lg);
}

.contact__info {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: clamp(var(--space-6), 4vw, var(--space-8));
  background: var(--gradient-dark);
  color: var(--color-on-dark);
  overflow: hidden;
}
.contact__info::before {
  /* köşede hafif altın ışıma */
  content: '';
  position: absolute;
  width: 520px;
  aspect-ratio: 1;
  left: -220px;
  bottom: -260px;
  background: var(--glow-gold-soft);
  pointer-events: none;
}
.contact__info > * { position: relative; }

.contact__list { margin: 0; border-top: 1px solid var(--color-line-on-dark); }
.contact__row {
  display: grid;
  gap: var(--space-1);
  padding: var(--space-5) 0;
  border-bottom: 1px solid var(--color-line-on-dark);
}
.contact__label {
  font-size: var(--fs-xs);
  font-weight: 600;
  letter-spacing: var(--ls-caps);
  text-transform: uppercase;
  color: var(--color-muted-on-dark);
}
.contact__value {
  margin: 0;
  font-size: var(--fs-h3);
  font-weight: 600;
  letter-spacing: -.01em;
  color: var(--color-white);
  font-variant-numeric: tabular-nums;
}
.contact__value a { display: inline-block; padding-block: var(--space-1); color: inherit; }
.contact__value a:hover { color: var(--color-primary-bright); }
.contact__value--address { font-size: var(--fs-body); font-weight: 500; line-height: 1.55; color: var(--color-text-on-media); }

.contact__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  margin-top: auto;
  padding-top: var(--space-6);
}
.contact__wa-icon { color: var(--color-whatsapp-bright); }
.contact__directions { margin-top: var(--space-5); align-self: flex-start; color: var(--color-muted-on-dark); }
.contact__directions:hover { color: var(--color-white); }

/* ---- Harita (Google Haritalar embed) ----------------------------------- */
.contact__map {
  position: relative;
  min-height: 340px;
  background: var(--color-dark-3);
  overflow: hidden;
}
.contact__map::after {
  /* koyu bilgi alanıyla birleşen kenarda yumuşak geçiş + iç çerçeve */
  content: '';
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  box-shadow: inset 0 0 0 1px var(--color-line-on-dark), var(--shadow-map-edge-top);
}
.contact__map-frame {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  border: 0;
  filter: var(--filter-map);
  transition: filter var(--dur-slow) var(--ease);
}
.contact__map:hover .contact__map-frame,
.contact__map:focus-within .contact__map-frame { filter: none; }

/* iframe yüklenene kadar görünen sade yer tutucu (iframe üstüne gelince kapanır) */
.contact__map-placeholder {
  position: absolute;
  inset: 0;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: var(--space-3);
  color: var(--color-muted-on-dark);
  font-size: var(--fs-xs);
  letter-spacing: .08em;
  text-transform: uppercase;
}
.contact__map-placeholder svg { width: 28px; height: 28px; fill: none; stroke: var(--color-primary); stroke-width: 1.6; }

@media (max-width: 575.98px) {
  .contact__actions .btn-at { flex: 1 1 auto; }
}
@media (min-width: 992px) {
  .contact__panel { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
  .contact__map { min-height: 520px; }
  .contact__map::after { box-shadow: inset 0 0 0 1px var(--color-line-on-dark), var(--shadow-map-edge); }
}

/* ---- Teklif formu — çizgi tabanlı, sade --------------------------------- */
.contact__request {
  display: grid;
  gap: var(--space-6);
  margin-top: clamp(var(--space-7), 6vw, var(--space-9));
  padding-top: clamp(var(--space-6), 4vw, var(--space-8));
  border-top: 1px solid var(--color-line-strong);
}
.contact__request-intro { display: grid; gap: var(--space-3); align-content: start; }
.contact__form-title { font-size: var(--fs-h3); font-weight: 700; }
.contact__form-sub { color: var(--color-muted); max-width: 40ch; }
.contact__note { font-size: var(--fs-xs); color: var(--color-muted); max-width: 40ch; }

.contact__form { display: grid; column-gap: var(--space-7); row-gap: var(--space-5); }
@media (min-width: 576px) {
  .contact__form { grid-template-columns: 1fr 1fr; }
  .field--wide { grid-column: 1 / -1; }
}
@media (min-width: 992px) {
  .contact__request { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: var(--space-9); }
}

.field { display: grid; gap: var(--space-1); align-content: start; }
.field__label {
  font-size: var(--fs-xs);
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--color-muted);
}
.field__label span { color: var(--color-primary-text); }

.field__input {
  width: 100%;
  min-height: 44px;
  padding: var(--space-2) 0;
  border: 0;
  border-bottom: 1px solid var(--color-line-strong);
  border-radius: 0;
  background: transparent;
  color: var(--color-text);
  font: inherit;
  font-size: var(--fs-body);
  transition: border-color var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease);
}
.field__input::placeholder { color: var(--color-muted); opacity: .7; }
.field__input:hover { border-bottom-color: var(--color-muted); }
.field__input:focus {
  outline: none;
  border-bottom-color: var(--color-primary);
  box-shadow: 0 1px 0 0 var(--color-primary);
}
.field__textarea { min-height: 88px; resize: vertical; }
.field__select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235E5E66' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right center;
  background-size: 18px;
  padding-right: var(--space-6);
}

.field.is-invalid .field__input { border-bottom-color: var(--color-danger); }
.field__error { font-size: var(--fs-xs); color: var(--color-danger-text); }

.contact__form-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: var(--space-4);
  margin-top: var(--space-2);
}
.contact__status:empty { display: none; }
.contact__status {
  flex: 1;
  padding: var(--space-3) var(--space-4);
  border-left: 2px solid var(--color-primary);
  background: var(--color-white);
  font-size: var(--fs-small);
}
@media (max-width: 575.98px) { .contact__submit { width: 100%; } }