/**
 * Acil Sertifika Core — "İletişim" ([asc_contact]) sayfaya özel stiller (v2).
 *
 * Taban (konteyner, 96/96 bölüm ritmi, kart, form alanı, buton, ikon kutusu)
 * paylaşılan assets/css/asc.css'ten gelir; bu dosya YALNIZCA tasarım v2
 * `.dc.html` 1332–1417 ile birebir eşleşme için gereken sayfa bileşenlerini +
 * paylaşılan bilgi talebi formunun (partials/lead-form.php) görünümünü ekler.
 *
 * Scope: .asc-app[data-page="contact"] (sayfa bileşenleri) — TEK İSTİSNA §3:
 * lead-form BİLEŞENİ .asc-app altında durur (aşağıdaki uyarıya bakın).
 * RENK KURALI: yalnızca asc.css §1 --as-* token'ları; ham hex YOKTUR.
 *
 * @package acil-sertifika-core
 */

/* =========================================================================
   1) HERO — üstten alta buz mavisi → beyaz degrade
   ========================================================================= */
.asc-app[data-page="contact"] .as-cnt-hero {
  background: linear-gradient(180deg, var(--as-tint), var(--as-white));
  border-bottom: 1px solid var(--as-line-2);
}
.asc-app[data-page="contact"] .as-cnt-hero__in { padding-block: 44px 52px; }
.asc-app[data-page="contact"] .as-cnt-hero__title {
  margin-top: 18px;
  color: var(--as-navy);
}
.asc-app[data-page="contact"] .as-cnt-hero__lead {
  margin-top: 14px;
  max-width: 620px;
}

/* =========================================================================
   2) FORM + YAN KOLON — tasarımdaki iki kolonlu yerleşim
   Yan kolondaki kartlar BOŞ AYARDA hiç basılmaz; ikisi de yoksa markup
   `--solo` sınıfını verir ve form tek başına ortalanır.
   ========================================================================= */
/* DC 1344: `padding:56px 0 96px`. Bölüm paylaşılan `.as-section` sınıfını taşıdığı
   için üstte de 96px basıyordu (ölçüm) — hero'nun hemen ardından gelen form kartı
   tasarımdakinden 40px aşağıdaydı. Alt boşluk standart ritimde (96) kalır. */
.asc-app[data-page="contact"] .as-cnt-main { padding-top: 56px; }
@media (max-width: 899.98px) {
  /* Taban ritim 64px'e inince oranı koru. */
  .asc-app[data-page="contact"] .as-cnt-main { padding-top: 40px; }
}

.asc-app[data-page="contact"] .as-cnt-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 32px;
  align-items: start;
}
@media (min-width: 1000px) {
  .asc-app[data-page="contact"] .as-cnt-grid {
    grid-template-columns: minmax(360px, 1fr) minmax(300px, 380px);
    gap: 48px;
  }
}
/* Tüm iletişim ayarları boşken: tek kolon, okunur genişlikte ortalı. */
.asc-app[data-page="contact"] .as-cnt-grid--solo {
  grid-template-columns: minmax(0, 760px);
  justify-content: center;
}
/* Grid item'ı içeriğinin min-content'ine göre track'i aşmasın (mobil taşma). */
.asc-app[data-page="contact"] .as-cnt-grid > * { min-width: 0; }

.asc-app[data-page="contact"] .as-cnt-aside {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.asc-app[data-page="contact"] .as-cnt-side {
  padding: 26px;
  border-radius: 20px;
}
.asc-app[data-page="contact"] .as-cnt-side--reach { background: var(--as-tint); }
.asc-app[data-page="contact"] .as-cnt-side__title {
  font-size: 1.1rem;
  font-weight: 800;
  letter-spacing: -.02em;
  color: var(--as-navy);
}
.asc-app[data-page="contact"] .as-cnt-side__list,
.asc-app[data-page="contact"] .as-cnt-side__hours {
  margin-top: 16px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.asc-app[data-page="contact"] .as-cnt-side__link {
  min-height: var(--as-tap);
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.4;
  color: var(--as-navy-2);
}
.asc-app[data-page="contact"] .as-cnt-side__link:hover,
.asc-app[data-page="contact"] .as-cnt-side__link:focus-visible { color: var(--as-blue); }
.asc-app[data-page="contact"] .as-cnt-side__ico {
  width: 38px;
  height: 38px;
  flex: none;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: var(--as-white);
  color: var(--as-blue);
}
.asc-app[data-page="contact"] .as-cnt-side__link--whatsapp .as-cnt-side__ico { color: var(--as-wa); }
/* Uzun e-posta adresi dar kolonda taşmasın. */
.asc-app[data-page="contact"] .as-cnt-side__text { overflow-wrap: anywhere; }

.asc-app[data-page="contact"] .as-cnt-side__hours {
  gap: 6px;
  font-size: 14.5px;
  font-weight: 600;
  line-height: 1.7;
  color: var(--as-ink-2);
}

/* =========================================================================
   4) HARİTA — hazır embed ya da adresten API'siz `output=embed` iframe'i
   (İkisi de yoksa bölüm hiç basılmaz; boş gri kutu YOK.)
   TASARIMDAN SAPMA: prototipte harita bölümü yok; adres girildiğinde
   gösterilmesi iş gereği (00-CURRENT-STATE §4 "Adres → Genel ayar").
   ========================================================================= */
.asc-app[data-page="contact"] .as-cnt-map__frame {
  position: relative;
  margin-top: 26px;
  border: 1px solid var(--as-line-2);
  border-radius: var(--as-r-media);
  overflow: hidden;
  box-shadow: var(--as-shadow-rest);
  background: var(--as-white);
  aspect-ratio: 16 / 7;
  min-height: 280px;
  /* ⚠️ `width:100%` ZORUNLU. Genişlik yazılmazsa kutu `aspect-ratio` + `min-height`
     ikilisinden TÜRETİLİR: dar ekranda oran 4/3'e dönünce 280 × 4/3 = 373.3px
     çıkıyor ve 350px'lik içerik kolonundan 23px TAŞIYOR (390px'te ölçüldü —
     harita sağ kenardan taşıp yuvarlak köşeleri kırpılıyordu). */
  width: 100%;
}
.asc-app[data-page="contact"] .as-cnt-map__frame iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}

/* =========================================================================
   5) DAR EKRAN
   ========================================================================= */
@media (max-width: 599.98px) {
  .asc-app[data-page="contact"] .as-cnt-hero__in { padding-block: 32px 40px; }
  .asc-app[data-page="contact"] .as-cnt-side { padding: 22px; }
  .asc-app[data-page="contact"] .as-cnt-map__frame { aspect-ratio: 4 / 3; }
}

/* =========================================================================
   6) KANAL KARTLARI + DÖNÜŞ SÜRESİ ŞERİDİ  (müşteri talebi 2026-08-12)
   Tasarımda (dc-ref) iletişim sayfası hero + form + tek "Doğrudan ulaşın"
   listesinden ibaretti; sayfa zayıf duruyordu. Üç kanal artık hero'nun altında
   tam kart. Kartın TAMAMI tek <a> — iç içe bağlantı yok, dokunma hedefi büyük.
   Izgara veri sayısına göre daralır (--3 / --2 / --1); eksik kanal boşluk bırakmaz.
   ========================================================================= */
.asc-app[data-page="contact"] .as-cnt-channels { padding-block: 0 8px; }

.asc-app[data-page="contact"] .as-cnt-channels__grid {
  display: grid;
  gap: 20px;
  margin: 0;
  padding: 0;
  list-style: none;
}
@media (min-width: 760px) {
  .asc-app[data-page="contact"] .as-cnt-channels__grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .asc-app[data-page="contact"] .as-cnt-channels__grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.asc-app[data-page="contact"] .as-cnt-ch { min-width: 0; }
.asc-app[data-page="contact"] .as-cnt-ch__link {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr auto;
  grid-template-areas:
    "ico kicker go"
    "ico value  go"
    "ico note   go";
  align-items: center;
  column-gap: 15px;
  height: 100%;
  padding: 22px 24px;
  border: 1px solid var(--as-line);
  border-radius: var(--as-r-card);
  background: var(--as-white);
  /* Kart gölgesi tasarımın hafif kart gölgesiyle aynı; asc.css'te bu değer için
     ayrı bir token yok (hayalet token'a atıf yapmıyoruz). */
  box-shadow: 0 2px 6px rgba(7, 29, 73, .04);
  color: var(--as-navy);
  text-decoration: none;
  transition: transform .2s var(--as-ease), box-shadow .2s var(--as-ease), border-color .2s var(--as-ease);
}
.asc-app[data-page="contact"] .as-cnt-ch__link:hover,
.asc-app[data-page="contact"] .as-cnt-ch__link:focus-visible {
  transform: translateY(-4px);
  box-shadow: var(--as-shadow-card);
  border-color: var(--as-blue-ring, #2B6FF7);
}
@media (prefers-reduced-motion: reduce) {
  .asc-app[data-page="contact"] .as-cnt-ch__link:hover,
  .asc-app[data-page="contact"] .as-cnt-ch__link:focus-visible { transform: none; }
}

.asc-app[data-page="contact"] .as-cnt-ch__ico {
  grid-area: ico;
  display: grid;
  place-items: center;
  width: 46px; height: 46px;
  border-radius: 14px;
  background: var(--as-tint-3);
  color: var(--as-blue);
}
/* WhatsApp kartı marka yeşiliyle ayrışır (footer/FAB ile aynı ton). */
.asc-app[data-page="contact"] .as-cnt-ch__link--whatsapp .as-cnt-ch__ico {
  background: rgba(15, 123, 60, .10);
  color: var(--as-wa);
}

.asc-app[data-page="contact"] .as-cnt-ch__kicker {
  grid-area: kicker;
  font-size: 12px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase;
  color: var(--as-muted);
}
.asc-app[data-page="contact"] .as-cnt-ch__value {
  grid-area: value;
  margin-top: 3px;
  font-size: 17px; font-weight: 800; letter-spacing: -.01em; line-height: 1.3;
  color: var(--as-navy);
  overflow-wrap: anywhere;          /* uzun e-posta kartı taşırmasın */
}
.asc-app[data-page="contact"] .as-cnt-ch__note {
  grid-area: note;
  margin-top: 5px;
  font-size: 13.5px; line-height: 1.5;
  color: var(--as-ink-3, #475569);
}
.asc-app[data-page="contact"] .as-cnt-ch__go {
  grid-area: go;
  display: grid; place-items: center;
  width: 32px; height: 32px; flex: none;
  border-radius: var(--as-r-pill);
  background: var(--as-tint-2);
  color: var(--as-blue);
  transition: transform .2s var(--as-ease);
}
.asc-app[data-page="contact"] .as-cnt-ch__link:hover .as-cnt-ch__go { transform: translateX(3px); }

/* Dönüş süresi — Hakkımızda'da verilen sözün tekrarı, yeni taahhüt DEĞİL. */
.asc-app[data-page="contact"] .as-cnt-promise {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  margin: 20px 0 0;
  padding: 14px 18px;
  border: 1px solid var(--as-line-soft, #F1F5FB);
  border-radius: 14px;
  background: var(--as-tint-2);
  font-size: 14.5px; line-height: 1.55;
  color: var(--as-ink-2, #334155);
}
.asc-app[data-page="contact"] .as-cnt-promise__dot {
  flex: none;
  width: 8px; height: 8px;
  margin-top: 7px;
  border-radius: var(--as-r-pill);
  background: var(--as-wa);
}

/* Adres kartı (yan kolon) — yalnızca adres girildiğinde basılır. */
.asc-app[data-page="contact"] .as-cnt-side__addr {
  margin: 12px 0 0;
  font-size: 15px; line-height: 1.6;
  color: var(--as-ink-2, #334155);
}
.asc-app[data-page="contact"] .as-cnt-side__dir {
  display: inline-flex; align-items: center; gap: 7px;
  margin-top: 14px;
  font-size: 14px; font-weight: 700;
  color: var(--as-blue);
  text-decoration: none;
}
.asc-app[data-page="contact"] .as-cnt-side__dir:hover { color: var(--as-navy-2, #0B2A5B); }

@media (max-width: 759.98px) {
  .asc-app[data-page="contact"] .as-cnt-ch__link { padding: 18px 18px; column-gap: 13px; }
  .asc-app[data-page="contact"] .as-cnt-ch__ico { width: 42px; height: 42px; }
}