/* ILETISIM FORMU — sol: yorungede kisiler, sag: iletisim formu (logo seridi 12 Eki'de kaldirildi).
   Okan, 12 Eki 2026: "bir tane boyle form kurar misin" (Untitled UI iletisim
   sayfasi referansi). Referansin paleti kopyalanmadi, sitenin jetonlarina
   eslendi: limon panel -> --lavender (#e1ecff), mor/siyah dugme -> marka mavi
   gradyani, gri sol panel -> --surface, yorunge cizgileri -> --electric-iris
   seffaf. Yuzler persona kutuphanesinden, her kimlikten bir kisi.
   Butun kurallar :where([data-bilesen="iletisim-formu"]) altinda: sayfaya sizmaz. */

@property --ilf-sal{syntax:'<angle>';inherits:false;initial-value:0deg}

:where([data-bilesen="iletisim-formu"]){
  --ilf-zemin:var(--lavender,#e1ecff);
  --ilf-panel:var(--surface,#f4f4f5);
  --ilf-murekkep:var(--ink,#141414);
  --ilf-soluk:#4a5163;                 /* lavanta ustunde 7,4:1 */
  --ilf-cizgi:rgba(0,54,255,.16);
  --ilf-adim:clamp(36px,3.4vw,48px);   /* halkalar arasi: kume ~660px'lik panelde marka ile sosyal hesaplarin arasina sigar */
  display:block;
  width:min(1200px,calc(100% - 48px));
  margin:clamp(56px,7vw,104px) auto;
  font-family:var(--font-ui);
  color:var(--ilf-murekkep);
  box-sizing:border-box;
}
:where([data-bilesen="iletisim-formu"]) *{box-sizing:border-box}

:where([data-bilesen="iletisim-formu"]) .iletisim-formu__kart{
  display:grid;grid-template-columns:minmax(0,.43fr) minmax(0,1fr);gap:12px;
  padding:12px;border-radius:var(--r-block,32px);background:#fff;
  box-shadow:var(--shadow-xl);
}

/* ---- SOL: marka, yorunge, sosyal ---- */
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__sol{
  position:relative;overflow:hidden;isolation:isolate;
  display:flex;flex-direction:column;justify-content:space-between;
  min-height:560px;padding:28px;border-radius:var(--r-hero,24px);background:var(--ilf-panel);
}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__marka{
  position:relative;z-index:2;display:inline-flex;align-items:center;gap:10px;align-self:flex-start;
  color:var(--ilf-murekkep);text-decoration:none;font:700 22px/1 var(--font-display);letter-spacing:-.03em;
}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__marka img{width:30px;height:30px;border-radius:8px}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__marka:focus-visible,
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__sosyal a:focus-visible{outline:3px solid rgba(71,155,255,.45);outline-offset:4px;border-radius:8px}

:where([data-bilesen="iletisim-formu"]) .iletisim-formu__yorunge{position:absolute;inset:0;z-index:0;pointer-events:none}
/* halkalarin merkezi panelin SAG kenarinda, ortanin biraz ustunde; kisiler
   markanin altinda ve sosyal hesaplarin ustunde kalacak acilarda (ust ust binmez) */
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__halka,
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__parilti,
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__kisiler li{position:absolute;left:100%;top:46%}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__halka{
  --cap:calc(2 * (28px + var(--r) * var(--ilf-adim)));
  width:var(--cap);height:var(--cap);margin:calc(var(--cap) / -2) 0 0 calc(var(--cap) / -2);
  border-radius:50%;border:1px solid var(--ilf-cizgi);
}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__parilti{
  width:300px;height:300px;margin:-150px 0 0 -150px;border-radius:50%;
  background:radial-gradient(closest-side,rgba(0,147,255,.32),rgba(0,54,255,.10) 55%,transparent);
  filter:blur(8px);
}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__kisiler{margin:0;padding:0;list-style:none}
/* kisi: kendi halkasinda --a acisinda durur, yavasca ileri geri salinir */
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__kisiler li{
  --aci:calc(180deg + var(--a) + var(--ilf-sal));
  width:var(--b);height:var(--b);margin:calc(var(--b) / -2) 0 0 calc(var(--b) / -2);
  transform:rotate(var(--aci)) translateX(calc(28px + var(--r) * var(--ilf-adim))) rotate(calc(-1 * var(--aci)));
  animation:ilf-salin var(--s) ease-in-out infinite alternate;
  animation-play-state:paused;
}
:where([data-bilesen="iletisim-formu"])[data-ilf-oynat] .iletisim-formu__kisiler li{animation-play-state:running}
/* aci (--a) burada, kalipta degil: dar ekranda ayni kisiler baska acilara gecer */
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__kisiler li:nth-child(1){--a:-50deg}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__kisiler li:nth-child(2){--a:-42deg}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__kisiler li:nth-child(3){--a:-40deg}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__kisiler li:nth-child(4){--a:-6deg}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__kisiler li:nth-child(5){--a:32deg}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__kisiler li:nth-child(6){--a:34deg}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__kisiler li:nth-child(7){--a:16deg}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__kisiler li:nth-child(8){--a:-64deg}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__kisiler img{
  display:block;width:100%;height:100%;border-radius:50%;object-fit:cover;
  border:3px solid #fff;box-shadow:0 10px 24px rgba(15,23,42,.16),0 1px 3px rgba(15,23,42,.12);
}
@keyframes ilf-salin{from{--ilf-sal:-5deg}to{--ilf-sal:5deg}}

:where([data-bilesen="iletisim-formu"]) .iletisim-formu__sosyal{
  position:relative;z-index:2;display:grid;grid-template-columns:max-content;gap:12px;margin:0;padding:0;list-style:none;
}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__sosyal a{
  display:inline-flex;align-items:center;gap:10px;color:var(--ilf-murekkep);text-decoration:none;
  font:600 14px/1.2 var(--font-ui);
}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__sosyal svg{flex:none;color:var(--electric-iris,#0036ff)}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__sosyal a:hover span{text-decoration:underline;text-underline-offset:3px}

/* ---- SAG: form ---- */
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__sag{
  display:flex;justify-content:center;align-items:center;
  padding:clamp(32px,3.4vw,48px) clamp(24px,4vw,56px);border-radius:var(--r-hero,24px);background:var(--ilf-zemin);
}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__ic{width:100%;max-width:740px}
/* GUVENLI FORM etiketi (Okan, 12 Eki; eski proje formunda da vardi): masaustunde
   sag panelin sag ust kosesinde, telefonda basligin ustunde akis icinde. */
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__sag{position:relative}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__guvenli{
  position:absolute;top:16px;right:16px;display:inline-flex;align-items:center;gap:6px;
  padding:6px 11px 6px 9px;border:1px solid rgba(0,54,255,.16);border-radius:999px;
  background:rgba(255,255,255,.62);color:var(--electric-iris,#0036ff);
  font:600 11.5px/1 var(--font-ui);letter-spacing:.01em;white-space:nowrap;
  box-shadow:inset 0 1px rgba(255,255,255,.7);
}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__guvenli svg{flex:none}
/* sag ust kosede yalniz yeterli yer varken (olculdu: 901 ve 561px'te basliga degiyordu) */
@media (max-width:1023px){
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__guvenli{position:static;margin-bottom:14px}
}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__baslik{
  margin:0;font-family:var(--font-display);font-weight:600;
  font-size:clamp(calc(28px * var(--olcek-yazi,1)),2.5vw,calc(38px * var(--olcek-yazi,1)));
  line-height:1.05;letter-spacing:-.035em;color:var(--ilf-murekkep);
}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__alt{margin:8px 0 0;font-size:clamp(15px,1.1vw,17px);line-height:1.45;color:var(--ilf-soluk)}

:where([data-bilesen="iletisim-formu"]) .iletisim-formu__form{display:grid;gap:12px;margin-top:clamp(20px,2vw,26px)}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__satir{display:grid;grid-template-columns:1fr 1fr;gap:12px 16px}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__alan{display:grid;gap:5px;min-width:0;align-content:start}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__alan>span:first-child{font-size:11.5px;font-weight:600;line-height:1.2;color:var(--ilf-murekkep)}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__alan>span:first-child b{color:var(--electric-iris,#0036ff);font-weight:600}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__telefon{
  /* TEK KUTU (Okan: "+90 ayri kutuda olmaz"): bayrak + ok | ayrac | +90 numara */
  display:flex;align-items:center;min-height:40px;border:1px solid rgba(20,20,20,.10);border-radius:10px;background:#fff;
  box-shadow:0 1px 2px rgba(16,24,40,.05);transition:border-color .16s ease,box-shadow .16s ease;
}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__telefon:focus-within{border-color:var(--electric-iris,#0036ff);box-shadow:0 0 0 4px rgba(0,54,255,.14)}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__ulke{
  position:relative;flex:none;display:inline-flex;align-items:center;gap:6px;align-self:stretch;
  padding:0 12px 0 14px;border-right:1px solid rgba(20,20,20,.10);color:#6b7280;
}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__ulke .iletisim-formu__bayrak{font-style:normal;font-size:20px;line-height:1}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__ulke select{
  position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;border:0;font-size:16px;
}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__kod{flex:none;padding-left:12px;font-size:16px;line-height:1.4;color:var(--ilf-murekkep)}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__alan .iletisim-formu__telefon input{
  flex:1;min-width:0;min-height:38px;padding:8px 14px 8px 6px;border:0;border-radius:0 10px 10px 0;box-shadow:none;background:transparent;
}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__alan .iletisim-formu__telefon input:focus{box-shadow:none}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__onaylar{display:grid;gap:8px}
/* onaylar solda, dugme sagda — eski proje formundaki gibi tek satir */
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__son{display:flex;align-items:center;justify-content:space-between;gap:16px 24px;flex-wrap:wrap;margin-top:2px}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__alan :is(input,select,textarea){
  width:100%;min-height:40px;margin:0;padding:8px 14px;   /* 44 -> 40 (Okan, 13 Eki: "cok az sikistiralim") */
  border:1px solid rgba(20,20,20,.10);border-radius:10px;background:#fff;color:var(--ilf-murekkep);
  font:400 16px/1.4 var(--font-ui);box-shadow:0 1px 2px rgba(16,24,40,.05);
  transition:border-color .16s ease,box-shadow .16s ease;
}
/* FORM KISALDI (Okan, 13 Eki: "bu form cok uzun, projenizi anlatin ile pozisyonu cikaralim"):
   iki alan tum formlardan kalkti; ad soyad | sirket, e-posta | telefon, proje turu | butce. */
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__alan :is(input,textarea)::placeholder{color:#6b7280;opacity:1}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__alan :is(input,select,textarea):focus{
  outline:none;border-color:var(--electric-iris,#0036ff);box-shadow:0 0 0 4px rgba(0,54,255,.14);
}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__alan [aria-invalid="true"]{border-color:#c4321c;box-shadow:0 0 0 4px rgba(196,50,28,.12)}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__secim{position:relative;display:block}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__secim select{appearance:none;padding-right:44px;font-weight:500;cursor:pointer}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__secim select:invalid{color:#6b7280;font-weight:400}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__secim select option{color:var(--ilf-murekkep)}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__secim::after{
  content:"";position:absolute;right:18px;top:50%;width:8px;height:8px;margin-top:-6px;
  border-right:1.7px solid currentColor;border-bottom:1.7px solid currentColor;transform:rotate(45deg);pointer-events:none;
}

:where([data-bilesen="iletisim-formu"]) .iletisim-formu__onay{display:flex;align-items:flex-start;gap:10px;font-size:14px;line-height:1.45;color:var(--ilf-soluk);cursor:pointer}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__onay input{
  appearance:none;flex:none;width:20px;height:20px;margin:1px 0 0;border:1px solid rgba(20,20,20,.22);border-radius:6px;background:#fff;cursor:pointer;
  display:grid;place-content:center;transition:background .16s ease,border-color .16s ease;
}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__onay input::after{content:"";width:10px;height:6px;margin-top:-2px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg) scale(0);transition:transform .14s ease}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__onay input:checked{background:var(--electric-iris,#0036ff);border-color:var(--electric-iris,#0036ff)}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__onay input:checked::after{transform:rotate(-45deg) scale(1)}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__onay input:focus-visible{outline:3px solid rgba(71,155,255,.45);outline-offset:2px}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__onay input[aria-invalid="true"]{border-color:#c4321c}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__onay a{color:var(--ilf-murekkep);text-decoration:underline;text-underline-offset:3px}

/* Gönder düğmesi = buton kütüphanesindeki "Formu gönder" (.btn-gonder, sayfa-stilleri.css; Okan 21 Eki). Burada yalnız
   yerleşim; renk, ölçü ve uçan uçak hareketi kütüphaneden. */
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__gonder{flex:none}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__gonder:focus-visible{outline:3px solid rgba(71,155,255,.5);outline-offset:3px}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__durum{margin:-4px 0 0;min-height:1.4em;font-size:14px;font-weight:600;color:#14532d}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__durum[data-hata]{color:#9f2a17}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__durum:empty{display:none}


/* KENDI ACILIR LISTEMIZ (Okan, 12 Eki: tarayicinin listesi mobil onizlemede
   kutudan uzakta aciliyordu). Gercek <select> formda kalir (deger, zorunluluk),
   gorunmez olur; ustune ayni gorunumde bir dugme, altina liste gelir. */
:where([data-bilesen="iletisim-formu"]) [data-ilf-gizli]{position:absolute!important;inset:0;opacity:0;pointer-events:none}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__secim-dugme{
  display:flex;align-items:center;width:100%;height:40px;margin:0;padding:8px 44px 8px 14px;
  border:1px solid rgba(20,20,20,.10);border-radius:10px;background:#fff;color:var(--ilf-murekkep);
  font:500 16px/1.4 var(--font-ui);text-align:left;cursor:pointer;box-shadow:0 1px 2px rgba(16,24,40,.05);
  transition:border-color .16s ease,box-shadow .16s ease;
}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__secim-dugme>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__secim-dugme[data-bos]{color:#6b7280;font-weight:400}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__secim-dugme:focus-visible,
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__secim-dugme[aria-expanded="true"]{outline:none;border-color:var(--electric-iris,#0036ff);box-shadow:0 0 0 4px rgba(0,54,255,.14)}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__secim-dugme[aria-invalid="true"]{border-color:#c4321c;box-shadow:0 0 0 4px rgba(196,50,28,.12)}
/* ulke: dugme bayrak alaninin ustunde seffaf */
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__ulke .iletisim-formu__secim-dugme{position:absolute;inset:0;height:auto;padding:0;border:0;border-radius:10px 0 0 10px;background:transparent;box-shadow:none;color:transparent}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__ulke .iletisim-formu__secim-dugme:focus-visible,
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__ulke .iletisim-formu__secim-dugme[aria-expanded="true"]{box-shadow:inset 0 0 0 2px var(--electric-iris,#0036ff)}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__liste{
  position:absolute;z-index:30;left:0;top:calc(100% + 6px);min-width:100%;max-height:288px;overflow:auto;
  margin:0;padding:6px;list-style:none;border-radius:12px;background:#fff;
  box-shadow:0 18px 40px rgba(5,6,27,.16),0 0 0 1px rgba(20,20,20,.08);
  overscroll-behavior:contain;
}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__liste[hidden]{display:none}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__liste--yukari{top:auto;bottom:calc(100% + 6px)}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__ulke .iletisim-formu__liste{min-width:250px}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__liste:focus{outline:none}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__liste li{
  display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:8px;
  font:400 15px/1.3 var(--font-ui);color:var(--ilf-murekkep);cursor:pointer;white-space:nowrap;
}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__liste li[data-aktif]{background:#eef3fe}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__liste li[aria-selected="true"]{font-weight:600;color:var(--electric-iris,#0036ff)}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__liste li[aria-selected="true"]::after{content:"";margin-left:auto;width:10px;height:6px;border-left:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg) translateY(-2px)}

/* KUTU ICI YAZI 16 -> 14 px (Okan, 12 Eki: "buradaki yazilar da 2 punto kuculsun").
   YALNIZ fare kullanilan ekranlarda: iPhone/iPad 16 px'ten kucuk yazili kutuya
   dokununca sayfayi kendiliginden yakinlastirir; dokunmatikte 16 px kalir. */
@media (hover:hover) and (pointer:fine){
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__alan :is(input,textarea),
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__secim-dugme,
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__kod{font-size:14px}
}

/* ---- TESEKKUR BILETI (basarili gonderimde) ----
   Okan, 12 Eki: bilet referansi + "konfeti patlasin animasyonlu". Delikler ve
   alt tirtik MASKE ile acilir (arkadaki ne olursa olsun gercek bosluk). */
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__tesekkur{
  width:min(400px,calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 24px);
  margin:auto;padding:0;border:0;background:transparent;overflow:visible;color:var(--ilf-murekkep);
}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__tesekkur::backdrop{background:rgba(5,6,27,.46);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
/* animasyon BILETTE, pencerede degil: pencere donusturulurse konfeti tuvali (fixed) ekrana degil pencereye baglanir ve patlama kayar */
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__tesekkur[open] .iletisim-formu__bilet{animation:ilf-bilet-gel .55s cubic-bezier(.2,.9,.25,1.15) both}
@keyframes ilf-bilet-gel{from{opacity:0;transform:translateY(28px) scale(.94)}to{opacity:1;transform:none}}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__konfeti{position:fixed;inset:0;width:100vw;height:100vh;pointer-events:none;z-index:2}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__bilet{position:relative;z-index:1;filter:drop-shadow(0 24px 48px rgba(5,6,27,.28)) drop-shadow(0 2px 6px rgba(5,6,27,.10))}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__bilet-ust,
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__bilet-alt{background:#fff;--delik:13px}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__bilet-ust{
  padding:34px 32px 26px;border-radius:22px 22px 0 0;text-align:center;
  -webkit-mask:radial-gradient(circle at 0 100%,#0000 var(--delik),#000 calc(var(--delik) + .5px)),radial-gradient(circle at 100% 100%,#0000 var(--delik),#000 calc(var(--delik) + .5px));
  -webkit-mask-composite:source-in;mask:radial-gradient(circle at 0 100%,#0000 var(--delik),#000 calc(var(--delik) + .5px)) intersect,radial-gradient(circle at 100% 100%,#0000 var(--delik),#000 calc(var(--delik) + .5px));
}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__bilet-alt{
  position:relative;padding:26px 30px 40px;
  /* ust kosede iki delik + altta tirtikli kenar */
  -webkit-mask:radial-gradient(circle at 0 0,#0000 var(--delik),#000 calc(var(--delik) + .5px)),radial-gradient(circle at 100% 0,#0000 var(--delik),#000 calc(var(--delik) + .5px)),radial-gradient(circle 13px at 50% 100%,#0000 12.5px,#000 13px) 50% 100%/34px 100% repeat-x;
  -webkit-mask-composite:source-in,source-in;
  mask:radial-gradient(circle at 0 0,#0000 var(--delik),#000 calc(var(--delik) + .5px)) intersect,radial-gradient(circle at 100% 0,#0000 var(--delik),#000 calc(var(--delik) + .5px)) intersect,radial-gradient(circle 13px at 50% 100%,#0000 12.5px,#000 13px) 50% 100%/34px 100% repeat-x;
}
/* delikler arasi kesikli cizgi */
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__bilet-alt::before{
  content:"";position:absolute;left:26px;right:26px;top:0;border-top:2px dashed rgba(20,20,20,.16);
}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__kapat{
  position:absolute;z-index:3;top:12px;right:12px;display:grid;place-items:center;width:36px;height:36px;
  border:0;border-radius:50%;background:var(--surface,#f4f4f5);color:var(--ilf-soluk);cursor:pointer;
}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__kapat:hover{color:var(--ilf-murekkep)}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__kapat:focus-visible{outline:3px solid rgba(71,155,255,.5);outline-offset:2px}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__patlama{display:inline-block;font-size:56px;line-height:1;transform-origin:30% 80%}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__tesekkur[open] .iletisim-formu__patlama{animation:ilf-patla .7s cubic-bezier(.3,1.6,.5,1) .15s both}
@keyframes ilf-patla{0%{transform:scale(.3) rotate(-30deg);opacity:0}60%{transform:scale(1.18) rotate(8deg);opacity:1}100%{transform:scale(1) rotate(0)}}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__bilet-baslik{margin:14px 0 0;font:700 28px/1.1 var(--font-display);letter-spacing:-.03em}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__bilet-metin{margin:10px auto 0;max-width:30ch;font-size:15px;line-height:1.5;color:var(--ilf-soluk)}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__bilgiler{display:grid;grid-template-columns:1fr auto;gap:18px 16px;margin:0}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__bilgiler div{min-width:0}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__bilgi--sag{text-align:right}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__bilgi--tam{grid-column:1/-1}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__bilgiler dt{font-size:12px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--ilf-soluk)}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__bilgiler dd{margin:5px 0 0;font-size:16px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--ilf-murekkep);overflow-wrap:anywhere}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__kisi{display:flex;align-items:center;gap:14px;margin-top:20px;padding:14px 16px;border-radius:14px;background:#f3f6fd}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__bas-harf{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--softvisor-blue-gradient);color:#fff;font:700 15px/1 var(--font-ui);letter-spacing:.02em}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__kisi>span:last-child{display:grid;gap:2px;min-width:0}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__kisi strong{font-size:15px;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__kisi small{font-size:13px;line-height:1.3;color:var(--ilf-soluk);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__barkod{
  position:relative;display:grid;justify-items:center;gap:6px;margin-top:24px;padding-top:22px;
}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__barkod::before{content:"";position:absolute;left:-4px;right:-4px;top:0;border-top:2px dashed rgba(20,20,20,.10)}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__barkod svg{display:block;width:100%;max-width:260px;height:64px;color:#111}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__barkod span{font:500 13px/1 var(--font-ui);letter-spacing:.32em;font-variant-numeric:tabular-nums;color:var(--ilf-murekkep)}
@media (max-width:560px){
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__bilet-ust{padding:30px 22px 22px}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__bilet-alt{padding:22px 22px 36px}
}

/* RENK: lavanta (Okan, 12 Eki: "renk su olacak"). Denenen yumusak / koyu / mavi
   secenekleri kaldirildi — git gecmisinde: e01d48c. */

/* ==== ZEMIN (Okan, 12 Eki: "formun arkasina bir background at"; sonra
   "backroundlari sticky gorelim yani tam genislik"; secim: "bu uygundur, bunu
   seciyorum" -> PASTEL %60, kalibin varsayilani). Denenen diger zeminler
   kaldirildi (gecmis: 957c1f2) — data-ilf-zemin.
   TAM GENISLIK bant; zemin SABIT: sayfa kayarken form zeminin ustunden gecer.
   Yontem: bolum clip-path ile kendi alanini keser, zemin ::before'da
   position:fixed (background-attachment:fixed iPhone'da calismiyor; bu calisir).
   Bilet penceresi ust katmanda oldugu icin kesilmez. ==== */
:where([data-bilesen="iletisim-formu"][data-ilf-zemin]){
  position:relative;isolation:isolate;clip-path:inset(0);
  width:100%;margin:clamp(56px,7vw,104px) 0;padding:clamp(28px,3.4vw,48px) 24px;   /* Okan, 12 Eki: 'yukseklik olarak daralt' — ESKI: clamp(56px,8vw,120px) */
}
:where([data-bilesen="iletisim-formu"][data-ilf-zemin]) .iletisim-formu__kart{max-width:1200px;margin:0 auto}
:where([data-bilesen="iletisim-formu"][data-ilf-zemin])::before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
}
/* pastel: bg/z-pastel.css soketinin gradyani. Opaklik %60 (Okan, 12 Eki:
   "saydamligini %20 dusur" -> %80, sonra "%20 daha dusur" -> %60) — arkadaki
   beyaz sayfa gecer, zemin solar. */
:where([data-bilesen="iletisim-formu"][data-ilf-zemin="pastel"])::before{
  opacity:.6;
  background-color:#f0e3f4;
  background-image:linear-gradient(135deg in oklab,#f0e3f4 0%,#f9eae4 18%,#f5f6dc 32%,#e5fbeb 46%,#defafc 60%,#e7f3ff 74%,#f7e9f3 88%,#fbf4f9 100%);
}
/* ---- TABLET / TELEFON ---- */
@media (max-width:900px){
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__kart{grid-template-columns:1fr}
  /* yorunge MARKANIN ALTINDA kendi bandinda (260px), sosyal hesaplar onun ALTINDA:
     hicbiri ust uste binmez. Bant dar oldugu icin kisiler yataya yayilir (acilar
     masaustunden kucuk: en uzak kisi merkezden ~107px). */
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__sol{min-height:0;--ilf-adim:40px}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__yorunge{inset:74px 0 auto 0;height:260px;overflow:hidden}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__halka,
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__parilti,
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__kisiler li{left:100%;top:50%}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__kisiler li:nth-child(1){--a:-28deg}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__kisiler li:nth-child(2){--a:-14deg}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__kisiler li:nth-child(3){--a:-40deg}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__kisiler li:nth-child(4){--a:-2deg}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__kisiler li:nth-child(5){--a:36deg}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__kisiler li:nth-child(6){--a:18deg}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__kisiler li:nth-child(7){--a:30deg}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__kisiler li:nth-child(8){--a:-38deg}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__sosyal{margin-top:292px;grid-template-columns:repeat(3,max-content);gap:12px 28px}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__ic{max-width:none}
}
@media (max-width:560px){
  :where([data-bilesen="iletisim-formu"]){width:calc(100% - 40px)}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__kart{padding:8px;border-radius:var(--r-hero,24px)}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__sol{padding:22px;border-radius:18px}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__yorunge{inset:68px 0 auto 0}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__sosyal{margin-top:286px}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__kisiler li{width:calc(var(--b) * .78);height:calc(var(--b) * .78);margin:calc(var(--b) * -.39) 0 0 calc(var(--b) * -.39)}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__sosyal{grid-template-columns:1fr;gap:12px}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__sosyal a{font-size:14px}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__sag{padding:32px 20px;border-radius:18px}
  /* IKILI SUTUN (Okan, 12 Eki: "mobilde tum satirlar 2 sutun, projenizi anlatin
     haric"). Satir kutulari cozulur, alanlar tek 2'li izgaraya dizilir. Telefon
     tam satir: yarim genislikte (~165px) bayrak + "+90" + 13 haneli numara sigmiyor. */
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__form{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:10px;align-items:end}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__satir{display:contents}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__form>:not(.iletisim-formu__satir),
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__alan[role="group"],
  :where([data-bilesen="iletisim-formu"]) [data-ilf-eposta]{grid-column:1/-1}   /* pozisyon kalkinca e-posta yalniz kaliyordu (13 Eki) */
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__alan>span:first-child{font-size:11.5px}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__alan :is(input,textarea){padding-left:12px;text-overflow:ellipsis}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__secim-dugme{padding-left:12px;padding-right:36px}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__secim::after{right:14px}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__gonder{width:100%}
}

/* zeminli bant telefonda da TAM genislik (yukaridaki telefon kuralindaki
   "100% - 40px"i ezer; o yuzden dosyanin sonunda) */
@media (max-width:560px){
  :where([data-bilesen="iletisim-formu"][data-ilf-zemin]){width:100%;padding:24px 12px}
}

/* ==== TEKLIF PENCERESI (Okan, 12 Eki: "tum teklif al butonlarinda bu form pop
   up acilacak; tusa basinca hafif animasyonlu acilsin, arkasini liquid glass blur
   atsin"). Pencere betikle kurulur (dialog[data-ilf-acilir]); icindeki form
   sayfadaki formun temiz kopyasi. ==== */
:where([data-bilesen="iletisim-formu"][data-ilf-acilir]){
  width:min(1200px,calc(100vw - 48px));max-width:none;max-height:none;margin:auto;padding:0;
  border:0;background:transparent;overflow:visible;
}
:where([data-bilesen="iletisim-formu"][data-ilf-acilir]):not([open]){display:none}   /* bilesenin display:block kurali kapali pencereyi gostermesin */
:where([data-bilesen="iletisim-formu"][data-ilf-acilir]):focus{outline:none}
/* pencere icindeki bolum: sayfa bosluklari yok */
:where([data-bilesen="iletisim-formu"][data-ilf-acilir]) [data-bilesen="iletisim-formu"]{width:100%;margin:0}
:where([data-bilesen="iletisim-formu"][data-ilf-acilir]) .iletisim-formu__kart{box-shadow:0 40px 90px rgba(5,6,27,.28),0 6px 18px rgba(5,6,27,.10)}
/* SIVI CAM perde: guclu bulanik + doygunluk + ust soldan hafif isik */
:where([data-bilesen="iletisim-formu"][data-ilf-acilir])::backdrop{
  background:
    radial-gradient(120% 90% at 15% 0%,rgba(255,255,255,.34),transparent 55%),
    radial-gradient(90% 80% at 100% 100%,rgba(87,181,255,.18),transparent 60%),
    rgba(214,226,250,.30);
  -webkit-backdrop-filter:blur(22px) saturate(175%) brightness(1.03);
  backdrop-filter:blur(22px) saturate(175%) brightness(1.03);
}
/* acilis: perde yavasca belirir, kart hafif asagidan ve kucukten gelir */
:where([data-bilesen="iletisim-formu"][data-ilf-acilir])[open]::backdrop{animation:ilf-cam .45s ease both}
:where([data-bilesen="iletisim-formu"][data-ilf-acilir])[open]>*{animation:ilf-acil .55s cubic-bezier(.2,.9,.25,1.08) both}
:where([data-bilesen="iletisim-formu"][data-ilf-acilir])[open]>.iletisim-formu__acilir-kapat{animation-delay:.12s}
/* kapanis: tersi, daha kisa */
:where([data-bilesen="iletisim-formu"][data-ilf-acilir])[data-kapaniyor]::backdrop{animation:ilf-cam-git .24s ease both}
:where([data-bilesen="iletisim-formu"][data-ilf-acilir])[data-kapaniyor]>*{animation:ilf-kapan .24s ease both}
@keyframes ilf-cam{from{opacity:0}to{opacity:1}}
@keyframes ilf-cam-git{from{opacity:1}to{opacity:0}}
@keyframes ilf-acil{from{opacity:0;transform:translateY(22px) scale(.965)}to{opacity:1;transform:none}}
@keyframes ilf-kapan{from{opacity:1;transform:none}to{opacity:0;transform:translateY(12px) scale(.98)}}
/* kapat: kartin sag ust kosesinde, kartin disina tasan cam dugme */
:where([data-bilesen="iletisim-formu"][data-ilf-acilir]) .iletisim-formu__acilir-kapat{
  position:absolute;z-index:5;top:-16px;right:-16px;display:grid;place-items:center;width:42px;height:42px;
  border:1px solid rgba(255,255,255,.7);border-radius:50%;cursor:pointer;color:var(--ilf-murekkep);
  background:rgba(255,255,255,.78);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  box-shadow:0 10px 24px rgba(5,6,27,.18);transition:transform .16s ease,background .16s ease;
}
:where([data-bilesen="iletisim-formu"][data-ilf-acilir]) .iletisim-formu__acilir-kapat:hover{transform:rotate(90deg);background:#fff}
:where([data-bilesen="iletisim-formu"][data-ilf-acilir]) .iletisim-formu__acilir-kapat:focus-visible{outline:3px solid rgba(71,155,255,.5);outline-offset:2px}
/* kisa ekran (dizustu, yatay tablet) ve telefon: pencere BUTUN EKRANI kaplayan
   kaydirma alani olur; kart icinde ortalanir. (Pencere kart boyunda kalip kendi
   icinde kayinca kartin golgesi pencere kenarinda duz bir cizgiyle kesiliyordu.) */
@media (max-height:760px),(max-width:900px){
  :where([data-bilesen="iletisim-formu"][data-ilf-acilir])[open]{
    display:grid;place-items:center;width:100vw;height:100dvh;max-height:none;margin:0;
    padding:32px 24px;overflow:auto;overscroll-behavior:contain;
  }
  :where([data-bilesen="iletisim-formu"][data-ilf-acilir]) [data-bilesen="iletisim-formu"]{width:min(1200px,100%)}
  :where([data-bilesen="iletisim-formu"][data-ilf-acilir]) .iletisim-formu__acilir-kapat{position:fixed;top:14px;right:14px}
}
@media (max-width:560px){
  :where([data-bilesen="iletisim-formu"][data-ilf-acilir])[open]{padding:12px 8px 24px;place-items:start center}
}

/* KISA VARYASYON (Okan, 13 Eki): proje turu, butce ve "Projenizi anlatin" yok. Betik bu alanlari
   cikarir; betik calismadan once de gorunmesinler. Cagri: bolumler.ORNEK_AYAR ile
   data-ilf-varyant="kisa". */
:where([data-bilesen="iletisim-formu"][data-ilf-varyant="kisa"]) [data-ilf-uzun]{display:none}
/* Kisa varyasyonda IKI SUTUN (Okan, 13 Eki: once "alt alta olsun", sonra "vazgectim, 2 sutun
   olsun"): ad soyad | sirket, pozisyon | e-posta; telefon tam satir (yarim genislikte bayrak
   + "+90" + numara sigmiyor). Telefondaki 2'li duzenin aynisi, masaustunde de. */
:where([data-bilesen="iletisim-formu"][data-ilf-varyant="kisa"]) .iletisim-formu__form{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:16px;align-items:end}
:where([data-bilesen="iletisim-formu"][data-ilf-varyant="kisa"]) .iletisim-formu__satir{display:contents}
:where([data-bilesen="iletisim-formu"][data-ilf-varyant="kisa"]) .iletisim-formu__form>:not(.iletisim-formu__satir),
:where([data-bilesen="iletisim-formu"][data-ilf-varyant="kisa"]) .iletisim-formu__alan[role="group"]{grid-column:1/-1}

/* DOLMADAN SOLUK (Okan, 13 Eki: "tum formlarda bir kural: tum alanlari doldurmadan ve kutulari
   isaretlemeden form soluk, her yer doldugunda renkliye donsun"). Betik zorunlu alanlarin hepsi
   gecerli olunca koke data-ilf-hazir koyar; o ana kadar Formu Gonder soluk ve golgesiz.
   Tiklanabilir kalir: basinca eksik alanlar isaretlenir. Duyuru izni istege bagli (sayilmaz). */
:where([data-bilesen="iletisim-formu"]:not([data-ilf-hazir]):not([data-ilf-acilir])) .iletisim-formu__gonder{
  opacity:.45;filter:saturate(.25);box-shadow:none;
}
:where([data-bilesen="iletisim-formu"]:not([data-ilf-hazir]):not([data-ilf-acilir])) .iletisim-formu__gonder:hover{transform:none;box-shadow:none}

/* Robot doğrulaması (Okan, 13 Eki; 23 Eki'den beri Cloudflare Turnstile, kutu 300×65): onayların üstünde tam satır.
   Yer önceden ayrılır — betik gelince form zıplamaz.
   Isaretlenmeden "Formu Gonder" soluk kalir (kural 3.125); gonderilirse kutu kirmizi cerceve. */
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__robot{min-height:66px;display:flex;align-items:center}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__robot>div{border-radius:4px;transition:box-shadow .2s ease}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__robot[data-hata]>div{box-shadow:0 0 0 2px #e5484d}
/* Doğrulama kutusu sabit ~300 px; 360 px altı telefonlarda taşıyordu (21 Eki, Okan: "iPhone'da taşma var, optimize et") —
   kutu satıra sığacak kadar küçülür (sol üstten), ayrılan yer de onunla küçülür. */
@media(max-width:359px){:where([data-bilesen="iletisim-formu"]) .iletisim-formu__robot{min-height:66px}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__robot>div{transform:scale(.86);transform-origin:0 50%}}

/* SECILEN PAKET (Okan, 13 Eki: "form dusecek kisi hangi paketi tikladigini bize soylesin"): paket
   kartindan / tablodan acilan kisa formda basligin altinda kucuk etiket; bilette "Paket" satiri.
   Paket gizli alanla (name="paket") gonderimle gelir. */
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__paket{
  display:inline-flex;align-items:center;gap:6px;margin:12px 0 0;padding:6px 12px;border-radius:999px;
  background:rgba(255,255,255,.72);border:1px solid rgba(36,95,255,.22);
  font:500 13px/1.2 var(--font-ui);color:var(--ilf-murekkep);
}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__paket strong{font-weight:700;color:var(--cv-blue-2,#245FFF)}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__paket[hidden],
:where([data-bilesen="iletisim-formu"]) [data-ilf-paket-satir][hidden]{display:none}

/* kisa varyasyon (masaustu): pozisyon kalkinca e-posta ile telefon yan yana */
@media (min-width:561px){
  :where([data-bilesen="iletisim-formu"][data-ilf-varyant="kisa"]) .iletisim-formu__alan[role="group"]{grid-column:auto}
}

/* Formun gönder düğmesi (kütüphane btn-gonder) — blog sayfaları sayfa-stilleri.css yüklemiyor; düğme bileşenle birlikte gelir (21 Eki) */
.btn-gonder{
  font-family:inherit; font-size:14px; font-weight:500; line-height:1;
  display:flex; align-items:center; justify-content:flex-start;
  box-sizing:border-box; height:48px; padding:0 26px 0 22px; min-width:184px;  /* ölçü = M, 48px sabit */
  border:0; border-radius:999px; cursor:pointer; overflow:hidden;
  color:#FFFFFF; background:var(--mavi-dolgu); box-shadow:var(--mavi-hale);
  transition:transform .2s;
}
.btn-gonder .ucus{ display:block; line-height:0; flex:none }
.btn-gonder svg{ display:block; width:18px; height:18px; fill:currentColor;
  transform-origin:center center; transition:transform .3s ease-in-out }
.btn-gonder .etiket{ display:block; margin-left:.45em; white-space:nowrap;
  transition:transform .3s ease-in-out, opacity .3s ease-in-out }
/* Kilitli menu.css'te genel .etiket (menüdeki mavi blog rozeti) var; butonun yazısına sızmasın (21 Eki) */
.btn-gonder .etiket{ flex:none; margin-top:0; padding:0; border-radius:0; background:none; box-shadow:none;
  color:inherit; font:inherit; letter-spacing:inherit; text-transform:none }
@media (prefers-reduced-motion: no-preference){
  .btn-gonder:hover .ucus{ animation:gonderSalin .6s ease-in-out infinite alternate }
  .btn-gonder:hover svg{ transform:translateX(61px) scale(1.1) }   /* ortala: (184/2) - (22 + 18/2) = 61px */
  .btn-gonder:hover .etiket{ transform:translateX(160px); opacity:0 }
}
.btn-gonder:active{ transform:scale(.95) }
@keyframes gonderSalin{ from{transform:translateY(.12em)} to{transform:translateY(-.12em)} }
/* Okan 23 Eki: üç hesap (LinkedIn, Instagram, WhatsApp) — masaüstünde alt alta, kişi yörüngesinin altında */
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__sosyal{z-index:6}:where([data-bilesen="iletisim-formu"]) .iletisim-formu__sosyal a{padding:4px 10px 4px 6px;margin-left:-6px;border-radius:999px;background:rgba(244,244,246,.92)}

/* Harita varyasyonu (Okan 23 Eki, iletişim sayfası): sol panelin tamamı gerçek harita; kişiler, marka ve sosyal yok
   (sosyal hesaplar iletişim bilgisi bileşenine taşındı). Üstte kendi mavi "Haritalarda Aç" düğmemiz. Pencere kopyasında yok. */
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__harita{display:none}
:where([data-bilesen="iletisim-formu"][data-ilf-harita]:not(dialog *)) :is(.iletisim-formu__yorunge,.iletisim-formu__sosyal,.iletisim-formu__marka){display:none}
:where([data-bilesen="iletisim-formu"][data-ilf-harita]:not(dialog *)) .iletisim-formu__sol{padding:0;background:#e9ebee}
:where([data-bilesen="iletisim-formu"][data-ilf-harita]:not(dialog *)) .iletisim-formu__harita{display:block;position:absolute;inset:0;z-index:2}
:where([data-bilesen="iletisim-formu"][data-ilf-harita]:not(dialog *)) .iletisim-formu__harita{overflow:hidden;border-radius:inherit}:where([data-bilesen="iletisim-formu"][data-ilf-harita]:not(dialog *)) .iletisim-formu__harita iframe{position:absolute;left:0;top:-170px;width:100%;height:calc(100% + 170px);border:0;filter:saturate(1.15) contrast(1.05)}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__harita-ac{position:absolute;left:12px;top:12px;z-index:3;display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 16px;border-radius:999px;background:linear-gradient(135deg,#1f4fff,#3f8cff);color:#fff;font:600 14px/1 var(--font-ui);text-decoration:none;box-shadow:0 8px 22px rgba(31,79,255,.35)}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__harita-ac svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2}
:where([data-bilesen="iletisim-formu"]) .iletisim-formu__harita-ac:hover{filter:brightness(1.08)}
@media (max-width:900px){:where([data-bilesen="iletisim-formu"][data-ilf-harita]:not(dialog *)) .iletisim-formu__sol{min-height:0;aspect-ratio:1}}

/* 24 Eki (Okan, iPhone: "proje popup formundaki üst bant mobilde daha ince olmalı, sosyal medyalar yan yana
   olmalı, form çok aşağıda kalmış"): telefonda yörünge bandı 260 → 120 px, kişiler küçülür, hesaplar tek satır
   simge (ad ekran okuyucuda kalır). Bileşen düzeyinde: sayfa altındaki form da aynı. */
@media (max-width:560px){
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__sol{padding:16px 18px;--ilf-adim:26px}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__yorunge{inset:0 0 0 38%;height:auto}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__kisiler li{width:calc(var(--b) * .6);height:calc(var(--b) * .6);margin:calc(var(--b) * -.3) 0 0 calc(var(--b) * -.3)}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__sosyal{margin-top:14px;grid-template-columns:repeat(3,max-content);gap:10px}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__sosyal a{width:40px;height:40px;justify-content:center;border-radius:12px;background:rgba(255,255,255,.75);box-shadow:0 2px 8px rgba(22,31,55,.08)}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__sosyal a span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  :where([data-bilesen="iletisim-formu"]) .iletisim-formu__sag{padding:24px 18px}
}