.ik-kart{position:relative;display:block;margin:0;aspect-ratio:4/5;border:7px solid #fff;border-radius:22px;overflow:hidden;isolation:isolate;
  background:#fff;color:#fff;box-shadow:0 22px 44px -26px rgba(10,10,10,.4),0 0 0 1px rgba(10,10,10,.05);
  transition:translate .5s cubic-bezier(.22,1,.36,1)}
.ik-kart img,.ik-kart video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;pointer-events:none;
  transition:transform .8s cubic-bezier(.22,1,.36,1),opacity .4s}
.ik-kart video{opacity:0}
.ik-kart[data-oynuyor="1"] video{opacity:1}
.ik-kart::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(to bottom,rgba(10,10,10,0) 42%,rgba(10,10,10,.46) 68%,rgba(10,10,10,.82) 100%)}
.ik-oynat{position:absolute;z-index:2;top:9px;right:9px;width:34px;height:34px;border-radius:9999px;background:#fff;
  display:grid;place-items:center;transition:opacity .3s}
.ik-kart[data-oynuyor="1"] .ik-oynat{opacity:0}
.ik-oynat svg{width:11px;height:12px;margin-left:2px;fill:#0A0A0A}
.ik-hap{position:absolute;z-index:2;top:10px;left:10px;max-width:calc(100% - 70px);height:30px;padding:0 12px;border-radius:9999px;
  background:#fff;color:#0A0A0A;font-size:13px;font-weight:500;line-height:30px;letter-spacing:0;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
.ik-hap i{display:inline-block;width:7px;height:7px;margin-right:7px;border-radius:9999px;vertical-align:1px}
.ik-yazi{position:absolute;z-index:2;left:17px;right:17px;bottom:15px}
.ik-marka{margin:0;font-size:clamp(22px,1.9vw,26px);font-weight:600;line-height:1.12;letter-spacing:-.02em;color:#fff}
.ik-detay{margin:5px 0 0;font-size:clamp(15px,1.2vw,17px);font-weight:600;line-height:1.3;letter-spacing:-.005em}
.ik-detay[data-renk="c"]{color:#FF5E4A}
.ik-detay[data-renk="m"]{color:#4895F7}
@media(max-width:767px){.ik-yazi{left:15px;right:15px;bottom:13px}}
@media(prefers-reduced-motion:reduce){
  .ik-kart,.ik-kart img,.ik-kart video,.ik-oynat{transition:none}
}
.prk{--prk-sag:19px;--prk-alt:18px;--prk-boy:30px;position:relative;height:100%;min-width:0}
.prk-a{position:relative;display:block;height:100%;border-radius:22px;color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}
.prk-a:focus-visible{outline:2.5px solid #4895F7;outline-offset:4px}
/* oynat işareti yalnız filmde; ötekinde hap sağa kadar uzayabilir */
.prk:not([data-film]) .ik-hap{max-width:calc(100% - 20px)}
/* süzülünce hap yok (Tümü'nde var) */
.prk[data-hapsiz] .ik-hap{display:none}
/* detay satırı sağdaki ikona çarpmasın */
.prk .ik-detay{padding-right:calc(var(--prk-boy) + 10px)}
/* ── platform ikonu: görselin sağ altında, detay satırının ortasında ── */
.prk-yer{position:absolute;z-index:3;right:var(--prk-sag);bottom:var(--prk-alt);display:grid;place-items:center;width:var(--prk-boy);
  height:var(--prk-boy);border-radius:9999px;background:#fff;color:#0A0A0A;text-decoration:none;-webkit-tap-highlight-color:transparent;
  box-shadow:0 10px 24px -12px rgba(10,10,10,.55);
  transition:opacity .3s,transform .5s cubic-bezier(.22,1,.36,1),background-color .25s,color .25s}
.prk-yer svg{width:13px;height:13px;flex:none;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
/* yazı: ikonun solunda beyaz hap, yalnız ikonun üstüne gelince ya da odakta */
.prk-yer-ad{position:absolute;right:calc(100% + 6px);top:50%;height:30px;margin-top:-15px;padding:0 12px;border-radius:9999px;background:#fff;
  color:#0A0A0A;font-size:13px;font-weight:500;line-height:30px;white-space:nowrap;pointer-events:none;opacity:0;transform:translateX(6px);
  box-shadow:0 10px 24px -12px rgba(10,10,10,.55);transition:opacity .25s,transform .35s cubic-bezier(.22,1,.36,1)}
.prk-yer:focus-visible{outline:2px solid #4895F7;outline-offset:3px}
.prk-yer:focus-visible .prk-yer-ad{opacity:1;transform:none}
/* fare: kartın üstüne gelince belirir ve kartla kalkar */
@media(hover:hover){
  .prk-yer{opacity:0;transform:translateY(4px)}
  .prk:hover .prk-yer,.prk-yer:focus-visible{opacity:1;transform:translateY(-4px)}
  .prk-yer:hover{background:#FF5E4A;color:#fff}
  .prk-yer:hover .prk-yer-ad{opacity:1;transform:none}
}
@media(hover:hover) and (prefers-reduced-motion:no-preference){
  .prk:hover .ik-kart{translate:0 -4px}
  .prk:hover .ik-kart img{transform:scale(1.04)}
}
/* dokunmatik: hep görünür, sessiz */
@media(hover:none){
  .prk{--prk-boy:28px}
  .prk-yer{background:rgba(10,10,10,.3);color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.5)}
  .prk-yer svg{width:12px;height:12px;stroke-width:2.2}
  /* görünen ikon küçük, dokunma alanı 44px */
  .prk-yer::before{content:"";position:absolute;inset:-8px;border-radius:9999px}
  .prk-yer-ad{display:none}
}
@media(max-width:767px){.prk{--prk-sag:17px;--prk-alt:16px}}
@media(prefers-reduced-motion:reduce){.prk-yer,.prk-yer-ad{transition:none}}
.prj{font-family:"Outfit",sans-serif;color:#0A0A0A;background:#FCFBFA;-webkit-font-smoothing:antialiased}
.prj *{box-sizing:border-box}
.prj-sar{position:relative;max-width:1200px;margin:0 auto;padding:0 24px}
.prj-sr{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* ── hero: ortalı; navbar altında geniş pay (masaüstünde 120px, telefonda 48px) ── */
.prj-ust{position:relative;padding:clamp(48px,8.4vw,120px) 0 0;text-align:center}
.prj-nokta{pointer-events:none;position:absolute;inset:0 0 -140px;background-image:radial-gradient(rgba(10,10,10,.05) 1px,transparent 1px);
  background-size:30px 30px;mask-image:radial-gradient(ellipse 58% 62% at 50% 34%,#000 20%,transparent 100%);
  -webkit-mask-image:radial-gradient(ellipse 58% 62% at 50% 34%,#000 20%,transparent 100%)}
.prj-h1{position:relative;margin:0 auto;font-size:clamp(44px,5.6vw,72px);font-weight:600;line-height:1;letter-spacing:-.03em;text-wrap:balance}
.prj-h1 em{font-style:normal;color:#FF5E4A}
.prj-giris{position:relative;margin:14px auto 0;max-width:520px;font-size:18px;line-height:1.6;color:rgba(10,10,10,.6);text-wrap:balance}
/* süs çıkartmaları (TASARIM-KURALLARI §5: 5px beyaz kenar, en çok ±10°, 7 sn'de 10px süzülür): yazıya değmeden kabın iki köşesinde */
.prj-cik{position:absolute;z-index:0;width:clamp(100px,8.6vw,124px);aspect-ratio:1;border:5px solid #fff;border-radius:18px;overflow:hidden;
  background:#fff;box-shadow:0 22px 44px -26px rgba(10,10,10,.4);animation:prj-sal 7s ease-in-out infinite}
.prj-cik img{display:block;width:100%;height:100%;object-fit:cover}
.prj-cik.sag{right:24px;top:calc(-1 * clamp(48px,8.4vw,120px) + 20px);rotate:7deg}
.prj-cik.sol{left:24px;top:-38px;rotate:-8deg;animation-delay:-3.5s}
@keyframes prj-sal{0%,100%{translate:0 0}50%{translate:0 -10px}}
/* ── süzgeç: fiyatlar sekmeleriyle aynı dil ── */
.prj-suz{position:relative;z-index:1;display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:0 auto;padding:0;list-style:none}
.prj-hap{appearance:none;border:0;margin:0;display:inline-flex;align-items:center;gap:9px;height:50px;padding:0 20px 0 17px;border-radius:9999px;
  background:#fff;box-shadow:inset 0 0 0 1px rgba(10,10,10,.14);color:#0A0A0A;font:inherit;font-size:15.5px;font-weight:500;letter-spacing:-.005em;
  white-space:nowrap;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:box-shadow .25s,background-color .25s}
.prj-hap.tumu{padding:0 20px}
/* navbarın Hizmetler menüsündeki çizgi ikon (./ikon.tsx): soluk mürekkep, üstüne gelince mürekkep, seçilince mavi */
.prj-hap svg{flex:none;width:18px;height:18px;color:rgba(10,10,10,.5);transition:color .25s}
.prj-hap b{font-weight:500;color:rgba(10,10,10,.42);font-variant-numeric:tabular-nums;transition:color .25s}
@media(hover:hover){
  .prj-hap:not([aria-pressed="true"]):hover{box-shadow:inset 0 0 0 1px #0A0A0A}
  .prj-hap:not([aria-pressed="true"]):hover svg{color:#0A0A0A}
}
.prj-hap[aria-pressed="true"]{box-shadow:inset 0 0 0 2px #4895F7;background:#F3F8FF;cursor:default}
.prj-hap[aria-pressed="true"] svg,.prj-hap[aria-pressed="true"] b{color:#4895F7}
.prj-hap:focus-visible{outline:2px solid #4895F7;outline-offset:3px}
/* ── ızgara: telefonda tek sütun, tablette üç, masaüstünde dört (onaylı "Son işler" kırılımları) ── */
.prj-isler{--ara:14px;position:relative;padding:34px 0 clamp(88px,9vw,128px)}
/* telefonda bölüm aralığı sitede tek ölçü: 56px (28 Eyl, Burak onayı: mobil denetim m-aralik) */
@media(max-width:767px){.prj-isler{padding-bottom:56px}}
.prj-izgara{list-style:none;margin:clamp(32px,3.4vw,48px) 0 0;padding:0;display:grid;grid-template-columns:minmax(0,1fr);gap:var(--ara)}
.prj-izgara>li{min-width:0}
@media(min-width:641px){
  .prj-isler{--ara:20px}
  .prj-izgara{grid-template-columns:repeat(3,minmax(0,1fr))}
}
/* tablette beş hap tek sıraya sığmıyor: 4 + 1 yerine 3 + 2 kırılsın */
@media(min-width:641px) and (max-width:1023px){.prj-suz{max-width:640px}}
@media(min-width:1024px){
  .prj-isler{--ara:24px}
  .prj-izgara{grid-template-columns:repeat(4,minmax(0,1fr))}
  .prj-buyuk{grid-column:1 / span 2;grid-row:1 / span 2}
  /* büyük kart hücresini doldurur: çıkartma esner, alttaki satır küçük kartlarınkiyle bir hizada (yalnız burada; telefonda ve
     tablette ilk kart ötekiler gibi 4:5) */
  .prj-buyuk .prk-a{flex:1;display:flex;flex-direction:column;min-height:0}
  .prj-buyuk .ik-kart{flex:1;aspect-ratio:auto;min-height:0}
  /* öne çıkan kart başlığı (TASARIM-KURALLARI §1: en çok clamp(26px,2.6vw,34px)) */
  .prj-buyuk .ik-marka{font-size:clamp(26px,2.6vw,34px)}
  .prj-buyuk .ik-detay{margin-top:6px;font-size:clamp(16px,1.35vw,19px)}
  .prj-buyuk .ik-yazi{left:24px;right:24px;bottom:22px}
  /* platform ikonu büyük kartta da detay satırının ortasında */
  .prj-buyuk .prk{--prk-sag:26px;--prk-alt:26px;--prk-boy:34px}
}
/* ── son satırı tamamlayan kutu (kaç hücre boşsa o kadar geniş) ya da satır doluysa altta not ── */
.prj-kutu{display:none;min-width:0;flex-direction:column;justify-content:space-between;gap:18px;padding:22px 22px 16px;
  background:#fff;border:1px solid rgba(10,10,10,.09);border-radius:22px;container-type:inline-size}
.prj-kutu-gorsel{display:block;flex:none;align-self:flex-start}
.prj-kutu-gorsel.cik{width:76px;aspect-ratio:1;border:5px solid #fff;border-radius:16px;overflow:hidden;rotate:-6deg;
  box-shadow:0 18px 36px -22px rgba(10,10,10,.45),0 0 0 1px rgba(10,10,10,.05)}
.prj-kutu-gorsel.cik img{display:block;width:100%;height:100%;object-fit:cover}
.prj-kutu-gorsel.nesne{width:auto;height:78px}
.prj-kutu-yazi{display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.prj-kutu p{margin:0;max-width:340px;font-size:18px;font-weight:500;line-height:1.35;letter-spacing:-.01em;text-wrap:balance}
.prj-kutu p span{display:block;margin-top:2px;font-size:15px;font-weight:400;line-height:1.45;letter-spacing:0;color:rgba(10,10,10,.6)}
/* iki-üç hücrelik kutuda görsel büyür, boşluk dolsun */
@container (min-width:420px){
  .prj-kutu-gorsel.cik{width:104px}
  .prj-kutu-gorsel.nesne{height:112px}
}
.prj-not{display:none;flex-wrap:wrap;align-items:center;gap:2px 24px;margin-top:26px}
.prj-not p{margin:0;font-size:16px;line-height:1.5;color:rgba(10,10,10,.6);text-wrap:balance}
.prj-not p b{font-weight:500;color:#0A0A0A}
.prj .pb-cizgi{font-size:15px}
.prj .pb:focus-visible{outline:2px solid #4895F7;outline-offset:2px}
/* telefon (Burak 25 Eyl: "kartlar çok büyük; bir tanesini büyük koyarız, diğerlerini 2'ye 2"): ilk kart tam en, ötekiler iki sütun.
   Küçük kartın ölçüleri anasayfanın 2x2'siyle aynı (IsKartlari .isb); son satır tek kalırsa samimi kutu doldurur, çiftse altta not */
@media(max-width:640px){
  .prj-isler{--ara:12px}
  .prj-izgara{grid-template-columns:repeat(2,minmax(0,1fr))}
  .prj-izgara>li:first-child{grid-column:1 / -1}
  .prj-izgara>li:not(:first-child) .ik-kart{border-width:5px;border-radius:18px}
  .prj-izgara>li:not(:first-child) .ik-hap{top:7px;left:7px;height:24px;padding:0 9px;font-size:11.5px;line-height:24px;max-width:calc(100% - 44px)}
  .prj-izgara>li:not(:first-child) .prk:not([data-film]) .ik-hap{max-width:calc(100% - 14px)}
  .prj-izgara>li:not(:first-child) .ik-hap i{width:6px;height:6px;margin-right:5px}
  .prj-izgara>li:not(:first-child) .ik-oynat{top:7px;right:7px;width:26px;height:26px}
  .prj-izgara>li:not(:first-child) .ik-oynat svg{width:9px;height:10px}
  .prj-izgara>li:not(:first-child) .ik-yazi{left:11px;right:11px;bottom:10px}
  .prj-izgara>li:not(:first-child) .ik-marka{font-size:17px}
  .prj-izgara>li:not(:first-child) .ik-detay{margin-top:3px;font-size:13px;line-height:1.25}
  .prj-izgara>li:not(:first-child) .prk{--prk-sag:13px;--prk-alt:11px;--prk-boy:24px}
  .prj-izgara>li:not(:first-child) .prk-yer svg{width:11px;height:11px}
  .prj-isler[data-k2="0"] .prj-not{display:flex}
  .prj-isler[data-k2="1"] .prj-kutu{display:flex;grid-column:span 1;gap:12px;padding:14px 14px 12px;border-radius:18px}
  .prj-isler[data-k2="1"] .prj-kutu p{font-size:15px}
  .prj-isler[data-k2="1"] .prj-kutu p span{font-size:13.5px}
  .prj-isler[data-k2="1"] .prj-kutu-gorsel.cik{width:56px;border-width:4px;border-radius:12px}
  .prj-isler[data-k2="1"] .prj-kutu-gorsel.nesne{height:60px}
}
@media(min-width:641px) and (max-width:1023px){
  .prj-isler[data-k3="0"] .prj-not{display:flex}
  .prj-isler[data-k3="1"] .prj-kutu{display:flex;grid-column:span 1}
  .prj-isler[data-k3="2"] .prj-kutu{display:flex;grid-column:span 2}
}
@media(min-width:1024px){
  .prj-isler[data-k4="0"] .prj-not{display:flex}
  .prj-isler[data-k4="1"] .prj-kutu{display:flex;grid-column:span 1}
  .prj-isler[data-k4="2"] .prj-kutu{display:flex;grid-column:span 2}
  .prj-isler[data-k4="3"] .prj-kutu{display:flex;grid-column:span 3}
}
@media(max-width:1179px){.prj-cik{display:none}}
@media(max-width:640px){
  .prj-sar{padding:0 20px}
  .prj-giris{font-size:16.5px}
  .prj-isler{padding-top:28px}
  .prj-suz{gap:8px 7px}
  /* telefonda haplar ikonsuz (fiyatlardaki gibi): 390px'te beşi iki sıraya sığar (3 + 2) */
  .prj-hap,.prj-hap.tumu{height:42px;padding:0 13px;gap:6px;font-size:14px}
  .prj-hap svg{display:none}
  .prj-not{margin-top:22px}
}
@media(prefers-reduced-motion:reduce){
  .prj-cik{animation:none}
  .prj-hap,.prj-hap svg{transition:none}
}
.pb{appearance:none;border:none;display:inline-flex;align-items:center;gap:0;height:50px;padding:0 24px;
  border-radius:9999px;font-family:"Outfit",sans-serif;font-size:15px;font-weight:600;letter-spacing:-.005em;
  text-decoration:none;white-space:nowrap;cursor:pointer;box-sizing:border-box;
  transition:transform .18s cubic-bezier(.22,1,.36,1),background-size .45s cubic-bezier(.22,1,.36,1),color .2s,box-shadow .2s}
.pb:active{transform:scale(.97)}
.pb-ok{width:0;height:17px;margin-left:0;opacity:0;flex:none;fill:none;stroke:currentColor;stroke-width:2.2;
  stroke-linecap:round;stroke-linejoin:round;transition:width .3s,margin .3s,opacity .2s}
.pb-d3,.pb-t1,.pb-canli{background-color:#0A0A0A;color:#fff;background-image:linear-gradient(#FF5E4A,#FF5E4A);
  background-repeat:no-repeat;background-size:0% 100%}
.pb-d3:hover,.pb-t1:hover,.pb-canli:hover{background-size:100% 100%;color:#fff}
.pb-d3:hover .pb-ok,.pb-t1:hover .pb-ok,.pb-canli:hover .pb-ok{width:17px;margin-left:10px;opacity:1}
.pb-ikincil{background:transparent;color:#0A0A0A;box-shadow:inset 0 0 0 1.5px rgba(10,10,10,.18);padding:0 22px}
.pb-ikincil:hover{box-shadow:inset 0 0 0 1.5px #0A0A0A}
.pb[data-zemin="koyu"].pb-d3,.pb[data-zemin="koyu"].pb-t1,.pb[data-zemin="gok"].pb-d3,.pb[data-zemin="gok"].pb-t1{background-color:#fff;color:#0A0A0A}
.pb[data-zemin="koyu"].pb-d3:hover,.pb[data-zemin="koyu"].pb-t1:hover,.pb[data-zemin="gok"].pb-d3:hover,.pb[data-zemin="gok"].pb-t1:hover{color:#fff}
.pb[data-zemin="koyu"].pb-ikincil,.pb[data-zemin="gok"].pb-ikincil{color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.45)}
.pb[data-zemin="koyu"].pb-ikincil:hover,.pb[data-zemin="gok"].pb-ikincil:hover{box-shadow:inset 0 0 0 1.5px #fff}
/* T1: avatarlar + durum noktası */
/* boyut ölçeği tek kural (kullanıcı: "küçültebilirsin ama padding'i bu kadar değişince garip duruyor"):
   T1'de avatar grubunun sol boşluğu üst-alt boşluğuna eşit, yan boşluklar yükseklikle orantılı.
   M 50px: avatar 30, kenar (50-30)/2 = 10 · S 44px: avatar 26, kenar 9 · L 58px: avatar 34, kenar 12 */
.pb-t1{padding:0 24px 0 10px}
.pb-av{position:relative;display:inline-flex;flex:none;margin-right:12px}
.pb-av i{font-style:normal;width:30px;height:30px;border-radius:9999px;display:grid;place-items:center;
  font-size:10px;font-weight:600;color:#fff;box-shadow:0 0 0 2px var(--pb-halka,#0A0A0A)}
.pb-av i+i{margin-left:-6px}
.pb-av b{position:absolute;right:-2px;bottom:-1px;width:10px;height:10px;border-radius:9999px;background:#9CA3AF;
  box-shadow:0 0 0 2px var(--pb-halka,#0A0A0A)}
.pb-av b.on{background:#22C55E}
.pb-av b.on::after{content:"";position:absolute;inset:0;border-radius:9999px;background:#22C55E;animation:pb-nabiz 2s ease-out infinite}
@keyframes pb-nabiz{0%{transform:scale(1);opacity:.7}100%{transform:scale(2.4);opacity:0}}
/* canlı: avatarsız, yalnız nabız atan yeşil nokta */
.pb-canli{padding:0 22px 0 18px}
.pb-nokta{position:relative;width:8px;height:8px;margin-right:10px;border-radius:9999px;background:#22C55E;flex:none}
.pb-nokta::after{content:"";position:absolute;inset:0;border-radius:9999px;background:#22C55E;animation:pb-nabiz 2s ease-out infinite}
.pb.kucuk.pb-canli{padding-left:16px;padding-right:20px}
.pb-t1:hover{--pb-halka:#fff}
.pb[data-zemin="koyu"].pb-t1,.pb[data-zemin="gok"].pb-t1{--pb-halka:#fff}
.pb.buyuk{height:58px;font-size:16px;padding-left:28px;padding-right:28px}
.pb.buyuk.pb-ikincil{padding-left:26px;padding-right:26px}
.pb.buyuk.pb-t1{padding-left:12px}
.pb.buyuk .pb-av i{width:34px;height:34px;font-size:11px}
.pb.buyuk .pb-av{margin-right:14px}
.pb.kucuk{height:44px;font-size:14.5px;padding-left:21px;padding-right:21px}
.pb.kucuk.pb-ikincil{padding-left:19px;padding-right:19px}
.pb.kucuk.pb-t1{padding-left:9px}
.pb.kucuk .pb-av i{width:26px;height:26px;font-size:9.5px}
.pb.kucuk .pb-av{margin-right:11px}
/* çizgi bağlantı: zemin yok, alt çizgi yazının üçte biri kadar başlar, üstüne gelince tamamlanır */
.pb-cizgi{position:relative;height:auto;min-height:40px;padding:0 2px;gap:8px;border-radius:0;background:none;color:#0A0A0A}
.pb-cizgi::after{content:"";position:absolute;left:0;right:0;bottom:6px;height:1.5px;background:currentColor;
  transform-origin:left;transform:scaleX(.32);transition:transform .5s cubic-bezier(.7,0,.2,1)}
.pb-cizgi:hover::after{transform:scaleX(1)}
.pb-capraz{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;
  transition:transform .4s cubic-bezier(.22,1,.36,1)}
.pb-cizgi:hover .pb-capraz{transform:translate(3px,-3px)}
.pb-cizgi[data-renk="mercan"]{color:#FF5E4A}
.pb[data-zemin="koyu"].pb-cizgi,.pb[data-zemin="gok"].pb-cizgi{color:#fff}
@media(prefers-reduced-motion:reduce){.pb,.pb-ok,.pb-av b.on::after,.pb-nokta::after{transition:none;animation:none}}
.kps{position:relative;overflow:hidden;isolation:isolate;background:#2F94EF;color:#fff;font-family:"Outfit",sans-serif;
  height:clamp(620px,calc(100vw / 1.85),820px);text-align:center;-webkit-font-smoothing:antialiased;--cam-r:clamp(230px,22vw,330px)}
.kps *{box-sizing:border-box}
.kps-sahne{position:absolute;inset:0;z-index:-1;pointer-events:none}
.kps-sahne img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 78%}
/* buz: görselin bulanık kopyaları, aynı kutu ve kadraj (yukarıdaki img kuralı), alt kenara doğru maskeyle */
.kps-buz{position:absolute;inset:0}
.kps .kps-buz{display:none}
.kps[data-cam] .kps-buz{display:block}
.kps .kps-buz.b1{-webkit-mask-image:linear-gradient(to top,#000 0,#000 calc(var(--cam-r) * 0.600),rgba(0,0,0,.84) calc(var(--cam-r) * 0.700),rgba(0,0,0,.5) calc(var(--cam-r) * 0.800),rgba(0,0,0,.16) calc(var(--cam-r) * 0.900),transparent calc(var(--cam-r) * 1.000));mask-image:linear-gradient(to top,#000 0,#000 calc(var(--cam-r) * 0.600),rgba(0,0,0,.84) calc(var(--cam-r) * 0.700),rgba(0,0,0,.5) calc(var(--cam-r) * 0.800),rgba(0,0,0,.16) calc(var(--cam-r) * 0.900),transparent calc(var(--cam-r) * 1.000))}
.kps .kps-buz.b2{-webkit-mask-image:linear-gradient(to top,#000 0,#000 calc(var(--cam-r) * 0.300),rgba(0,0,0,.84) calc(var(--cam-r) * 0.405),rgba(0,0,0,.5) calc(var(--cam-r) * 0.510),rgba(0,0,0,.16) calc(var(--cam-r) * 0.615),transparent calc(var(--cam-r) * 0.720));mask-image:linear-gradient(to top,#000 0,#000 calc(var(--cam-r) * 0.300),rgba(0,0,0,.84) calc(var(--cam-r) * 0.405),rgba(0,0,0,.5) calc(var(--cam-r) * 0.510),rgba(0,0,0,.16) calc(var(--cam-r) * 0.615),transparent calc(var(--cam-r) * 0.720))}
.kps .kps-buz.b3{-webkit-mask-image:linear-gradient(to top,#000 0,#000 calc(var(--cam-r) * 0.080),rgba(0,0,0,.84) calc(var(--cam-r) * 0.165),rgba(0,0,0,.5) calc(var(--cam-r) * 0.250),rgba(0,0,0,.16) calc(var(--cam-r) * 0.335),transparent calc(var(--cam-r) * 0.420));mask-image:linear-gradient(to top,#000 0,#000 calc(var(--cam-r) * 0.080),rgba(0,0,0,.84) calc(var(--cam-r) * 0.165),rgba(0,0,0,.5) calc(var(--cam-r) * 0.250),rgba(0,0,0,.16) calc(var(--cam-r) * 0.335),transparent calc(var(--cam-r) * 0.420))}
.kps-ic{position:relative;max-width:1200px;margin:0 auto;padding:clamp(88px,10.4vw,150px) 24px 0}
/* telefonda bölüm aralığı sitede tek ölçü: 56px (28 Eyl, Burak onayı: mobil denetim m-aralik) */
@media(max-width:767px){.kps-ic{padding-top:56px}}
.kps h2{margin:0 auto;max-width:820px;font-size:clamp(40px,5vw,64px);font-weight:600;line-height:1.02;letter-spacing:-.03em;text-wrap:balance}
.kps h2 .mercan,.kps h2 .mavi,.kps h2 em{font-style:normal;color:inherit}
.kps-cta{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:32px}
@media(max-width:767px){
  .kps{height:auto;--cam-r:clamp(80px,23vw,100px)}
  .kps-ic{padding:56px 20px 0}
  /* 28 Eyl (mobil denetim m-kapanis): sahne 390:420'den 390:300'e (odak alt kenar: çimen ve bulutlar kırpılmaz, göğün üstü kısalır);
     metnin altına 40px biner (eskisi 128): butonlar bulutun değil düz göğün üstünde kalır */
  .kps-sahne{position:relative;inset:auto;aspect-ratio:390/300;margin-top:-40px}
  /* kısa kutuda iki yandaki bulutlar üst kenara değiyor: sahnenin üstü göğe yumuşak geçer (yalnız asıl görsel; buz kopyaları altta) */
  .kps-sahne>img{-webkit-mask-image:linear-gradient(to bottom,transparent,#000 64px);mask-image:linear-gradient(to bottom,transparent,#000 64px)}
  .kps-sahne img{object-position:50% 100%}
  .kps-cta{margin-top:28px}
}