html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
  color: var(--bs-secondary-color);
  text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
  text-align: start;
}

/* ==========================================================================
   İletişim sayfası — ofis kartları, harita ve form

   ÖNEMLİ: Bu sayfada Bootstrap grid'ine (row / col-*) güvenilmiyor.
   wwwroot/css/bootstrap.min.css dosyası bozuk (uzantısı .css ama içeriği
   ayrıştırılamayan ikili veri) ve style.css'te de bir grid tanımı yok, yani
   col-* sınıfları sitede tamamen etkisiz. Düzen bu yüzden kendi flex/grid
   kurallarıyla kuruluyor.

   Kurallar .ofis-*, .harita-* ve .iletisim-* altına kapatıldı; footer ve
   mobil menüdeki iletişim bilgileri bu dosyadan etkilenmez.
   ========================================================================== */

.iletisim-bolum {
  padding-bottom: 3.5em;
}

.iletisim-bolum__baslik {
  margin: 2.2em 0 1.8em;
}

/* --- Ofis kartları --- */

.ofis-listesi {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.6em;
  margin: 0 0 2.4em;
}

@media (min-width: 768px) {
  .ofis-listesi--coklu {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ofis-listesi--tekli {
    max-width: 620px;
    margin-inline: auto;
  }
}

.ofis-karti {
  height: 100%;
  background: #fff;
  border: 1px solid #e6e8ec;
  /* Üstteki kırmızı şerit kartı markaya bağlıyor. */
  border-top: 3px solid var(--theme-color2, #d70006);
  padding: 1.8em 1.9em 1.6em;
  transition: box-shadow 300ms ease, transform 300ms ease;
}

.ofis-karti:hover {
  box-shadow: 0 14px 34px rgba(35, 35, 49, 0.1);
  transform: translateY(-3px);
}

.ofis-karti__ad {
  color: var(--theme-color1, #232331);
  font-size: 19px;
  font-weight: 700;
  letter-spacing: 0.2px;
  margin: 0 0 1.1em;
  padding-bottom: 0.7em;
  border-bottom: 1px solid #eef0f3;
}

.ofis-karti__liste {
  list-style: none;
  margin: 0;
  padding: 0;
}

.ofis-karti__liste li {
  display: flex;
  /* flex-start olmadan ikon kabı satır yüksekliğine göre esner; adres üç
     satıra çıkınca ikon ovalleşiyordu. */
  align-items: flex-start;
  gap: 0.9em;
  margin-bottom: 1em;
}

.ofis-karti__liste li:last-child {
  margin-bottom: 0;
}

.ofis-karti__ikon {
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #f4f5f8;
  color: var(--theme-color2, #d70006);
  border-radius: 50%;
  transition: background 300ms ease, color 300ms ease;
}

.ofis-karti:hover .ofis-karti__ikon {
  background: var(--theme-color2, #d70006);
  color: #fff;
}

.ofis-karti__ikon span {
  font-size: 15px;
  line-height: 1;
}

.ofis-karti__metin {
  color: var(--text-color, #797f7d);
  font-size: 15px;
  line-height: 1.65;
  padding-top: 0.4em;
}

.ofis-karti__metin a {
  color: var(--text-color, #797f7d);
  transition: color 300ms ease;
}

.ofis-karti__metin a:hover {
  color: var(--theme-color2, #d70006);
}

/* --- Haritalar --- */

.harita-listesi {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.8em;
  padding-bottom: 3.5em;
}

@media (min-width: 768px) {
  .harita-listesi--coklu {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.harita-karti__ad {
  color: var(--theme-color1, #232331);
  font-size: 17px;
  font-weight: 700;
  margin: 0 0 0.7em;
}

.harita-karti iframe {
  display: block;
  width: 100%;
  height: 380px;
  border: 1px solid #e6e8ec;
}

/* --- İletişim formu --- */

.iletisim-form-kart {
  background: #fff;
  border: 1px solid #e6e8ec;
  box-shadow: 0 18px 44px rgba(35, 35, 49, 0.07);
  padding: 2.6em 2.6em 2.4em;
}

.iletisim-form-kart__ust {
  margin-bottom: 2em;
  padding-bottom: 1.4em;
  border-bottom: 1px solid #eef0f3;
}

.iletisim-form-kart__ust h3 {
  color: var(--theme-color1, #232331);
  font-size: 28px;
  font-weight: 700;
  margin: 0 0 0.45em;
  position: relative;
  padding-left: 0.7em;
}

/* Başlığın solundaki kırmızı çizgi, ofis kartlarının üst şeridiyle aynı dil. */
.iletisim-form-kart__ust h3::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.14em;
  bottom: 0.14em;
  width: 4px;
  background: var(--theme-color2, #d70006);
}

.iletisim-form-kart__ust p {
  color: var(--text-color, #797f7d);
  font-size: 15px;
  line-height: 1.7;
  margin: 0;
  max-width: 62ch;
}

.iletisim-form__izgara {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0 1.4em;
}

@media (min-width: 768px) {
  .iletisim-form__izgara {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .iletisim-form__alan--tam {
    grid-column: 1 / -1;
  }
}

.iletisim-form__alan {
  margin-bottom: 1.4em;
}

.iletisim-form__alan label {
  display: block;
  color: var(--theme-color1, #232331);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-bottom: 0.6em;
}

.iletisim-form__alan label .zorunlu {
  color: var(--theme-color2, #d70006);
}

.iletisim-form .form-control {
  display: block;
  width: 100%;
  background: #f7f8fa;
  border: 1px solid #e3e5ea;
  border-radius: 0;
  height: 56px;
  padding: 12px 18px;
  font-size: 15px;
  font-family: inherit;
  color: var(--theme-color1, #232331);
  box-shadow: none;
  transition: border-color 250ms ease, background 250ms ease, box-shadow 250ms ease;
}

.iletisim-form textarea.form-control {
  height: auto;
  min-height: 150px;
  padding-top: 14px;
  line-height: 1.7;
  resize: vertical;
}

.iletisim-form .form-control::placeholder {
  color: #a9aeb5;
}

.iletisim-form .form-control:focus {
  background: #fff;
  border-color: var(--theme-color2, #d70006);
  box-shadow: 0 0 0 3px rgba(215, 0, 6, 0.1);
  outline: none;
}

.iletisim-form .form-control.input-validation-error {
  border-color: var(--theme-color2, #d70006);
  background: #fff7f7;
}

.iletisim-form .text-danger {
  display: block;
  color: var(--theme-color2, #d70006);
  font-size: 13px;
  margin-top: 0.4em;
}

.iletisim-form__alt {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1.2em;
  padding-top: 1.6em;
  border-top: 1px solid #eef0f3;
}

.iletisim-form__not {
  color: #a9aeb5;
  font-size: 13px;
  margin: 0;
}

@media (max-width: 575px) {
  .iletisim-form-kart {
    padding: 1.8em 1.4em 1.6em;
  }

  .ofis-karti {
    padding: 1.5em 1.4em 1.3em;
  }

  .iletisim-form__alt {
    justify-content: center;
    text-align: center;
  }

  .harita-karti iframe {
    height: 300px;
  }
}

/* Logo kutusu, sablonda ustteki iletisim barina bindirilsin diye 40px yukari
   cekiliyor (style.css: .header-lower .logo-box). O bar bu projede kapali
   (style.css: .header-top { display: none }), dolayisiyla telafi edecek bir
   yukseklik yok: logo sayfanin tepesinden 20px tasiyor ve .page-wrapper
   overflow:hidden oldugu icin ustu kesik goruntuleniyordu. responsive.css
   ayni sifirlamayi 1199px altinda zaten yapiyor; eksik olan masaustuydu. */
.header-lower .logo-box {
  margin-top: 0;
}
