/* ==========================================================================
   İletişim sayfası — [ses_iletisim]. Kaynak: İletişim.dc.html
   Bu sayfada sağa yapışkan panel YOK — sticky iletişim rayı açık kalır,
   bu yüzden hiçbir bileşen sağa hizalı `position: sticky` almaz.
   ========================================================================== */

/* Breadcrumb bir <ol> üstünde kullanılıyor; components.css yalnızca
   flex/renk verir, liste sıfırlamasını burada sayfa-scope'a ekliyoruz. */
.ses-app[data-page="iletisim"] .ses-breadcrumb ol {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 9px;
}

/* --- Sayfa başlığı -------------------------------------------------------- */
.ses-ilt-hero {
  background: var(--ses-sky);
  border-bottom: 1px solid var(--ses-border);
  padding: 26px 0 48px;
}
.ses-ilt-hero__grid {
  display: grid;
  grid-template-columns: 7fr 5fr;
  gap: 56px;
  align-items: end;
  margin-top: 20px;
}
.ses-ilt-hero .ses-lead { max-width: 620px; margin-top: 14px; }

.ses-ilt-facts {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.ses-ilt-facts li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14.5px;
  color: var(--ses-muted);
}
.ses-ilt-facts li svg { flex: 0 0 auto; }
.ses-ilt-facts strong { color: var(--ses-navy); font-weight: 800; }

/* --- İletişim kanalları ---------------------------------------------------- */
.ses-ilt-channels { padding-top: 48px; }
/* `.ses-app .ses-grid { gap:24px }` (0,2,0) tek sınıflı kuralı yeniyordu;
   tasarımdaki kanal kartı aralığı 20px. */
.ses-app .ses-ilt-channels__grid { gap: 20px; }

.ses-app .ses-ilt-channel {
  padding: 26px 24px;
  text-decoration: none;
  color: inherit;
}
a.ses-ilt-channel:hover { border-color: var(--ses-blue-light); background: var(--ses-ice); }

.ses-ilt-channel__icon {
  width: 44px;
  height: 44px;
  border-radius: var(--ses-r-btn);
  background: var(--ses-ice);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
}
.ses-ilt-channel__icon--wa { background: var(--ses-cream); }

.ses-ilt-channel__label {
  display: block;
  font-size: 13px;
  font-weight: 700;
  color: var(--ses-muted);
  margin-bottom: 6px;
}
.ses-ilt-channel__value {
  display: block;
  font-size: 18px;
  font-weight: 800;
  color: var(--ses-navy);
}
.ses-ilt-channel__value--wrap { font-size: 14px; overflow-wrap: anywhere; }
.ses-ilt-channel__note {
  display: block;
  margin-top: 8px;
  font-size: 13px;
  line-height: 1.5;
  color: var(--ses-muted);
}

/* --- Form + yan panel ------------------------------------------------------ */
.ses-ilt-body__grid {
  display: grid;
  grid-template-columns: 7fr 5fr;
  gap: 48px;
  align-items: start;
}

.ses-ilt-form {
  border: 1px solid var(--ses-border);
  border-radius: var(--ses-r-panel);
  background: var(--ses-white);
  box-shadow: var(--ses-shadow-sticky);
  padding: 36px 40px;
}
.ses-ilt-form__desc { margin-top: 8px; margin-bottom: 28px; }
.ses-ilt-form__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}
.ses-ilt-form__field { margin-top: 18px; }

.ses-ilt-consent {
  margin-top: 18px;
  display: flex;
  gap: 11px;
  align-items: flex-start;
  cursor: pointer;
}
.ses-ilt-consent input {
  width: 17px;
  height: 17px;
  margin-top: 2px;
  accent-color: var(--ses-blue);
  cursor: pointer;
}
.ses-ilt-consent span { font-size: 13.5px; line-height: 1.6; color: var(--ses-muted); }
.ses-ilt-consent a { color: var(--ses-blue); font-weight: 700; }

.ses-ilt-form__actions {
  margin-top: 24px;
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
}
.ses-ilt-form__assure {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--ses-muted);
}

.ses-ilt-form__status {
  margin: 18px 0 0;
  padding: 14px 16px;
  border-radius: var(--ses-r-btn);
  background: var(--ses-ice);
  border: 1px solid var(--ses-border);
  font-size: 14.5px;
  font-weight: 700;
  color: var(--ses-navy);
  display: flex;
  align-items: center;
  gap: 10px;
}

/* --- Form hataları --------------------------------------------------------
   Kırmızı YALNIZ hata için kullanılır; marka kırmızısı (--ses-red) zaten
   uyarı tonudur. Hata metni alanın hemen altında, aria-describedby ile
   bağlanır — ekran okuyucu odakta okur. */
.ses-ilt-form__error {
  margin: 6px 0 0;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--ses-red);
}
.ses-ilt-form__error--top {
  margin: 0 0 18px;
  padding: 12px 14px;
  border-radius: var(--ses-r-btn);
  background: var(--ses-cream);
  border: 1px solid var(--ses-border-cream);
  font-size: 14px;
}
.ses-app .ses-ilt-form :is(.ses-input, .ses-textarea, .ses-select)[aria-invalid="true"] {
  border-color: var(--ses-red);
}

/* --- Bal küpü --------------------------------------------------------------
   `display:none` KULLANILMAZ: bazı botlar gizli alanı atlar. Görsel olarak
   akıştan çıkarılır ama DOM'da gerçek bir alan olarak durur; klavye ve ekran
   okuyucu erişemez (tabindex="-1" + aria-hidden). */
.ses-hp {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.ses-ilt-side { display: flex; flex-direction: column; gap: 16px; }
.ses-app .ses-ilt-hours,
.ses-app .ses-ilt-faq,
.ses-app .ses-ilt-corporate { padding: 26px 28px; }
.ses-app .ses-ilt-faq { background: var(--ses-ice); }

.ses-ilt-hours h2 { margin-bottom: 16px; }
.ses-ilt-hours__list {
  margin: 0;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 10px 16px;
  font-size: 15px;
}
.ses-ilt-hours__list dt { color: var(--ses-muted); font-weight: 600; }
.ses-ilt-hours__list dd { margin: 0; text-align: right; color: var(--ses-navy); font-weight: 800; }
.ses-ilt-hours__list dd.ses-ilt-hours__muted { color: var(--ses-muted); font-weight: 700; }

.ses-ilt-hours__note {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--ses-border-soft);
}
.ses-ilt-hours__note strong { color: var(--ses-navy); font-weight: 800; }
.ses-ilt-hours__meta { margin-top: 12px; }

.ses-ilt-faq h2,
.ses-ilt-corporate h2 { margin-bottom: 10px; }
.ses-ilt-faq p,
.ses-ilt-corporate p { margin-bottom: 16px; }

.ses-ilt-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14.5px;
  font-weight: 800;
  color: var(--ses-blue);
}
.ses-ilt-link:hover { color: var(--ses-blue-dark); }

/* --- Ofis ve harita --------------------------------------------------------- */
.ses-ilt-map { padding-top: 96px; }
.ses-ilt-map__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 32px;
  margin-bottom: 28px;
}
.ses-ilt-eyebrow {
  position: relative;
  padding-left: 32px;
  margin-bottom: 10px;
}
.ses-ilt-eyebrow::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 22px;
  height: 3px;
  border-radius: var(--ses-r-pill);
  background: var(--ses-orange);
}

.ses-ilt-map__grid {
  display: grid;
  grid-template-columns: 7.5fr 4.5fr;
  gap: 24px;
  align-items: stretch;
}

.ses-ilt-map__frame {
  position: relative;
  min-height: 420px;
  border: 1px solid var(--ses-border);
  border-radius: var(--ses-r-panel);
  overflow: hidden;
  background: var(--ses-ice);
}
.ses-ilt-map__frame iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}
.ses-ilt-map__loading {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
}
.ses-ilt-map__loading span { font-size: 12.5px; font-weight: 700; color: var(--ses-muted); }

.ses-app .ses-ilt-office {
  overflow: hidden;
  padding: 0;
}
.ses-ilt-office__media {
  width: 100%;
  height: 180px;
  overflow: hidden;
}
.ses-ilt-office__media img { width: 100%; height: 100%; object-fit: cover; object-position: center 55%; display: block; }

.ses-ilt-office__body {
  padding: 26px 30px 28px;
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
}
.ses-ilt-office__body h3 { margin-bottom: 14px; }
.ses-ilt-office__body address {
  font-style: normal;
  font-size: 16px;
  line-height: 1.75;
  color: var(--ses-muted);
}

.ses-ilt-office__ticks {
  margin: 20px 0 24px;
  padding-top: 20px;
  border-top: 1px solid var(--ses-border-soft);
}
.ses-ilt-office__cta { margin-top: auto; }

/* --- Kırılma noktaları ------------------------------------------------------ */
@media (max-width: 1239px) {
  .ses-ilt-form { padding: 30px 28px; }
}

@media (max-width: 939px) {
  .ses-ilt-hero__grid { grid-template-columns: 1fr; gap: 24px; align-items: start; }
  .ses-ilt-channels__grid.ses-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ses-ilt-body__grid { grid-template-columns: 1fr; }
  .ses-ilt-map__grid { grid-template-columns: 1fr; }
  .ses-ilt-map__frame { min-height: 320px; }
}

@media (max-width: 700px) {
  .ses-ilt-channels__grid.ses-grid--4 { grid-template-columns: 1fr; }
  .ses-ilt-form { padding: 26px 20px; }
  .ses-ilt-form__grid { grid-template-columns: 1fr; }
  .ses-ilt-map__head { flex-direction: column; align-items: flex-start; }
}