/* Teklif çağrısı (#iletisim, .cagri) ve alt bilgi (.alt-bilgi). Yapı tools/yama/iletisim.html ve sayfa-uret.py (iletisim_bolumu, alt_bilgi);
   her sayfada site.css ve katalog.css'ten sonra yüklenir. site.css'teki eski .iletisim kuralları bu bölüme uygulanmaz (sınıf .cagri);
   yalnız .iletisim-not ve .iletisim-eposta adları korunduğu için onların eski kuralları burada .cagri altında ezilir.
   Renkler sitenin kimliği: Turan mavisi zemin, yazılar beyaz (Yusuf, 07.10.2026: mavi zeminde yazı beyaz; 11.10.2026 "çevir"), başlığın ikinci satırı hafif soluk beyaz, örnek kâğıt beyaz zeminde koyu. */

/* ---------- teklif çağrısı: önceki bölümün üstüne kayan mavi kart (köşeler önceki bölümün üstüne biner) ---------- */
.cagri { --kose: clamp(24px, 3vw, 48px); --cagri-yazi: rgba(255, 255, 255, .9); position: relative; z-index: 2; margin-top: calc(-1 * var(--kose));
  padding: calc(clamp(64px, 10vh, 128px) + var(--kose)) 5.5vw clamp(64px, 10vh, 120px); border-radius: var(--kose) var(--kose) 0 0;
  background: var(--turan); color: var(--beyaz); scroll-margin-top: 8vh; overflow: hidden; }
.cagri-ic { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, .6fr); align-items: center; gap: 48px clamp(40px, 6vw, 110px); max-width: 1320px; margin: 0 auto; }
.cagri-metin { min-width: 0; }
.cagri-tek .cagri-ic { grid-template-columns: minmax(0, 1fr); } /* örnek kâğıtsız (Yazılımlar, Teklif) */
.cagri-baslik { margin: 0; font: 800 clamp(36px, 4.6vw, 78px)/1 'Archivo', sans-serif; letter-spacing: -.035em; text-wrap: balance; }
.cagri-baslik span { display: block; color: rgba(255, 255, 255, .78); }
.cagri .iletisim-not { max-width: 46ch; margin: clamp(22px, 3vh, 32px) 0 0; font: 500 clamp(17px, 1.35vw, 21px)/1.5 'Archivo', sans-serif; color: var(--cagri-yazi); opacity: 1; text-wrap: pretty; }

/* eylemler: dolu siyah "Teklif al", yanında altı çizili "Paketleri inceleyin" */
.cagri-eylem { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 28px; margin-top: clamp(28px, 4vh, 40px); }
.cagri-ana, .cagri-ikincil { display: inline-flex; align-items: center; gap: 14px; font: 600 clamp(16px, 1.15vw, 18px)/1.2 'Archivo', sans-serif; text-decoration: none; }
.cagri-ana { padding: 18px 26px 18px 28px; border-radius: 999px; background: var(--siyah); color: var(--beyaz); box-shadow: 0 18px 40px -22px rgba(0, 32, 54, .9);
  transition: background-color .25s, box-shadow .25s; }
.cagri-ana:hover { background: #151B21; box-shadow: 0 22px 46px -20px rgba(0, 32, 54, .95); }
.cagri-ikincil { padding: 12px 2px; color: var(--beyaz); text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 6px; text-decoration-color: rgba(255, 255, 255, .5);
  transition: text-decoration-color .25s; }
.cagri-ikincil:hover { text-decoration-color: currentColor; }
.cagri .ok { width: 18px; height: 11px; flex: none; transition: transform .25s var(--egri); }
.cagri-ana:hover .ok, .cagri-ikincil:hover .ok { transform: translateX(3px); }
.cagri a:focus-visible { outline: 2px solid var(--beyaz); outline-offset: 4px; }

/* "WhatsApp’ta görüşelim" + "Bize mail at" çifti (ortak.py → iletisim_cifti; Emir, 15.10.2026): plan çağrısında "Önce konuşmak mı istersiniz?" satırının altında,
   reklam.html'deki "Hepsini birlikte mi düşünüyorsunuz?" bölümünde sağda. Hap ailesi: WhatsApp beyaz hap (simge #25D366 yeşil), mail ince çizgili hap (zarf simgesi);
   mavi zeminde de koyu zeminde de okunur. Telefonda alt alta ve tam genişlik. Düğme yüksekliği en az 52 px. */
.cagri-gorus { margin-top: clamp(26px, 3.4vh, 38px); }
.cagri-gorus-not { margin: 0 0 12px; color: var(--cagri-yazi); font: 600 clamp(15px, 1.1vw, 17px)/1.4 'Archivo', sans-serif; }
.ic-cift { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.ic-dugme { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 52px; padding: 12px 26px 12px 20px; border-radius: 999px; box-sizing: border-box;
  font: 600 clamp(16px, 1.15vw, 18px)/1.2 'Archivo', sans-serif; text-decoration: none; border: 1.5px solid transparent; transition: background-color .25s, border-color .25s, color .25s, box-shadow .25s; }
.ic-simge { display: block; width: 24px; height: 24px; flex: none; }
.ic-wa { background: #fff; color: #0B1620; box-shadow: 0 16px 34px -22px rgba(0, 20, 36, .8); }
.ic-wa .ic-simge { fill: #25D366; }
.ic-zarf { fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.ic-posta { background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .45); color: #fff; }
.cagri .ic-posta { background: rgba(0, 34, 58, .26); border-color: rgba(255, 255, 255, .6); }
.ic-dugme:focus-visible { outline: 2px solid var(--ic-odak, var(--turan-parlak)); outline-offset: 3px; }
.cagri .ic-dugme:focus-visible { --ic-odak: var(--beyaz); outline-offset: 4px; }
@media (hover: hover) and (pointer: fine) {
  .ic-wa:hover { background: #F1F6F9; box-shadow: 0 20px 38px -20px rgba(0, 20, 36, .9); }
  .ic-posta:hover { background: rgba(255, 255, 255, .14); border-color: #fff; }
  .cagri .ic-posta:hover { background: rgba(0, 34, 58, .42); }
}
@media (forced-colors: active) { .ic-dugme { border-color: ButtonText; } }

/* dürüst not ve (varsa) e-posta */
.cagri-guven { max-width: 62ch; margin: clamp(36px, 5vh, 56px) 0 0; padding-top: 18px; border-top: 1px solid rgba(255, 255, 255, .3); color: var(--cagri-yazi); font-size: 15px; line-height: 1.6; text-wrap: pretty; }
.cagri .iletisim-eposta { display: inline-block; margin: 14px 0 0; color: var(--beyaz); font: 600 clamp(17px, 1.3vw, 20px)/1.3 'Archivo', sans-serif;
  text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 5px; }
.cagri .iletisim-eposta:hover { color: var(--beyaz); }
.cagri .iletisim-eposta[hidden] { display: none; }

/* örnek plan teklifi: teklif sayfasındaki "kâğıt"ın küçüğü; hafif eğik durur, fareyle bölümün üstüne gelince doğrulur */
.cagri-kagit { justify-self: end; width: min(100%, 380px); margin: 0; padding: 22px 24px 20px; border-radius: 12px; background: #FBFCFD; color: var(--siyah);
  box-shadow: 0 44px 70px -34px rgba(0, 34, 58, .75), 0 12px 26px -14px rgba(0, 34, 58, .45); transform: rotate(2.4deg); transition: transform .7s var(--egri);
  font: 400 14px/1.4 'Archivo', sans-serif; }
.cagri:hover .cagri-kagit { transform: rotate(.8deg) translateY(-4px); }
:where(.cagri-kagit) p { margin: 0; }
.ck-ust { display: flex; justify-content: space-between; align-items: baseline; color: #6B7882; }
.ck-ust b { color: var(--siyah); font-weight: 750; font-size: 13px; letter-spacing: .02em; }
.ck-ust em { font: italic 400 17px/1 'Instrument Serif', Georgia, serif; }
.ck-baslik { margin-top: 18px; font-weight: 700; font-size: 22px; letter-spacing: -.025em; }
.ck-baslik::after { content: ''; display: inline-block; width: .26em; height: .26em; margin-left: .08em; border-radius: 50%; background: var(--turan); }
.ck-paket { display: flex; justify-content: space-between; gap: 12px; margin-top: 14px; padding: 10px 0; border-block: 1px solid #E2E8EC; color: #5D6A74; }
.ck-paket b { color: var(--siyah); font-weight: 650; }
.ck-satirlar { margin: 0; padding: 0; list-style: none; }
.ck-satirlar li { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 9px 0; border-bottom: 1px solid #EEF2F4; color: #2B353C; }
.ck-satirlar li span:last-child { flex: none; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ck-satirlar i { font-style: normal; color: #00729E; }
.ck-toplam { display: grid; gap: 4px; margin: 14px 0 0; }
.ck-toplam div { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; }
.ck-toplam dt { color: #5D6A74; }
.ck-toplam dd { margin: 0; font-weight: 700; font-size: 18px; letter-spacing: -.02em; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ck-not { margin-top: 14px; color: #6B7882; font-size: 12px; }

/* ---------- alt bilgi: marka, tek cümle, dört bağlantı, telif ---------- */
.alt-bilgi { width: min(1320px, calc(100% - 11vw)); margin: 0 auto; padding: clamp(40px, 6vh, 64px) 0 clamp(28px, 4vh, 40px); color: #8B98A5; font-size: 14px; }
.ab-ust { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; gap: 28px 56px; }
.ab-marka { min-width: 0; }
.ab-logo { display: inline-flex; align-items: baseline; color: #F5F8FA; font: 750 20px/1 'Archivo', sans-serif; letter-spacing: .01em; text-decoration: none; }
.ab-logo i { width: 6px; height: 6px; margin-left: 3px; border-radius: 50%; background: var(--turan); }
.ab-marka p { max-width: 44ch; margin: 12px 0 0; line-height: 1.6; }
.ab-baglar { display: flex; flex-wrap: wrap; gap: 10px 28px; padding-top: 2px; }
.ab-baglar a { color: #E8EDF1; text-decoration: none; font-weight: 500; transition: color .2s; }
.ab-baglar a:hover { color: var(--turan-parlak); }
.ab-baglar a[aria-current="page"] { color: #8B98A5; }
.ab-baglar .ab-teklif { color: var(--turan-parlak); }
.ab-baglar .ab-teklif:hover { color: #7FD3FF; }
.ab-telif { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 24px; margin: clamp(28px, 4vh, 40px) 0 0; padding-top: 18px; border-top: 1px solid #1A232B; color: #66737F; font-size: 12.5px; }
.ab-telif a { color: #7E8B96; text-decoration: underline; text-decoration-color: rgba(126, 139, 150, .4); text-underline-offset: 3px; transition: color .2s; }
.ab-telif a:hover { color: var(--turan-parlak); text-decoration-color: currentColor; }
.ab-telif a[aria-current="page"] { color: #66737F; text-decoration: none; }
.alt-bilgi a:focus-visible { outline: 2px solid var(--turan); outline-offset: 4px; border-radius: 2px; }

/* ---------- dar ekranlar ---------- */
@media (max-width: 900px) {
  .cagri-ic { grid-template-columns: minmax(0, 1fr); }
  .cagri-kagit { justify-self: start; transform: rotate(-1.2deg); }
  .cagri:hover .cagri-kagit { transform: rotate(-1.2deg); }
}
@media (max-width: 560px) {
  .cagri { padding-inline: 18px; }
  .cagri-eylem { flex-direction: column; align-items: stretch; gap: 6px; }
  .ic-cift { flex-direction: column; align-items: stretch; }
  .ic-dugme { width: 100%; }
  .cagri-ana { justify-content: space-between; }
  .cagri-ikincil { justify-content: space-between; padding-inline: 4px; }
  .cagri-guven { font-size: 14px; }
  .cagri-kagit { width: min(100%, 330px); padding: 18px 20px 16px; font-size: 13px; transform: rotate(-1deg); }
  .cagri:hover .cagri-kagit { transform: rotate(-1deg); }
  .ck-baslik { font-size: 19px; } .ck-satirlar li { padding: 7px 0; } .ck-toplam dd { font-size: 16px; }
  .alt-bilgi { width: calc(100% - 36px); }
  .ab-baglar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 20px; width: 100%; }
}
@media (prefers-reduced-motion: reduce) { .cagri-kagit, .cagri:hover .cagri-kagit { transition: none; } }
@media (forced-colors: active) { .cagri-ana { border: 1px solid; } }