/* Innovex · hero — "Kreatif duvar + performans merceği"
   Kayan reklam kreatifleri; mercek birkaçını ölçer, en iyisini öne çıkarır
   ve yanında performans paneli açılır. Hareketi innovex-hero.js sürüyor. */
.ix-hero{
  --ix-k:#FC2B4A;        /* Innovex mercan kırmızısı */
  --ix-g:#0B0B10;        /* gece zemini */
  --ix-g2:#111117;
  --ix-krem:#F3EDE3;
  --ix-yazi2:rgba(255,255,255,.7);
  --ix-yazi3:rgba(255,255,255,.52);
  --ix-ease:cubic-bezier(.2,.75,.15,1);
}


/* =========================================================
   HERO
   ========================================================= */
.ix-hero *,.ix-hero *::before,.ix-hero *::after{box-sizing:border-box}
.ix-hero{font-family:var(--font);-webkit-font-smoothing:antialiased;position:relative;isolation:isolate;overflow:hidden;background:var(--ix-g);color:#fff;min-height:max(620px,calc(100svh - 80px))}

/* ---- sahne ---- */
.ix-sahne{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.ix-duvar{position:absolute;left:33%;top:-30%;width:84%;height:160%;display:flex;align-items:flex-start;gap:var(--ara,20px);
  transform:perspective(2200px) rotateX(8deg) rotateY(-14deg) rotateZ(-8deg);transform-origin:0 50%;
  opacity:0;transition:opacity 1.8s ease .15s}
.ix-hero.hazir .ix-duvar{opacity:1}
.ix-kol{position:relative;flex:0 0 var(--kol,200px)}
.ix-kol.one{z-index:3}
.ix-iz{will-change:transform}
.ix-set{display:flex;flex-direction:column;gap:var(--ara,20px);padding-bottom:var(--ara,20px)}

/* kreatif karo */
.kt{position:relative;margin:0;border-radius:12px;transition:transform .8s var(--ix-ease),box-shadow .8s var(--ix-ease)}
.kt-ic{position:relative;border-radius:inherit;overflow:hidden;line-height:0}
.kt svg{display:block;width:100%;height:auto;font-family:Inter,system-ui,sans-serif}
.kt.is-kazan{z-index:2;transform:scale(1.07);box-shadow:0 28px 70px -22px rgba(252,43,74,.75),0 0 54px -6px rgba(252,43,74,.42)}

/* ölçüm etiketi (karonun içinde, duvarla birlikte hareket eder) */
.kt-olc{position:absolute;left:8px;top:8px;z-index:2;display:inline-flex;align-items:center;gap:6px;padding:6px 10px 6px 8px;border-radius:999px;background:rgba(11,11,16,.88);color:#fff;font:600 11px/1 Inter,system-ui,sans-serif;letter-spacing:.005em;white-space:nowrap;font-variant-numeric:tabular-nums;box-shadow:0 8px 22px -6px rgba(0,0,0,.55);
  opacity:0;transform:translateY(-5px) scale(.92);transform-origin:0 50%;transition:opacity .35s ease,transform .5s var(--ix-ease),background-color .45s ease}
.kt-olc i{width:6px;height:6px;border-radius:50%;background:var(--ix-k);flex:none;transition:background-color .45s}
.kt.is-olc .kt-olc{opacity:1;transform:none}
.kt.is-kazan .kt-olc{background:var(--ix-k)}
.kt.is-kazan .kt-olc i{background:#fff}

/* logo çipleri: kazanan karonun köşelerinde X'i tamamlar */
.kt-cip{position:absolute;width:14px;height:18px;background:var(--ix-k);clip-path:polygon(0 0,100% 0,0 100%);opacity:0;transform:scale(.3);transition:opacity .35s ease,transform .7s cubic-bezier(.2,.9,.25,1.25)}
.kt-cip.a{top:0;right:-22px;transform-origin:0 0}
.kt-cip.b{bottom:0;left:-22px;transform-origin:0 0}
.kt.is-kazan .kt-cip{opacity:1;transform:none;transition-delay:.3s}

/* karartma (mercek deliği JS ile çizilir) ve metin perdesi */
.ix-golge{position:absolute;inset:0;background:rgba(9,9,13,.74)}
.ix-perde{position:absolute;inset:0;background:
  linear-gradient(90deg,var(--ix-g) 0%,var(--ix-g) 26%,rgba(11,11,16,.9) 38%,rgba(11,11,16,.45) 49%,rgba(11,11,16,0) 60%),
  linear-gradient(0deg,var(--ix-g) 0%,rgba(11,11,16,.8) 9%,rgba(11,11,16,0) 24%),
  linear-gradient(180deg,rgba(11,11,16,.75) 0%,rgba(11,11,16,0) 14%)}

/* mercek imleci */
.ix-mercek{position:absolute;left:0;top:0;width:0;height:0;z-index:2;opacity:0;transition:opacity .5s ease;will-change:transform}
.ix-mercek svg{position:absolute;left:-20px;top:-20px;transition:transform .6s var(--ix-ease),opacity .4s ease}
.ix-mercek.gor{opacity:1}
.ix-mercek.kilit svg{transform:scale(.4);opacity:0}

/* performans paneli */
.ix-panel{position:absolute;left:0;top:0;z-index:3;width:252px;will-change:transform}
.ix-panel-ic{padding:15px 15px 13px;border-radius:16px;background:rgba(22,22,29,.84);-webkit-backdrop-filter:blur(18px) saturate(1.3);backdrop-filter:blur(18px) saturate(1.3);
  box-shadow:0 30px 60px -24px rgba(0,0,0,.8),0 0 40px -12px rgba(252,43,74,.28);
  opacity:0;transform:translateY(10px) scale(.97);transform-origin:0 50%;transition:opacity .4s ease,transform .7s var(--ix-ease)}
.ix-panel.acik .ix-panel-ic{opacity:1;transform:none}
.ix-panel-ic>*{opacity:0;transform:translateY(6px);transition:opacity .4s ease,transform .6s var(--ix-ease)}
.ix-panel.acik .ix-panel-ic>*{opacity:1;transform:none;transition-delay:calc(.1s + var(--i,0)*.08s)}
.ixp-ust{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:11px;font-weight:600}
.ixp-durum{display:inline-flex;align-items:center;gap:7px;color:#fff;white-space:nowrap}
.ixp-durum i{width:7px;height:7px;border-radius:50%;background:var(--ix-k);box-shadow:0 0 0 4px rgba(252,43,74,.2),0 0 12px rgba(252,43,74,.8)}
.ixp-kanal{padding:4px 8px;border-radius:999px;background:rgba(255,255,255,.07);color:var(--ix-yazi3);font-weight:500;white-space:nowrap}
.ixp-ad{margin:11px 0 12px;font-size:15px;line-height:1.25;letter-spacing:-.01em}
.ixp-ad b{font-weight:650}
.ixp-ad span{color:var(--ix-yazi3);font-weight:500}
.ixp-olcu{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.ixp-olcu>div{position:relative;padding:9px 10px 10px;border-radius:10px;background:rgba(255,255,255,.055)}
.ixp-olcu span{display:block;margin-bottom:6px;font-size:10.5px;color:var(--ix-yazi3);white-space:nowrap}
.ixp-olcu strong{font-size:21px;font-weight:650;letter-spacing:-.025em;font-variant-numeric:tabular-nums;font-variation-settings:"opsz" 32}
.ixp-olcu em{position:absolute;right:10px;bottom:11px;font-style:normal;font-size:12px;font-weight:600;color:var(--ix-yazi3)}
.ixp-olcu em.yukari{color:var(--ix-k)}
.ixp-egri{display:block;width:100%;height:44px;margin-top:12px;overflow:visible}
.ixp-egri .cizgi{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.3s var(--ix-ease) .35s}
.ix-panel.acik .ixp-egri .cizgi{stroke-dashoffset:0}
.ixp-oneri{display:flex;align-items:center;gap:8px;margin:10px 0 0;padding-top:10px;font-size:11.5px;color:var(--ix-yazi2);box-shadow:inset 0 1px rgba(255,255,255,.07)}
.ixp-oneri img{height:15px;width:auto;flex:none}

/* ---- içerik ---- */
.ix-kap{position:relative;z-index:4;width:min(1168px,100% - 48px);margin-inline:auto;min-height:inherit;display:grid;grid-template-rows:1fr auto}
.ix-metin{align-self:center;max-width:600px;padding:52px 0 40px}
.ix-ust{display:flex;align-items:center;flex-wrap:wrap;gap:10px 14px;margin:0 0 30px;font-size:13px;font-weight:500;color:var(--ix-yazi3);letter-spacing:.01em}
.ix-ust img{display:block;height:20px;width:auto}
.ix-ust .ayrac{width:1px;height:16px;background:rgba(255,255,255,.22)}
.ix-ust b{color:var(--ix-k);font-weight:600;margin:0 2px}
.ix-baslik{margin:0;font-size:clamp(46px,6.1vw,90px);line-height:.95;font-weight:760;letter-spacing:-.038em;font-variation-settings:"opsz" 32}
.ix-baslik .s{display:block;overflow:hidden;padding:0 .06em .16em 0;margin-bottom:-.16em}
.ix-baslik .s>span{display:block;transform:translateY(110%);transition:transform 1.1s var(--ix-ease)}
.ix-baslik .s:nth-child(2)>span{transition-delay:.07s}
.ix-baslik .s:nth-child(3)>span{transition-delay:.2s}
.ix-baslik .s:nth-child(4)>span{transition-delay:.27s}
.ix-hero.hazir .ix-baslik .s>span{transform:none}
.ix-baslik .k{color:var(--ix-k)}
.ix-ozet,.ix-eylem,.ix-ust,.ix-alt{opacity:0;transform:translateY(12px);transition:opacity .9s ease,transform 1s var(--ix-ease)}
.ix-ust{transition-delay:0s}
.ix-ozet{transition-delay:.38s}
.ix-eylem{transition-delay:.48s}
.ix-alt{transition-delay:.62s}
.ix-hero.hazir .ix-ozet,.ix-hero.hazir .ix-eylem,.ix-hero.hazir .ix-ust,.ix-hero.hazir .ix-alt{opacity:1;transform:none}
.ix-ozet{margin:28px 0 0;max-width:31em;font-size:18px;line-height:1.6;color:var(--ix-yazi2)}
.ix-eylem{display:flex;flex-wrap:wrap;align-items:center;gap:14px 30px;margin-top:36px}
.ix-btn{display:inline-flex;align-items:center;gap:12px;height:54px;padding:0 24px 0 26px;border-radius:12px;background:var(--ix-k);color:#fff;font-size:16px;font-weight:600;text-decoration:none;
  box-shadow:0 14px 36px -14px rgba(252,43,74,.8);transition:box-shadow .3s ease,transform .3s ease,background-color .3s}
.ix-btn:hover{background:#ff3d5a;box-shadow:0 18px 44px -12px rgba(252,43,74,.95);transform:translateY(-1px)}
.ix-btn svg{transition:transform .3s ease}
.ix-btn:hover svg{transform:translate(2px,-2px)}
.ix-link{display:inline-flex;align-items:center;gap:8px;color:#fff;font-size:15.5px;font-weight:500;text-decoration:none;opacity:.82;transition:opacity .25s}
.ix-link:hover{opacity:1}
/* .innovex-page öneki: innovex.css'teki genel "main a" odak halkasını ezer */
.innovex-page .ix-btn:focus-visible,.innovex-page .ix-link:focus-visible{outline:2px solid #fff;outline-offset:4px}

.ix-alt{display:flex;align-items:center;justify-content:space-between;gap:20px 32px;padding:22px 0 30px;box-shadow:inset 0 1px rgba(255,255,255,.09)}
.ix-hizmet{display:flex;flex-wrap:wrap;gap:10px 34px;margin:0;padding:0;list-style:none;font-size:13.5px;color:var(--ix-yazi2)}
/* numaralar kaldırıldı; öğeleri aradaki küçük mercan nokta ayırır */
.ix-hizmet li{position:relative}
.ix-hizmet li+li::before{content:"";position:absolute;left:-19px;top:50%;width:4px;height:4px;border-radius:50%;background:var(--ix-k);transform:translateY(-50%)}
.ix-teknoloji{display:flex;align-items:center;gap:10px;margin:0;font-size:12.5px;color:var(--ix-yazi3);white-space:nowrap}
.ix-teknoloji img{display:block;height:18px;width:auto}

/* ---- tablet ---- */
.ix-hero[data-kip="tablet"] .ix-duvar{left:46%;top:-26%;width:82%;height:152%}
.ix-hero[data-kip="tablet"] .ix-perde{background:
  linear-gradient(90deg,var(--ix-g) 0%,var(--ix-g) 42%,rgba(11,11,16,.86) 51%,rgba(11,11,16,.35) 60%,rgba(11,11,16,0) 68%),
  linear-gradient(0deg,var(--ix-g) 0%,rgba(11,11,16,.8) 9%,rgba(11,11,16,0) 24%),
  linear-gradient(180deg,rgba(11,11,16,.75) 0%,rgba(11,11,16,0) 14%)}
@media (max-width:1099px){
  .ix-metin{max-width:500px}
  .ix-ozet{font-size:17px}
  .ix-hizmet{gap:8px 24px;font-size:13px}
  .ix-hizmet li+li::before{left:-14px}
}

/* ---- mobil ---- */
@media (max-width:699px){
  .ix-hero{min-height:max(600px,calc(100svh - 80px))}
  .ix-kap{width:calc(100% - 32px);grid-template-rows:1fr auto auto}
  .ix-metin{align-self:end;max-width:none;padding:0 0 26px}
  .ix-ust{margin-bottom:20px;font-size:11.5px;gap:8px 10px}
  .ix-ust img{height:16px}
  .ix-baslik{font-size:clamp(40px,12.6vw,56px);line-height:.96}
  .ix-ozet{margin-top:18px;font-size:15.5px;line-height:1.55}
  .ix-ozet .ek{display:none}
  .ix-eylem{margin-top:24px;gap:12px 22px}
  .ix-btn{height:50px;padding:0 20px 0 22px;font-size:15.5px}
  .ix-alt{padding:16px 0 22px}
  .ix-hizmet{display:none}
  .ix-teknoloji{font-size:12px}
  .ix-perde{background:
    linear-gradient(0deg,var(--ix-g) 0%,var(--ix-g) 44%,rgba(11,11,16,.82) 54%,rgba(11,11,16,0) 68%),
    linear-gradient(180deg,rgba(11,11,16,.55) 0%,rgba(11,11,16,0) 12%)}
  .ix-panel{width:156px}
  .ix-panel-ic{padding:11px 12px 10px;border-radius:14px}
  .ixp-ust{font-size:10.5px}
  .ixp-kanal,.ixp-cpa,.ixp-oneri{display:none}
  .ixp-ad{margin:7px 0 6px;font-size:12.5px}
  .ixp-ad span{display:none}
  .ixp-olcu{grid-template-columns:1fr}
  .ixp-olcu>div{padding:0;background:none}
  .ixp-olcu span{margin-bottom:2px;font-size:10px}
  .ixp-olcu strong{font-size:22px}
  .ixp-olcu em{right:0;bottom:4px}
  .ixp-egri{height:22px;margin-top:6px}
  .kt-olc{left:6px;top:6px;padding:5px 8px 5px 6px;font-size:9.5px;gap:5px}
  .kt-olc i{width:5px;height:5px}
  .kt-cip{width:10px;height:13px}
  .kt-cip.a{right:-16px}
  .kt-cip.b{left:-16px}
}
.ix-hero[data-kip="mobil"] .ix-duvar{left:-14%;top:-14%;width:140%;height:120%;transform:perspective(1600px) rotateX(6deg) rotateZ(-8deg);transform-origin:50% 30%}

/* ---- hareket azaltılmış: tek anlamlı kare ---- */
.ix-hero.durgun *,.ix-hero.durgun *::before,.ix-hero.durgun *::after{transition:none!important}
@media (prefers-reduced-motion:reduce){
  .ix-duvar{opacity:1}
  .ix-baslik .s>span,.ix-ozet,.ix-eylem,.ix-ust,.ix-alt{opacity:1;transform:none}
}

/* sitenin ".innovex-page h1" kuralı başlık aralığını eziyordu */
.innovex-page .ix-baslik{letter-spacing:-.038em}

/* reklam platformu logoları (sayfanın her yerinde aynı sprite) */
.innovex-page .pl-ikon{display:inline-block;flex:none;width:1.15em;height:1.15em;vertical-align:-.2em}
.ixp-kanal{display:inline-flex;align-items:center;gap:6px}
.ixp-kanal .pl-ikon{width:12px;height:12px}
