/* Konum: site/assets/css/his.css
   Dokunuş hissi (His 1 · Vyro'ya yakın) + kaydırınca küçülen üst menü (Menü v1). KARARLAR m.87, m.88 (8).
   Kaynak: site-v2 etkileşim prototipi (His 1, v1.css) ve menü varyantı v1 (menu.css), 13 Eki 2026; HARITA.
   Yalnız hareket katmanı: yerleşim, renk, yazı, metin, görsel değişmez. Seçici (?his=, ?v=) yok; His 1 ve Menü v1 sabit.
   Hap düğme: üzerine gelince .97, basınca .95 (200 ms expo-out), bırakınca yay (~%13 geri tepme, 450 ms).
   Basılı durum: :active ya da his.js'in pointerdown'da koyduğu .his-bas (telefonda gecikmesiz).
   Prototipteki html[data-his="1"] öneki :root oldu (sayfa içi kuralların önüne geçmek için bir sınıf ağırlığı).
   prefers-reduced-motion: reduce → ölçek, kayma, yay, akış ve menü geçişi kapanır; renk/saydamlık geri bildirimi kalır. */

/* ===================== 1 · His ===================== */
:root { --his-yay: cubic-bezier(.3, 1.4, .5, 1); }
@supports (transition-timing-function: linear(0, 1)) {
  :root { --his-yay: linear(0, 0.0647, 0.2207, 0.4179, 0.6186, 0.7972, 0.9397, 1.041, 1.1029, 1.1314, 1.1342, 1.1199, 1.0959, 1.0684, 1.042, 1.0195, 1.0023, 0.9907, 0.9841, 0.9817, 0.9823, 0.9849, 0.9884, 0.9921, 0.9955, 0.9983, 1); }
}

/* 0 · Dokunma tabanı: gri dokunma kutusu yok, çift dokunma yakınlaştırma beklemesi yok */
:root :is(a, button, summary, label, input, select, textarea, [role="button"], .tile) {
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}

/* 1 · Hareketsiz geri bildirim (prefers-reduced-motion: reduce iken de kalır) */
@media (hover: hover) {
  :root :is(a.alt, .n1-detay, .ks-tum, a.metin-link, .nav .links a, .ab-ic a, .kb .yay, .rule-jump, .back, footer.ortak-alt a):hover { opacity: .7; }
}
:root :is(a.alt, .n1-detay, .ks-tum, a.metin-link, .nav .links a, .ab-ic a, .kb .yay, .rule-jump, .back, footer.ortak-alt a, .mmenu > nav a):active { opacity: .7; }
:root :is(.sss-liste summary, #kurallar > summary):is(:active, .his-bas) { opacity: .7; }
@media (prefers-reduced-motion: reduce) {
  :root :is(.nx-git, .yb-git, .nav .join, .primary):is(:active, .his-bas) { background: #000; }
  :root .btn:is(:active, .his-bas) { filter: brightness(.86); } /* hero ve yayıncı çağrısı: koyu ve mercan düğmede aynı koyulaşma */
  :root :is(.dugme-g, .sosyal button, .geri, .dur, .kopyala, .close, .mmenu > summary, .secim):is(:active, .his-bas) { background-color: #F3E9E3; }
  :root .secondary:is(:active, .his-bas) { opacity: .7; }
  :root .kamp:is(:active, .his-bas) { opacity: .85; }
}

/* 2 · Hareket */
@media (prefers-reduced-motion: no-preference) {
  /* Hap düğmeler: üzerine gelince .97, basınca .95 (200 ms expo-out), bırakınca yay (~%13 geri tepme) */
  :root :is(.btn, .nx-git, .yb-git, .nav .join, .primary, .dugme,
    .dugme-g, .sosyal button, .geri, .dur, .secondary, .kopyala, .close, .mmenu > summary) {
    transition: scale .45s var(--his-yay), background-color .2s cubic-bezier(.16, 1, .3, 1),
      border-color .2s cubic-bezier(.16, 1, .3, 1), color .2s cubic-bezier(.16, 1, .3, 1);
  }
  :root :is(.btn, .primary):is(:hover, :active, .his-bas) { transform: none; } /* bugünkü -1 / +2 px kayma yerine ölçek */
  @media (hover: hover) {
    :root :is(.btn, .nx-git, .yb-git, .nav .join, .primary, .dugme,
      .dugme-g, .sosyal button, .geri, .dur, .secondary, .kopyala, .close, .mmenu > summary):hover {
      scale: .97; transition-timing-function: cubic-bezier(.16, 1, .3, 1); transition-duration: .2s;
    }
  }
  :root :is(.btn, .nx-git, .yb-git, .nav .join, .primary, .dugme,
    .dugme-g, .sosyal button, .geri, .dur, .secondary, .kopyala, .close, .mmenu > summary):is(:active, .his-bas) {
    scale: .95; transition-timing-function: cubic-bezier(.16, 1, .3, 1); transition-duration: .2s;
  }

  /* Ok simgesi: basınca ve üzerine gelince 4 px kayar */
  :root :is(.btn svg, .nx-git svg, .yb-git .ks-ok, .ks-tum .ks-ok, .kamp .git svg, .dugme svg.ileri,
    .secim .s-ok, .primary svg) { transition: transform .45s var(--his-yay); }
  :root :is(.btn, .nx-git, .primary):is(:active, .his-bas) svg,
  :root .dugme:is(:active, .his-bas) svg.ileri,
  :root :is(.yb-git, .ks-tum):is(:active, .his-bas) .ks-ok,
  :root :is(.kamp:is(:active, .his-bas) .git svg, .secim:is(:active, .his-bas) .s-ok) { transform: translateX(4px); }
  @media (hover: hover) {
    :root :is(.btn:hover svg, .nx-git:hover svg, .primary:hover svg) { transform: translateX(4px); }
  }

  /* Kampanya kartı: basınca .97 içe göçer, bırakınca yay; kapak görseli üzerine gelince 1.05 */
  :root :is(.kamp, .secim) { transition: scale .45s var(--his-yay), border-color .15s, background-color .15s; }
  :root :is(.kamp, .secim):is(:active, .his-bas) { scale: .97; transition-timing-function: cubic-bezier(.16, 1, .3, 1); transition-duration: .2s; }
  :root .kamp .kapak img { transition: transform .45s cubic-bezier(.16, 1, .3, 1); }
  @media (hover: hover) { :root .kamp:hover .kapak img { transform: scale(1.05); } }

  /* Hero duvarı klip kartları: üzerine gelince / dokununca görsel 1.05; masaüstü duvarda 4 px kalkar */
  :root .tile { transition: translate .45s var(--his-yay); }
  :root .tile img { transition: transform .45s cubic-bezier(.16, 1, .3, 1); }
  :root .tile:is(:active, .his-bas) img { transform: scale(1.05); }
  :root .wall .tile:is(:active, .his-bas) { translate: 0 -4px; }
  @media (hover: hover) {
    :root .tile:hover img { transform: scale(1.05); }
    :root .wall .tile:hover { translate: 0 -4px; }
  }

  /* Bağlantılar: saydamlık 150 ms */
  :root :is(a.alt, .n1-detay, .ks-tum, a.metin-link, .nav .links a, .ab-ic a, .kb .yay, .rule-jump, .back,
    footer.ortak-alt a, .mmenu > nav a, .sss-liste summary, #kurallar > summary) {
    transition: opacity .15s cubic-bezier(.4, 0, .2, 1), background-color .15s;
  }

  /* SSS artısı: 260 ms ease-out (Vyro SSS simgesi) */
  :root :is(.sss-arti, .expand) {
    transition: transform .26s cubic-bezier(0, 0, .2, 1), background-color .26s cubic-bezier(0, 0, .2, 1),
      border-color .26s cubic-bezier(0, 0, .2, 1), color .26s cubic-bezier(0, 0, .2, 1);
  }
  :root .mmenu > nav { transform-origin: top right; }

  /* Katıl adımları (ortak sınıf): 250 ms, 8 px, cubic-bezier(.22,1,.36,1) */
  :root .panel {
    animation-name: his1-gir !important;
    animation-duration: .25s !important;
    animation-timing-function: cubic-bezier(.22, 1, .36, 1) !important;
  }
  @keyframes his1-gir { from { opacity: 0; translate: 0 8px; } to { opacity: 1; translate: 0 0; } }
}


/* ===================== 2 · Kaydırınca üst menü (Menü v1) =====================
   Sayfa başındaki hap menü yerinde kalır. Menü ekrandan çıkınca his.js onun bir kopyasını (.nav.mv-kucuk) ekler:
   masaüstü logo · Kampanyalar · Panelim · Katıl; telefon (≤960 px) logo · Menü · Panelim · Katıl, aşağı kaydırırken
   saklanır, yukarı kaydırınca 240 ms'de gelir. Kopya yalnız opacity + transform ile gelir/gider → CLS 0. */
:root { --mv-e: cubic-bezier(.16, 1, .3, 1); --mv-t: .24s; }
:root :is(main [id], main section, main details, .yasal h2) { scroll-margin-top: 96px; }
:root .skip { z-index: 60; }

.mv-kucuk { display: none; }
:root .nav.mv-kucuk {
  display: flex; position: fixed; top: 12px; z-index: 50;
  gap: 22px; padding: 6px 6px 6px 16px;
  background: rgba(255, 255, 255, .88);
  backdrop-filter: blur(20px) saturate(1.6); -webkit-backdrop-filter: blur(20px) saturate(1.6);
  box-shadow: 0 8px 28px rgba(23, 25, 29, .10);
  opacity: 0; visibility: hidden; pointer-events: none;
  transform: translate(-50%, -10px) scale(.98);
  transition: opacity var(--mv-t) var(--mv-e), transform var(--mv-t) var(--mv-e), visibility 0s linear var(--mv-t);
}
:root.mv-asagi .nav.mv-kucuk,
:root .nav.mv-kucuk:focus-within {
  opacity: 1; visibility: visible; pointer-events: auto;
  transform: translate(-50%, 0);
  transition: opacity var(--mv-t) var(--mv-e), transform var(--mv-t) var(--mv-e), visibility 0s;
}
:root .nav.mv-kucuk .logo img { height: 26px; }
:root .nav.mv-kucuk :is(.logo, .join, .metin-link) { display: inline-flex; align-items: center; min-height: 44px; } /* kampanya şablonunda logo 30, Katıl 35 px idi */
:root .nav.mv-kucuk .join { padding: 9px 16px; }
:root .nav.mv-kucuk .links { display: none; }

/* Orta bağlantılar yerine tek "Kampanyalar" (yalnız masaüstü; telefonda Menü düğmesi kalır) */
.nav .mv-kamp { display: inline-flex; align-items: center; min-height: 44px; padding: 0 2px; font-size: 14.5px; font-weight: 550; color: var(--muted); }
.nav .mv-kamp:hover { color: var(--ink); }

/* Telefon: aşağı kaydırırken saklı (odak alabilir; odak gelince görünür) */
:root.mv-asagi.mv-sakli .nav.mv-kucuk:not(:focus-within) {
  opacity: 0; pointer-events: none;
  transform: translate(-50%, calc(-100% - 16px));
}

@media (max-width: 960px) {
  :root .nav.mv-kucuk { gap: 12px; padding: 6px 6px 6px 14px; }
  :root .nav.mv-kucuk .logo img { height: 24px; }
  .nav .mv-kamp { display: none; }
  :root .nav.mv-kucuk .mmenu { display: block; }
}

/* Buzlu cam desteklenmezse düz beyaz %95 */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  :root .nav.mv-kucuk { background-color: rgba(255, 255, 255, .95); }
}

/* Hareket azaltma: anında, animasyonsuz */
@media (prefers-reduced-motion: reduce) {
  :root .nav.mv-kucuk { transition: none !important; }
}

/* 320 px: hap menü 324 px genişlikte (2 px taşıyordu). ≤340 px aralık 14 → 12; görünüm aynı. */
@media (max-width: 340px) {
  :root .nav:not(.mv-kucuk) { gap: 12px; }
}


/* ===================== 3 · Kapanış (alt bilgi) · iki varyasyon =====================
   14 Eki 2026, Fatih: "kapanışta animasyon olsun; Klipoda ve altındakiler farklı tarzda, en alta kaydırmadan görünmesin".
   his.js <html data-kapanis="a|b"> koyar (varsayılan A; önizleme: ?kapanis=b). JS yoksa öznitelik yok → eski alt bilgi aynen.
   A · Perde: alt bilgi sabit arkada; içerik kalkınca altından açılır, büyük "Klipoda" harf harf maskeden yükselir.
   B · Dev yazı + akış: görünür alana girince kenardan kenara KLIPODA aşağıdan kayar, arkada yavaş akan ışık, sütunlar süzülür.
   Gizli başlangıç durumları yalnız prefers-reduced-motion: no-preference + .kp-hazir altında; azaltmada her şey düz görünür. */
:root[data-kapanis] footer.alt-bilgi {
  --kp-zemin: var(--ink, #17191D); --kp-yazi: rgba(255, 255, 255, .74);
  position: relative; overflow: hidden; isolation: isolate;
  margin-top: 0; padding: 0 20px; background: var(--kp-zemin); color: #fff;
}
:root[data-kapanis] main { position: relative; z-index: 1; background: var(--canvas, #FFF9F6); padding-bottom: clamp(72px, 9vw, 120px); }
:root[data-kapanis] footer.alt-bilgi .ab-ic { border-top: 0; color: var(--kp-yazi); max-width: 1440px; }
:root[data-kapanis] footer.alt-bilgi .ab-ic a { color: var(--kp-yazi); text-decoration: none; }
:root[data-kapanis] footer.alt-bilgi .ab-ic a:hover { color: #fff; }
:root[data-kapanis] footer.alt-bilgi .ab-ic a:focus-visible { outline-color: var(--coral, #FF805E); }
:root[data-kapanis] footer.alt-bilgi .ab-logo img { filter: brightness(0) invert(1); }
:root[data-kapanis] footer.alt-bilgi :is(.ab-not, .ab-riot) { color: rgba(255, 255, 255, .5); }
.kp-isaret { display: none; }
:root[data-kapanis] .kp-isaret { display: flex; pointer-events: none; user-select: none; font-weight: 800; color: #fff; white-space: nowrap; }

/* ---------- A · Perde ---------- */
:root[data-kapanis="a"] main { border-radius: 0 0 clamp(24px, 3vw, 44px) clamp(24px, 3vw, 44px); box-shadow: 0 30px 60px rgba(23, 25, 29, .22); }
:root[data-kapanis="a"].kp-perde footer.alt-bilgi { position: sticky; bottom: 0; z-index: 0; }
:root[data-kapanis="a"] footer.alt-bilgi .ab-ic {
  display: grid; grid-template-columns: 1fr; justify-items: start; text-align: left;
  padding: clamp(64px, 9vw, 120px) 4px 28px; gap: 14px 32px; font-size: 15px;
}
:root[data-kapanis="a"] .kp-isaret {
  order: -1; overflow: hidden; padding-bottom: .06em;
  font-size: clamp(76px, 15vw, 232px); line-height: .9; letter-spacing: -.05em;
}
:root[data-kapanis="a"] .kp-harf { display: inline-block; }
:root[data-kapanis="a"] .kp-nokta { color: var(--coral, #FF805E); }
:root[data-kapanis="a"] footer.alt-bilgi .ab-linkler { justify-content: flex-start; gap: 0 26px; }
:root[data-kapanis="a"] footer.alt-bilgi .ab-linkler:not(.ab-yasal) { font-size: 17px; font-weight: 600; }
:root[data-kapanis="a"] footer.alt-bilgi .ab-linkler:not(.ab-yasal) a { color: #fff; }
:root[data-kapanis="a"] footer.alt-bilgi .ab-logo { display: none; } /* büyük kelime işareti logonun yerini alır; ana sayfa bağlantısı listede */
:root[data-kapanis="a"] footer.alt-bilgi .ab-riot { text-align: left; }

/* ---------- B · Dev yazı + akış ---------- */
:root[data-kapanis="b"] footer.alt-bilgi { margin-top: 0; border-radius: clamp(24px, 3vw, 40px) clamp(24px, 3vw, 40px) 0 0; }
:root[data-kapanis="b"] main { padding-bottom: clamp(56px, 7vw, 96px); }
:root[data-kapanis="b"] footer.alt-bilgi::before {
  content: ""; position: absolute; z-index: -1; inset: -40% -20%; pointer-events: none;
  background:
    radial-gradient(40% 50% at 20% 70%, rgba(255, 128, 94, .38), transparent 70%),
    radial-gradient(35% 45% at 80% 30%, rgba(255, 173, 149, .22), transparent 70%),
    radial-gradient(30% 40% at 55% 100%, rgba(184, 68, 43, .35), transparent 70%);
}
:root[data-kapanis="b"] footer.alt-bilgi .ab-ic {
  display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 1fr);
  align-items: start; justify-items: start; text-align: left;
  padding: clamp(56px, 7vw, 96px) 4px 8px; gap: 28px 32px; font-size: 15px;
}
:root[data-kapanis="b"] footer.alt-bilgi .ab-linkler { display: flex; flex-direction: column; align-items: flex-start; gap: 0; }
:root[data-kapanis="b"] footer.alt-bilgi .ab-linkler::before {
  content: "Sayfalar"; display: block; margin-bottom: 6px; font-size: 12px; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; color: rgba(255, 255, 255, .45);
}
:root[data-kapanis="b"] footer.alt-bilgi .ab-yasal::before { content: "Yasal"; }
:root[data-kapanis="b"] footer.alt-bilgi .ab-ic a { min-height: 40px; font-size: 16px; }
:root[data-kapanis="b"] footer.alt-bilgi .ab-logo { grid-row: 1; }
:root[data-kapanis="b"] footer.alt-bilgi :is(.ab-not, .ab-riot) { grid-column: 1 / -1; text-align: left; margin-top: 0; }
:root[data-kapanis="b"] .kp-isaret {
  max-width: none; justify-content: center; overflow: hidden; margin: 8px -20px 0; line-height: .78;
  font-size: var(--kp-boy, 19.5vw); letter-spacing: -.045em; /* metin JS'te büyük harfle: lang="tr" büyütmesi İ yapmasın */
}
:root[data-kapanis="b"] .kp-isaret > span {
  display: block; padding: 0 .02em;
  background: linear-gradient(180deg, #fff 18%, rgba(255, 255, 255, .12) 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
@media (max-width: 760px) {
  :root[data-kapanis="b"] footer.alt-bilgi .ab-ic { grid-template-columns: 1fr 1fr; }
  :root[data-kapanis="b"] footer.alt-bilgi .ab-logo { grid-column: 1 / -1; }
}
@media (max-width: 700px) {
  :root[data-kapanis] footer.alt-bilgi { padding: 0 16px; }
  :root[data-kapanis="a"] footer.alt-bilgi .ab-linkler:not(.ab-yasal) { font-size: 16px; gap: 0 18px; }
  :root[data-kapanis="b"] .kp-isaret { margin: 8px -16px 0; }
}

/* ---------- C · Mercan perde / D · Koyu + mercan çizgi / E · Açık + mercan ışık (14 Eki, Fatih: dev kelime yok) ---------- */
:root:is([data-kapanis="c"], [data-kapanis="d"]) main { border-radius: 0 0 clamp(24px, 3vw, 44px) clamp(24px, 3vw, 44px); box-shadow: 0 30px 60px rgba(23, 25, 29, .18); }
:root:is([data-kapanis="c"], [data-kapanis="d"]).kp-perde footer.alt-bilgi { position: sticky; bottom: 0; z-index: 0; }
:root:is([data-kapanis="c"], [data-kapanis="d"], [data-kapanis="e"]) footer.alt-bilgi .ab-ic {
  display: grid; grid-template-columns: auto 1fr; align-items: center; justify-items: start; text-align: left;
  padding: clamp(56px, 7vw, 96px) 4px 28px; gap: 18px 40px; font-size: 15px;
}
:root:is([data-kapanis="c"], [data-kapanis="d"], [data-kapanis="e"]) footer.alt-bilgi .ab-logo img { height: 40px; width: auto; }
:root:is([data-kapanis="c"], [data-kapanis="d"], [data-kapanis="e"]) footer.alt-bilgi .ab-linkler { justify-content: flex-start; gap: 0 24px; }
:root:is([data-kapanis="c"], [data-kapanis="d"], [data-kapanis="e"]) footer.alt-bilgi .ab-linkler:not(.ab-yasal) { font-size: 16.5px; font-weight: 650; }
:root:is([data-kapanis="c"], [data-kapanis="d"], [data-kapanis="e"]) footer.alt-bilgi :is(.ab-yasal, .ab-not, .ab-riot) { grid-column: 1 / -1; text-align: left; }
/* C: mercan zemin, mürekkep yazı (7,1:1), logo siyah */
:root[data-kapanis="c"] footer.alt-bilgi { --kp-zemin: var(--coral, #FF805E); --kp-yazi: rgba(23, 25, 29, .82); color: var(--ink, #17191D); }
:root[data-kapanis="c"] footer.alt-bilgi .ab-logo img { filter: brightness(0); }
:root[data-kapanis="c"] footer.alt-bilgi .ab-ic { grid-template-columns: auto 1fr auto; padding: clamp(26px, 3vw, 38px) 4px clamp(18px, 2vw, 24px); gap: 8px 36px; }
:root[data-kapanis="c"] footer.alt-bilgi .ab-logo img { height: 34px; }
:root[data-kapanis="c"] footer.alt-bilgi .ab-yasal { grid-column: auto; justify-content: flex-end; }
:root[data-kapanis="c"] footer.alt-bilgi .ab-not { grid-column: 1 / -1; font-size: 13px; }
@media (max-width: 960px) {
  :root[data-kapanis="c"] footer.alt-bilgi .ab-ic { grid-template-columns: 1fr; gap: 10px; }
  :root[data-kapanis="c"] footer.alt-bilgi .ab-yasal { justify-content: flex-start; }
}
:root[data-kapanis="c"] footer.alt-bilgi .ab-ic a:hover { color: var(--ink, #17191D); text-decoration: underline; text-underline-offset: 4px; }
:root[data-kapanis="c"] footer.alt-bilgi .ab-ic a:focus-visible { outline-color: var(--ink, #17191D); }
:root[data-kapanis="c"] footer.alt-bilgi :is(.ab-not, .ab-riot) { color: rgba(23, 25, 29, .62); }
/* D: koyu zemin, üstte mercan çizgi açılınca soldan dolar, mercan hover */
:root[data-kapanis="d"] footer.alt-bilgi::before {
  content: ""; position: absolute; left: 0; top: 0; height: 3px; width: 100%; background: var(--coral, #FF805E);
  transform-origin: 0 50%; scale: var(--kp-cizgi, 1) 1;
}
:root[data-kapanis="d"] footer.alt-bilgi .ab-ic a:hover { color: var(--coral, #FF805E); }
/* E: açık zemin, logo kendi renginde, arkada çok hafif mercan ışık akar */
:root[data-kapanis="e"] footer.alt-bilgi { --kp-zemin: #FFFFFF; --kp-yazi: #3F4450; color: var(--ink, #17191D); border-top: 1px solid #EEEFF1; }
:root[data-kapanis="e"] footer.alt-bilgi .ab-logo img { filter: none; }
:root[data-kapanis="e"] footer.alt-bilgi .ab-ic a:hover { color: var(--ink, #17191D); }
:root[data-kapanis="e"] footer.alt-bilgi .ab-linkler:not(.ab-yasal) a { color: var(--ink, #17191D); }
:root[data-kapanis="e"] footer.alt-bilgi :is(.ab-not, .ab-riot) { color: #6B7079; }
:root[data-kapanis="e"] footer.alt-bilgi::before {
  content: ""; position: absolute; z-index: -1; inset: -40% -20%; pointer-events: none;
  background: radial-gradient(38% 48% at 18% 80%, rgba(255, 128, 94, .16), transparent 70%), radial-gradient(30% 40% at 85% 20%, rgba(255, 173, 149, .12), transparent 70%);
}
@media (max-width: 700px) {
  :root:is([data-kapanis="c"], [data-kapanis="d"], [data-kapanis="e"]) footer.alt-bilgi .ab-ic { grid-template-columns: 1fr; gap: 14px; }
  :root:is([data-kapanis="c"], [data-kapanis="d"], [data-kapanis="e"]) footer.alt-bilgi .ab-linkler:not(.ab-yasal) { font-size: 16px; gap: 0 18px; }
}

/* ---------- C alt varyasyonları (?kapanis=c2…c5) ---------- */
/* C2 · Yüzen kart: kenarlardan içeride, yuvarlak köşeli mercan şerit */
:root[data-kapanis="c"][data-kc="2"] footer.alt-bilgi { background: transparent; padding: 0 clamp(12px, 2vw, 24px) clamp(12px, 2vw, 24px); overflow: visible; }
:root[data-kapanis="c"][data-kc="2"] footer.alt-bilgi .ab-ic { background: var(--coral, #FF805E); border-radius: clamp(20px, 2.4vw, 32px); padding-inline: clamp(18px, 2.4vw, 32px); max-width: none; box-shadow: 0 18px 40px -18px rgba(184, 68, 43, .55); }
:root[data-kapanis="c"][data-kc="2"] main { box-shadow: none; }
/* C3 · Eylemli: sağda küçük siyah hap "Kampanyalara bak" */
.kp-eylem { display: none; }
:root[data-kapanis="c"][data-kc="3"] .kp-eylem { display: inline-flex; align-items: center; min-height: 44px; padding: 0 20px; border-radius: 999px; background: var(--ink, #17191D); color: #fff !important; font-weight: 700; font-size: 15px; text-decoration: none !important; justify-self: end; grid-column: 3; grid-row: 1; }
:root[data-kapanis="c"][data-kc="3"] footer.alt-bilgi .ab-yasal { grid-column: 1 / -1; justify-content: flex-start; }
:root[data-kapanis="c"][data-kc="3"] .kp-eylem:hover { background: #000; }
/* C4 · Işıltı: mercan degrade + açılınca üzerinden geçen yumuşak ışık */
:root[data-kapanis="c"][data-kc="4"] footer.alt-bilgi { background: linear-gradient(100deg, #FF805E 0%, #FF9473 55%, #FF7A57 100%); }
:root[data-kapanis="c"][data-kc="4"] footer.alt-bilgi::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(100deg, transparent 30%, rgba(255, 255, 255, .35) 50%, transparent 70%); translate: -120% 0; }
/* C5 · Pastel: çok açık mercan zemin, mürekkep yazı, logo kendi renginde (en hafif turuncu) */
:root[data-kapanis="c"][data-kc="5"] footer.alt-bilgi { --kp-zemin: #FFEDE7; --kp-yazi: #3F3532; border-top: 1px solid #FFD9CC; }
:root[data-kapanis="c"][data-kc="5"] footer.alt-bilgi .ab-logo img { filter: none; }
:root[data-kapanis="c"][data-kc="5"] footer.alt-bilgi .ab-ic a:hover { color: #B8442B; text-decoration: none; }
:root[data-kapanis="c"][data-kc="5"] main { box-shadow: 0 24px 48px rgba(23, 25, 29, .10); }
@media (max-width: 960px) {
  :root[data-kapanis="c"][data-kc="3"] .kp-eylem { grid-column: auto; grid-row: auto; justify-self: start; }
}

/* ---------- Hareket (yalnız JS hazırsa ve hareket azaltma kapalıysa) ---------- */
@media (prefers-reduced-motion: no-preference) {
  :root.kp-hazir footer.alt-bilgi .ab-ic a,
  :root.kp-hazir footer.alt-bilgi :is(.ab-not, .ab-riot) {
    opacity: 0; translate: 0 14px;
    transition: opacity .6s cubic-bezier(.16, 1, .3, 1), translate .6s cubic-bezier(.16, 1, .3, 1), color .15s;
    transition-delay: calc(var(--kp-s, 0) * 45ms + 260ms), calc(var(--kp-s, 0) * 45ms + 260ms), 0s;
  }
  :root.kp-hazir footer.alt-bilgi.kp-acik .ab-ic a,
  :root.kp-hazir footer.alt-bilgi.kp-acik :is(.ab-not, .ab-riot) { opacity: 1; translate: 0 0; }

  /* A: harfler maskeden yükselir; perde açılırken içerik hafif büyüyerek yerine oturur */
  :root.kp-hazir[data-kapanis="a"] .kp-harf {
    translate: 0 108%; rotate: 6deg;
    transition: translate .9s cubic-bezier(.16, 1, .3, 1), rotate .9s cubic-bezier(.16, 1, .3, 1);
    transition-delay: calc(var(--kp-h, 0) * 55ms);
  }
  :root.kp-hazir[data-kapanis="a"] footer.alt-bilgi.kp-acik .kp-harf { translate: 0 0; rotate: 0deg; }
  :root.kp-hazir[data-kapanis="a"].kp-perde footer.alt-bilgi .ab-ic {
    scale: calc(.94 + var(--kp-ilerleme, 1) * .06); opacity: calc(.35 + var(--kp-ilerleme, 1) * .65);
    transform-origin: 50% 100%;
  }

  /* B: dev yazı aşağıdan kayarak dolar; ışık arkada yavaş akar; sütunlar yukarı süzülür */
  :root.kp-hazir[data-kapanis="b"] .kp-isaret > span {
    translate: 0 70%; opacity: 0;
    transition: translate 1.2s cubic-bezier(.16, 1, .3, 1) .15s, opacity .8s ease .15s;
  }
  :root.kp-hazir[data-kapanis="b"] footer.alt-bilgi.kp-acik .kp-isaret > span { translate: 0 0; opacity: 1; }
  :root[data-kapanis="b"] footer.alt-bilgi::before { animation: kp-akis 22s ease-in-out infinite alternate; }
  :root.kp-hazir[data-kapanis="b"] footer.alt-bilgi .ab-linkler > a { translate: 0 28px; }
  :root.kp-hazir[data-kapanis="b"] footer.alt-bilgi.kp-acik .ab-linkler > a { translate: 0 0; }
  /* C/D: logo yükselir; D'de mercan çizgi soldan dolar; E'de ışık yavaş akar */
  :root.kp-hazir:is([data-kapanis="c"], [data-kapanis="d"], [data-kapanis="e"]) footer.alt-bilgi .ab-logo img {
    translate: 0 40%; opacity: 0; transition: translate .9s cubic-bezier(.16, 1, .3, 1) .1s, opacity .7s ease .1s;
  }
  :root.kp-hazir:is([data-kapanis="c"], [data-kapanis="d"], [data-kapanis="e"]) footer.alt-bilgi.kp-acik .ab-logo img { translate: 0 0; opacity: 1; }
  :root.kp-hazir[data-kapanis="d"] footer.alt-bilgi::before { --kp-cizgi: 0; transition: scale 1.1s cubic-bezier(.16, 1, .3, 1) .05s; }
  :root.kp-hazir[data-kapanis="d"] footer.alt-bilgi.kp-acik::before { --kp-cizgi: 1; }
  :root.kp-hazir:is([data-kapanis="c"], [data-kapanis="d"]).kp-perde footer.alt-bilgi .ab-ic {
    scale: calc(.95 + var(--kp-ilerleme, 1) * .05); opacity: calc(.4 + var(--kp-ilerleme, 1) * .6); transform-origin: 50% 100%;
  }
  :root[data-kapanis="e"] footer.alt-bilgi::before { animation: kp-akis 24s ease-in-out infinite alternate; }
  :root.kp-hazir[data-kapanis="c"][data-kc="4"] footer.alt-bilgi.kp-acik::after { animation: kp-isilti 1.6s cubic-bezier(.16, 1, .3, 1) .3s both; }
  @keyframes kp-isilti { from { translate: -120% 0; } to { translate: 120% 0; } }
  :root.kp-hazir[data-kapanis="c"][data-kc="2"] footer.alt-bilgi .ab-ic { translate: 0 24px; opacity: 0; transition: translate .9s cubic-bezier(.16, 1, .3, 1), opacity .6s ease; }
  :root.kp-hazir[data-kapanis="c"][data-kc="2"] footer.alt-bilgi.kp-acik .ab-ic { translate: 0 0; opacity: 1; }
  @keyframes kp-akis {
    0% { transform: translate3d(-6%, 4%, 0) rotate(0deg); }
    50% { transform: translate3d(5%, -3%, 0) rotate(8deg); }
    100% { transform: translate3d(-2%, -6%, 0) rotate(-6deg); }
  }
}