/* kapilar: dört ürün kapısı. Masaüstünde sticky + yatay şerit, mobil/azaltılmış harekette dikey liste. */
.kapilar{position:relative;background:var(--taban)}
.kapilar .kp-sahne{position:relative}
.kapilar .kp-serit{display:block}
.kapilar .ilerleme{display:none}

.kapi{position:relative;height:90svh;min-height:520px;overflow:hidden;background:var(--taban);isolation:isolate}
.kapi+.kapi{border-top:1px solid var(--cizgi)}

/* fotoğraf katmanı (SVG izleri ve sayaç aynı kutuda) */
.kp-katman{position:absolute;inset:0;transform-origin:50% 50%;will-change:transform}
.kp-katman .kp-foto{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.kp-katman svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.kp-golge{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
   linear-gradient(90deg,rgba(5,9,16,.82) 0,rgba(5,9,16,.45) 38%,transparent 70%),
   linear-gradient(0deg,rgba(5,9,16,.85) 0,transparent 42%),
   radial-gradient(120% 90% at 50% 45%,transparent 55%,rgba(5,9,16,.65) 100%)}

/* dev kontur numara */
.kp-no{position:absolute;z-index:2;left:calc(var(--kenar) - .04em);bottom:-.28em;font-weight:700;font-size:22vw;line-height:.8;
  letter-spacing:-.02em;color:transparent;-webkit-text-stroke:2px rgba(255,255,255,.2);pointer-events:none;user-select:none;
  font-variant-numeric:tabular-nums}

.kp-metin{position:absolute;z-index:3;left:var(--kenar);bottom:clamp(40px,12svh,120px);max-width:min(720px,calc(100% - 2*var(--kenar)));
  display:grid;gap:clamp(12px,1.8svh,20px);justify-items:start;pointer-events:none}
.kp-metin a{pointer-events:auto}
.kp-metin .buyuk{font-size:clamp(40px,6.4vw,96px);text-shadow:0 2px 40px rgba(0,0,0,.6)}
.kp-slogan{font-weight:600;font-size:clamp(14px,1.5vw,20px);letter-spacing:.1em;text-transform:uppercase;line-height:1.35;color:var(--metin-9);max-width:30ch}
.kp-alt{list-style:none;display:flex;flex-wrap:wrap;gap:6px 0;font-size:clamp(13px,1.1vw,16px);font-weight:500;letter-spacing:.04em;color:var(--metin-7);text-shadow:0 1px 12px rgba(0,0,0,.8)}
.kp-alt li:not(:last-child)::after{content:"";display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--kirmizi);margin:0 12px;vertical-align:middle;position:relative;top:-1px}
.kp-metin .btn{margin-top:6px}

/* kapı 2: rulet işaretçisi */
.cark-halka{stroke:rgba(255,255,255,.34);stroke-width:2.2}
.cark-halka--ince{stroke:rgba(254,17,1,.55);stroke-width:1.4;stroke-dasharray:3 14}
.cark-top{fill:#fff;filter:drop-shadow(0 0 5px rgba(255,255,255,.9))}

/* kapı 3: canlı yayın */
.yayin{position:absolute;z-index:3;left:var(--kenar);top:calc(var(--ust-h) + 22px);display:flex;align-items:center;gap:12px;
  font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.yayin b{font-weight:700;letter-spacing:.2em}
.yayin-nokta{width:10px;height:10px;border-radius:50%;background:var(--kirmizi);box-shadow:var(--kirmizi-glow);animation:yayin-yan 1.3s ease-in-out infinite}
.yayin-saat{font-variant-numeric:tabular-nums;color:var(--metin-9);padding-left:12px;border-left:1px solid var(--cizgi)}
.yayin-tr{color:var(--metin-6);font-weight:500}
@keyframes yayin-yan{0%,55%{opacity:1}70%,100%{opacity:.18}}

/* kapı 4: kalkış izi + sayaç. Katman görselin kendi 3:2 oranında: SVG ile piksel piksel örtüşür. */
.kapi--kalkis .kp-katman{--kw:min(112vw,177svh);width:var(--kw);height:calc(var(--kw)/1.5);inset:auto;
  left:calc(50% - var(--kw)/2);top:calc((90svh - var(--kw)/1.5)*.12)}
.kapi--kalkis .kp-katman .kp-foto{-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.kapi--kalkis .kp-metin{bottom:auto;top:calc(var(--ust-h) + 44px)}
.kapi--kalkis .kp-no{z-index:0}
.kapi--kalkis .kp-katman{z-index:2}
.kapi--kalkis .kp-golge{background:
   linear-gradient(90deg,rgba(5,9,16,.7) 0,transparent 55%),
   linear-gradient(0deg,rgba(5,9,16,.6) 0,transparent 30%)}
.iz-p{fill:none;stroke-linecap:round;stroke-dasharray:1000;stroke-dashoffset:1000}
.iz-p--glow{stroke:rgba(254,17,1,.16);stroke-width:30}
.iz-p--orta{stroke:rgba(254,17,1,.45);stroke-width:9}
.iz-p--cekirdek{stroke:#ff6a58;stroke-width:3.2}
.iz-hale{fill:rgba(254,17,1,.35)}
.iz-nokta{fill:#fff;filter:drop-shadow(0 0 8px #FE1101) drop-shadow(0 0 3px #fff)}
.iz-hale,.iz-nokta{transform-box:fill-box;transform-origin:center}
.iz.patladi .iz-hale{animation:iz-patla .7s ease-out forwards}
.iz.patladi .iz-nokta{animation:iz-sondu .5s ease-out forwards}
@keyframes iz-patla{0%{transform:scale(1);opacity:1;fill:rgba(255,255,255,.9)}100%{transform:scale(4.2);opacity:0}}
@keyframes iz-sondu{to{transform:scale(.2);opacity:0}}

.sayac{position:absolute;left:0;top:0;z-index:3;display:grid;justify-items:start;gap:6px;pointer-events:none;will-change:transform}
.sayac[hidden]{display:none}
.sayac-sayi{font-weight:700;font-size:clamp(52px,8.4vw,128px);line-height:.9;letter-spacing:-.02em;font-variant-numeric:tabular-nums;
  color:#fff;text-shadow:0 0 40px rgba(254,17,1,.35);transition:color .15s}
.sayac.uctu .sayac-sayi{color:var(--kirmizi);text-shadow:var(--kirmizi-glow)}
.sayac-durum{display:grid;justify-items:start;gap:2px;min-height:2.6em;font-size:clamp(12px,1.2vw,16px);font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.sayac-uctu{color:var(--kirmizi)}
.sayac-cekildi{color:#fff}
.sayac-cekildi:not(:empty)::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--basari);margin-right:8px}
.cek{pointer-events:auto;min-width:132px;background:var(--k3);box-shadow:inset 0 0 0 1px rgba(255,255,255,.55);text-shadow:0 1px 8px rgba(0,0,0,.6)}
.cek[disabled]{opacity:.35;pointer-events:none}
.kapi--kalkis{cursor:pointer}
.kapi--kalkis .btn{cursor:pointer}
.demo-et{position:absolute;z-index:3;right:var(--kenar);bottom:18px;font-size:11px;letter-spacing:.06em;color:var(--metin-5);display:flex;gap:8px;align-items:center;pointer-events:none}
.demo-et span{font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--metin-9);border:1px solid var(--cizgi);border-radius:var(--r);padding:2px 8px}
.kapi.sars{animation:kapi-sars .45s linear}
@keyframes kapi-sars{0%,100%{transform:none}15%{transform:translate(-9px,3px)}30%{transform:translate(8px,-4px)}45%{transform:translate(-6px,2px)}60%{transform:translate(5px,-2px)}80%{transform:translate(-2px,1px)}}

/* azaltılmış hareket: sayaç/etkileşim yok, iz tam çizili */
@media (prefers-reduced-motion:reduce){
  .iz-p{stroke-dashoffset:0}
  .iz-hale{display:none}
  .sayac,.demo-et{display:none}
  .yayin-nokta{animation:none}
  .kapi--kalkis{cursor:auto}
}

/* masaüstü: yatay sabitlenmiş kaydırma */
@media (min-width:821px) and (prefers-reduced-motion:no-preference){
  .kapilar{height:calc(var(--n)*100svh)}
  .kapilar .kp-sahne{position:sticky;top:0;height:100svh;overflow:clip}
  .kapilar .kp-serit{display:flex;width:calc(var(--n)*100%);height:100%;will-change:transform}
  .kapi{flex:0 0 calc(100%/var(--n));height:100%;min-height:0}
  .kapi+.kapi{border-top:0}
  .kp-katman{left:calc(var(--amp,10vw)*-1);right:calc(var(--amp,10vw)*-1);inset-block:0}
  .kapi--kalkis .kp-katman{inset-block:auto;right:auto;left:calc(50% - var(--kw)/2);top:calc((100svh - var(--kw)/1.5)*.12)}
  .ilerleme{display:flex;align-items:center;gap:16px;position:absolute;z-index:6;right:var(--kenar);top:calc(var(--ust-h) + 22px);
    font-size:13px;font-weight:600;letter-spacing:.14em;color:var(--metin-6);font-variant-numeric:tabular-nums}
  .ilerleme-su{color:#fff;font-weight:700}
  .ilerleme-cizgi{position:relative;width:120px;height:2px;background:var(--cizgi);overflow:hidden}
  .ilerleme-cizgi i{position:absolute;inset:0;background:var(--kirmizi);box-shadow:var(--kirmizi-glow);transform-origin:0 50%;transform:scaleX(0)}
  .demo-et{bottom:28px}
}

/* mobil: dikey liste, fotoğraf görünür oldukça hafif ölçeklenir */
@media (max-width:820px){
  .kapi{height:90svh;min-height:560px}
  .kp-metin .buyuk{font-size:clamp(44px,13.5vw,64px)}
  .kapi--spor .kp-foto{object-position:74% 50%}
  .kp-no{font-size:34vw;-webkit-text-stroke-width:1.6px}
  .kp-metin{bottom:clamp(28px,7svh,64px)}
  .kp-golge{background:linear-gradient(0deg,rgba(5,9,16,.95) 0,rgba(5,9,16,.6) 36%,transparent 70%),radial-gradient(120% 90% at 50% 40%,transparent 55%,rgba(5,9,16,.6) 100%)}
  .yayin{top:22px;font-size:12px;gap:9px;flex-wrap:wrap}
  .kapi--kalkis{height:104svh;min-height:680px}
  .kapi--kalkis .kp-katman{--kw:150vw;left:calc(50% - var(--kw)/2 + 3vw);top:auto;bottom:0}
  .kapi--kalkis .kp-katman .kp-foto{-webkit-mask-image:linear-gradient(0deg,#000 80%,transparent),linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
    -webkit-mask-composite:source-in;mask-image:linear-gradient(0deg,#000 80%,transparent),linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-composite:intersect}
  .kapi--kalkis .kp-metin{top:28px}
  .kapi--kalkis .kp-golge{background:linear-gradient(180deg,rgba(5,9,16,.8) 0,transparent 40%)}
  .sayac-sayi{font-size:clamp(44px,15vw,72px)}
  .demo-et{left:var(--kenar);right:var(--kenar);bottom:12px;font-size:10px}
}