/* Vidanya ana sayfa v3 — "Çizgi Yükseliyor". Seçici ön eki: h5- */
:root{
  --h5-paper:#f2efe9; --h5-ink:#0a0a0a; --h5-scream:#ff4d00;
  --h5-rule:rgba(10,10,10,.09);
  --h5-display:'Archivo','Helvetica Neue',Arial,sans-serif;
  --h5-mono:'IBM Plex Mono',ui-monospace,Menlo,monospace;
  --h5-nav-h:56px; --h5-band-h:44px; --h5-pad:40px;
  --h5-ease:cubic-bezier(.2,.8,.2,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--h5-paper);overflow-x:clip}
body{background:var(--h5-paper);color:var(--h5-ink);font-family:var(--h5-display);-webkit-font-smoothing:antialiased;overflow-x:clip}
a{color:inherit;text-decoration:none}
ol,ul{list-style:none}
img{display:block;max-width:100%}
body.is-locked *{transition:none !important}

/* ---------- Üst şerit (zemine göre renk değiştirir) ---------- */
.h5-nav{position:fixed;inset:0 0 auto 0;height:var(--h5-nav-h);z-index:50;display:flex;align-items:center;justify-content:space-between;padding:0 var(--h5-pad);border-bottom:1.5px solid var(--h5-ink);background:var(--h5-paper);color:var(--h5-ink);transition:background-color .35s,color .35s,border-color .35s}
.h5-logo{font-weight:900;font-stretch:80%;font-size:24px;letter-spacing:-.02em;text-transform:uppercase}
.h5-nav-links{display:flex;gap:30px;font:500 11.5px var(--h5-mono);letter-spacing:.14em;text-transform:uppercase}
.h5-nav-links a{position:relative;padding:6px 0}
.h5-nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1.5px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .35s var(--h5-ease)}
.h5-nav-links a:hover::after,.h5-nav-links a:focus-visible::after,.h5-nav-links a[aria-current]::after{transform:scaleX(1)}
.h5-btn{display:inline-flex;align-items:center;gap:10px;height:36px;padding:0 18px;background:var(--h5-ink);color:var(--h5-paper);font:600 12.5px var(--h5-mono);letter-spacing:.08em;text-transform:uppercase;transition:background-color .3s,color .3s,transform .3s var(--h5-ease),box-shadow .3s var(--h5-ease)}
.h5-btn:hover,.h5-btn:focus-visible{transform:translate(-3px,-3px);box-shadow:3px 3px 0 var(--h5-scream);outline:none}
.h5-btn.is-xl{height:64px;padding:0 34px;font-size:15px}
body[data-nav="dark"] .h5-nav{background:var(--h5-ink);color:var(--h5-paper);border-color:rgba(242,239,233,.35)}
body[data-nav="dark"] .h5-nav .h5-btn{background:var(--h5-scream);color:var(--h5-ink)}
body[data-nav="scream"] .h5-nav{background:var(--h5-scream)}
/* Yıl ilerlemesi: menünün alt çizgisinde dolar */
.h5-year{position:absolute;left:0;right:0;bottom:-1.5px;height:3px;background:var(--h5-scream);transform:scaleX(0);transform-origin:left;will-change:transform}

/* ---------- Sabitlenen hikâye ---------- */
.h5-story{height:1000vh;position:relative}
.h5-pin{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
.h5-grid{position:absolute;inset:var(--h5-nav-h) 0 0 0;
  background-image:linear-gradient(90deg,var(--h5-rule) 1px,transparent 1px),linear-gradient(0deg,var(--h5-rule) 1px,transparent 1px);
  background-size:8.3333vw 100%,100% 10vh}
.h5-ghost{position:absolute;right:3vw;bottom:calc(var(--h5-band-h) + 2vh);font-weight:900;font-stretch:62%;font-size:58vh;line-height:.8;letter-spacing:-.04em;color:transparent;-webkit-text-stroke:1.5px rgba(10,10,10,.13);font-variant-numeric:tabular-nums;will-change:transform;pointer-events:none}

.h5-corner{position:absolute;font:500 11px var(--h5-mono);letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.h5-corner.is-tr{right:var(--h5-pad);top:calc(var(--h5-nav-h) + 16px)}
.h5-corner.is-bl{left:var(--h5-pad);bottom:calc(var(--h5-band-h) + 16px)}
.h5-corner.is-br{right:var(--h5-pad);bottom:calc(var(--h5-band-h) + 16px);color:rgba(10,10,10,.6)}
.h5-corner b{font-weight:600;color:var(--h5-scream)}

/* Dev sayaç: açılışta ekranı doldurur, sonra sol üste yanaşır */
.h5-counter-wrap{position:absolute;left:var(--h5-pad);top:calc(var(--h5-nav-h) + 40px);z-index:3}
.h5-kicker{font:500 11.5px var(--h5-mono);letter-spacing:.14em;text-transform:uppercase;margin-bottom:10px;display:flex;gap:14px;align-items:center}
.h5-kicker i{font-style:normal;background:var(--h5-ink);color:var(--h5-paper);padding:3px 8px}
.h5-counter{display:inline-block;font-weight:900;font-stretch:62%;font-size:clamp(64px,8.2vw,150px);line-height:.86;letter-spacing:-.03em;font-variant-numeric:tabular-nums;white-space:nowrap;transform-origin:0 0;will-change:transform}
.h5-counter.is-down{color:var(--h5-scream)}
.h5-trend{margin-top:14px;font:600 11.5px var(--h5-mono);letter-spacing:.14em;text-transform:uppercase}
.h5-trend.is-down{color:var(--h5-scream)}

/* Açılış cümlesi — harf harf maskeden çıkar */
.h5-open{position:absolute;left:var(--h5-pad);bottom:calc(var(--h5-band-h) + 44px);z-index:3;font-weight:800;font-stretch:85%;font-size:clamp(28px,4.2vw,72px);line-height:1;letter-spacing:-.035em}
.h5-open .h5-word{display:inline-block;overflow:hidden;white-space:nowrap;vertical-align:bottom;padding:.14em 0 .12em}
.h5-open .h5-ch{display:inline-block;will-change:transform}
.h5-hint{position:absolute;right:var(--h5-pad);bottom:calc(var(--h5-band-h) + 52px);z-index:3;font:500 11.5px var(--h5-mono);letter-spacing:.16em;text-transform:uppercase}
.h5-hint::after{content:"";display:inline-block;width:42px;height:1.5px;background:var(--h5-ink);margin-left:14px;vertical-align:middle;animation:h5-hint 1.6s steps(4) infinite}
@keyframes h5-hint{from{transform:scaleX(.2);transform-origin:left}to{transform:scaleX(1);transform-origin:left}}

/* Kilometre taşı anlatımı */
.h5-milestones{position:absolute;left:var(--h5-pad);top:46vh;width:min(36vw,560px);z-index:3}
.h5-ms{position:absolute;left:0;top:0;width:100%;opacity:0;transition:opacity .3s linear}
.h5-ms[data-state="active"]{opacity:1}
.h5-ms-meta{display:flex;align-items:center;gap:12px;font:600 12px var(--h5-mono);letter-spacing:.12em;text-transform:uppercase;margin-bottom:18px}
.h5-ms-meta i{font-style:normal;background:var(--h5-scream);color:var(--h5-ink);padding:5px 10px}
.h5-ms-body{overflow:hidden;padding:.14em 0 .1em;margin-top:-.14em}
.h5-ms-body span{display:block;font-weight:800;font-stretch:88%;font-size:clamp(28px,3.8vw,60px);line-height:1.02;letter-spacing:-.035em;transform:translateY(135%);transition:transform .65s var(--h5-ease)}
.h5-ms[data-state="active"] .h5-ms-body span{transform:none}
.h5-ms[data-state="prev"] .h5-ms-body span{transform:translateY(-135%)}
.h5-ms:last-child .h5-ms-body span{font-weight:900;font-stretch:62%;font-size:clamp(44px,6.4vw,110px);color:var(--h5-scream)}
.h5-ms-note{margin-top:16px;font:400 13.5px/1.6 var(--h5-mono);letter-spacing:.01em;color:rgba(10,10,10,.72);max-width:44ch}
.h5-ms-delta{margin-top:14px;font:500 12px var(--h5-mono);letter-spacing:.12em;text-transform:uppercase;color:rgba(10,10,10,.62)}
.h5-ms-delta b{font-weight:600;color:var(--h5-ink)}
.h5-ms-delta.is-down b{color:var(--h5-scream)}

/* Grafik: .h5-chart görüş alanı, .h5-world kameranın gezdiği dünya */
.h5-chart{position:absolute;left:44vw;right:var(--h5-pad);top:calc(var(--h5-nav-h) + 56px);bottom:calc(var(--h5-band-h) + 52px);z-index:2}
.h5-world{position:absolute;left:0;top:0;transform-origin:0 0;will-change:transform;--h5-inv:1}
.h5-svg{display:block;overflow:visible}
.h5-svg text{font:500 10.5px var(--h5-mono);font-size:calc(10.5px * var(--h5-inv));letter-spacing:.08em;fill:rgba(10,10,10,.55)}
.h5-svg .h5-axis-line{stroke:var(--h5-ink);stroke-width:1.5;vector-effect:non-scaling-stroke}
.h5-svg .h5-y-line{stroke:rgba(10,10,10,.22);stroke-width:1;stroke-dasharray:2 5;vector-effect:non-scaling-stroke}
.h5-svg .h5-tick.is-on{fill:var(--h5-ink);font-weight:600}
.h5-line{fill:none;stroke:var(--h5-ink);stroke-width:4;stroke-linejoin:round;stroke-linecap:butt;vector-effect:non-scaling-stroke;transition:stroke .5s}
.h5-chart.is-complete .h5-line{stroke:var(--h5-scream)}
.h5-cross{stroke:var(--h5-scream);stroke-width:1.25;stroke-dasharray:4 4;vector-effect:non-scaling-stroke}
.h5-mark-in{transform:scale(var(--h5-inv))}
.h5-mark rect{transform-box:fill-box;transform-origin:center;vector-effect:non-scaling-stroke}
.h5-mark .h5-sq{fill:var(--h5-paper);stroke:var(--h5-ink);stroke-width:2}
.h5-mark.is-on .h5-sq{fill:var(--h5-scream)}
.h5-mark.is-active .h5-sq{fill:var(--h5-ink)}
.h5-mark .h5-ping{fill:none;stroke:var(--h5-scream);stroke-width:2}
.h5-svg .h5-mark-label{font-weight:600;fill:var(--h5-ink);paint-order:stroke;stroke:var(--h5-paper);stroke-width:5px;opacity:0}
.h5-mark.is-active .h5-mark-label,.h5-chart.is-recap .h5-mark-label{opacity:1}
.h5-chart.is-recap .h5-mark .h5-sq{fill:var(--h5-scream)}
.h5-mark.is-low .h5-mark-label{display:none}
.h5-dot{position:absolute;left:0;top:0;width:18px;height:18px;margin:-9px 0 0 -9px;border-radius:50%;background:var(--h5-scream);border:2.5px solid var(--h5-ink);will-change:transform;z-index:2}
.h5-dot::after{content:"";position:absolute;inset:-2.5px;border-radius:50%;border:2px solid var(--h5-scream);animation:h5-pulse 1.4s ease-out infinite}
@keyframes h5-pulse{from{transform:scale(1);opacity:.9}to{transform:scale(3.4);opacity:0}}
.h5-tip{position:absolute;left:0;top:0;background:var(--h5-ink);color:var(--h5-paper);font:600 12.5px var(--h5-mono);letter-spacing:.06em;padding:7px 10px;white-space:nowrap;will-change:transform;z-index:2}
/* Fareyle okuma (masaüstü): çizilmiş kısımda geçmiş bir ayın cirosu */
.h5-probe{position:absolute;left:0;top:0;bottom:0;width:0;border-left:1.5px solid var(--h5-ink);opacity:0;pointer-events:none;will-change:transform}
.h5-probe span{position:absolute;left:8px;top:0;background:var(--h5-paper);border:1.5px solid var(--h5-ink);font:600 11.5px var(--h5-mono);letter-spacing:.06em;padding:5px 8px;white-space:nowrap}
.h5-probe.is-on{opacity:1}
/* Mobilde sağ kenara sabit Y etiketleri (kamera gezerken de okunur) */
.h5-ylabels{display:none}

/* Kayan tipografi şeritleri */
.h5-marquee{overflow:hidden;white-space:nowrap}
.h5-track{display:inline-block;will-change:transform}
.h5-track span{display:inline-block}
.h5-track em{font-style:normal;color:var(--h5-scream)}
.h5-band{position:absolute;left:0;right:0;bottom:0;height:var(--h5-band-h);z-index:4;background:var(--h5-ink);color:var(--h5-paper);font-weight:800;font-stretch:80%;font-size:18px;line-height:var(--h5-band-h);letter-spacing:.04em}
.h5-wipe{position:absolute;left:0;right:0;top:0;height:30vh;z-index:6;background:var(--h5-ink);color:var(--h5-paper);font-weight:900;font-stretch:62%;font-size:24vh;line-height:30vh;letter-spacing:-.02em;will-change:transform}

/* Doruk: çizginin ucundan büyüyen siyah daire + dev ₺1.000.000 (açılıştaki ₺0'ın simetriği) */
.h5-boom{position:absolute;inset:0;z-index:8;background:var(--h5-ink);color:var(--h5-paper);clip-path:circle(0 at 50% 50%);will-change:clip-path;display:flex;flex-direction:column;justify-content:center;padding:var(--h5-nav-h) var(--h5-pad) 0}
.h5-boom-meta{display:flex;justify-content:space-between;gap:16px;font:600 11.5px var(--h5-mono);letter-spacing:.14em;text-transform:uppercase;color:rgba(242,239,233,.7);margin-bottom:2vh}
.h5-boom-num{font-weight:900;font-stretch:62%;font-size:min(22vw,56vh);line-height:.86;letter-spacing:-.03em;color:var(--h5-scream);white-space:nowrap;font-variant-numeric:tabular-nums}
.h5-boom-line{margin-top:3vh;font-weight:800;font-stretch:88%;font-size:clamp(22px,3vw,48px);letter-spacing:-.03em;line-height:1.05;max-width:20em}
.h5-boom-next{margin-top:4vh;font:600 12px var(--h5-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--h5-scream)}
.h5-row{display:block;overflow:hidden;padding:.16em 0 .06em;margin-top:-.16em}
.h5-row>span{display:block;will-change:transform}

/* ---------- Kaydırmayla beliren ortak parçalar ---------- */
.h5-mask{display:block;overflow:hidden;padding:.16em 0 .08em;margin-top:-.16em}
.h5-mask>span{display:block;transform:translateY(150%);transition:transform .95s var(--h5-ease);transition-delay:calc(var(--i,0) * 90ms)}
.is-in .h5-mask>span,.h5-mask.is-in>span{transform:none}
[data-fade]{opacity:0;transform:translateY(24px);transition:opacity .8s,transform .8s var(--h5-ease);transition-delay:calc(var(--i,0) * 80ms)}
.is-in[data-fade],.is-in [data-fade]{opacity:1;transform:none}

.h5-sec{position:relative;padding:clamp(88px,12vw,180px) var(--h5-pad)}
.h5-sec.is-dark{background:var(--h5-ink);color:var(--h5-paper)}
.h5-sec-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.4fr);gap:24px;align-items:end;margin-bottom:clamp(40px,6vw,96px)}
.h5-sec-kicker{font:600 11.5px var(--h5-mono);letter-spacing:.14em;text-transform:uppercase}
.h5-sec-kicker b{color:var(--h5-scream);font-weight:600}
.h5-sec h2{font-weight:900;font-stretch:62%;font-size:clamp(46px,8.6vw,164px);line-height:.86;letter-spacing:-.035em;text-transform:uppercase}
.h5-sec h2 em{font-style:normal;color:var(--h5-scream)}
.h5-link{display:inline-block;font:600 12px var(--h5-mono);letter-spacing:.14em;text-transform:uppercase;border-bottom:1.5px solid currentColor;padding-bottom:3px}
.h5-link:hover,.h5-link:focus-visible{color:var(--h5-scream);outline:none}

/* Bölüm: çizgiyi ne yükseltti — satır dizini */
.h5-index{border-bottom:1.5px solid rgba(242,239,233,.3)}
.h5-index li{border-top:1.5px solid rgba(242,239,233,.3)}
.h5-index a{display:grid;grid-template-columns:72px minmax(0,1.25fr) minmax(0,1fr) auto;gap:24px;align-items:center;padding:26px 16px;transition:background-color .3s,color .3s,padding .45s var(--h5-ease)}
.h5-index a:hover,.h5-index a:focus-visible{background:var(--h5-scream);color:var(--h5-ink);padding-left:36px;outline:none}
.h5-ri-no{font:600 12px var(--h5-mono);letter-spacing:.12em}
.h5-ri-title{font-weight:900;font-stretch:66%;font-size:clamp(30px,4.6vw,78px);line-height:.92;letter-spacing:-.03em;text-transform:uppercase}
.h5-ri-desc{font:400 13.5px/1.6 var(--h5-mono);letter-spacing:.02em;opacity:.78}
.h5-index a:hover .h5-ri-desc,.h5-index a:focus-visible .h5-ri-desc{opacity:1}
.h5-ri-tag{font:600 11.5px var(--h5-mono);letter-spacing:.12em;text-transform:uppercase;border:1.5px solid currentColor;padding:6px 10px;white-space:nowrap}
.h5-index-foot{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:34px;font:600 12px var(--h5-mono);letter-spacing:.14em;text-transform:uppercase}
.h5-index-foot .h5-link{color:var(--h5-scream)}

/* Bölüm: üç adım */
.h5-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1.5px solid var(--h5-ink);border-bottom:1.5px solid var(--h5-ink)}
.h5-step{padding:34px 28px 44px;border-left:1.5px solid var(--h5-ink)}
.h5-step:first-child{border-left:0;padding-left:0}
.h5-step-no{display:block;font-weight:900;font-stretch:62%;font-size:clamp(84px,11vw,190px);line-height:.8;letter-spacing:-.04em;color:transparent;-webkit-text-stroke:2px var(--h5-ink);transition:color .3s}
.h5-step:hover .h5-step-no{color:var(--h5-scream);-webkit-text-stroke-color:var(--h5-scream)}
.h5-step h3{margin-top:26px;font-weight:800;font-stretch:88%;font-size:clamp(22px,2.2vw,34px);letter-spacing:-.03em;line-height:1.05}
.h5-step p{margin-top:14px;font:400 13.5px/1.65 var(--h5-mono);letter-spacing:.02em;max-width:34ch}

/* Bölüm: fiyat */
.h5-price-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(28px,5vw,88px);align-items:end}
.h5-price{font-weight:900;font-stretch:62%;font-size:clamp(74px,15.5vw,300px);line-height:.8;letter-spacing:-.04em;white-space:nowrap;font-variant-numeric:tabular-nums}
.h5-price small{display:block;margin-top:22px;font:600 13px var(--h5-mono);letter-spacing:.14em;text-transform:uppercase}
.h5-price small b{background:var(--h5-scream);padding:4px 8px;font-weight:600}
.h5-incl{border-top:1.5px solid var(--h5-ink)}
.h5-incl li{display:flex;gap:14px;align-items:baseline;padding:12px 0;border-bottom:1px solid rgba(10,10,10,.2);font:500 13px var(--h5-mono);letter-spacing:.04em;text-transform:uppercase}
.h5-incl li::before{content:"+";color:var(--h5-scream);font-weight:600}
.h5-price-cta{margin-top:34px;display:flex;gap:20px;align-items:center;flex-wrap:wrap}
.h5-price-cta span{font:500 11.5px/1.6 var(--h5-mono);letter-spacing:.1em;text-transform:uppercase;opacity:.7}

/* Bölüm: referans şeridi — mağaza adları dev tipografiyle kayar */
.h5-refs{padding:clamp(72px,9vw,140px) 0;border-top:1.5px solid var(--h5-ink)}
.h5-refs-head{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;padding:0 var(--h5-pad);margin-bottom:clamp(24px,3.4vw,52px)}
.h5-refs-head h2{font-weight:900;font-stretch:62%;font-size:clamp(40px,6.2vw,112px);line-height:.88;letter-spacing:-.035em;text-transform:uppercase}
.h5-refs-head h2 em{font-style:normal;color:var(--h5-scream)}
.h5-refs-marquee{display:block;font-weight:900;font-stretch:62%;font-size:clamp(68px,12vw,220px);line-height:1.02;letter-spacing:-.03em;text-transform:uppercase;border-top:1.5px solid var(--h5-ink);border-bottom:1.5px solid var(--h5-ink);padding:.04em 0}
.h5-refs-marquee .h5-track span:nth-child(even){color:transparent;-webkit-text-stroke:2px var(--h5-ink)}
.h5-refs-marquee:hover .h5-track span:nth-child(even),.h5-refs-marquee:focus-visible .h5-track span:nth-child(even){color:var(--h5-scream);-webkit-text-stroke-color:var(--h5-scream)}

/* Bölüm: kapanış */
.h5-final{position:relative;min-height:100vh;min-height:100svh;background:var(--h5-scream);color:var(--h5-ink);display:flex;flex-direction:column;justify-content:flex-end;padding:calc(14vh + 72px) var(--h5-pad) 56px;overflow:hidden}
.h5-final-band{position:absolute;left:0;right:0;top:0;height:14vh;background:var(--h5-ink);color:var(--h5-scream);font-weight:900;font-stretch:62%;font-size:10vh;line-height:14vh}
.h5-final-band .h5-track em{color:var(--h5-paper)}
.h5-final-meta{display:flex;justify-content:space-between;font:600 11.5px var(--h5-mono);letter-spacing:.14em;text-transform:uppercase;margin-bottom:auto}
.h5-final h2{font-weight:900;font-stretch:62%;font-size:clamp(54px,11.2vw,210px);line-height:.84;letter-spacing:-.035em;text-transform:uppercase;margin-top:6vh}
.h5-final-cta{margin-top:40px;display:flex;align-items:center;gap:32px;flex-wrap:wrap;border-top:1.5px solid var(--h5-ink);padding-top:28px}
.h5-final-cta p{font:500 13px/1.6 var(--h5-mono);letter-spacing:.06em;text-transform:uppercase}
.h5-final-cta p b{font-weight:600}
.h5-final-cta small{font:500 11px var(--h5-mono);letter-spacing:.1em;text-transform:uppercase;margin-left:auto;opacity:.75}
.h5-final .h5-btn:hover,.h5-final .h5-btn:focus-visible{box-shadow:3px 3px 0 var(--h5-paper)}
/* Kapanışta ikinci yol: "önce referanslara bakın" */
.h5-final-refs{display:flex;justify-content:space-between;align-items:center;gap:18px 32px;flex-wrap:wrap;margin-top:26px;padding:22px 0 0;border-top:1.5px solid var(--h5-ink)}
.h5-final-refs p{font-weight:800;font-stretch:88%;font-size:clamp(20px,2.3vw,36px);letter-spacing:-.03em;line-height:1.08}
.h5-final-refs a{display:inline-flex;align-items:center;gap:12px;font:600 13px var(--h5-mono);letter-spacing:.12em;text-transform:uppercase;border:1.5px solid var(--h5-ink);padding:14px 20px;transition:background-color .3s,color .3s}
.h5-final-refs a:hover,.h5-final-refs a:focus-visible{background:var(--h5-ink);color:var(--h5-scream);outline:none}

/* Alt bilgi: dev marka yazısı */
.h5-foot{background:var(--h5-ink);color:var(--h5-paper);padding:56px var(--h5-pad) 28px;overflow:hidden}
.h5-foot-top{display:flex;justify-content:space-between;gap:28px;flex-wrap:wrap;font:500 11.5px var(--h5-mono);letter-spacing:.12em;text-transform:uppercase}
.h5-foot-top nav{display:flex;gap:26px;flex-wrap:wrap}
.h5-foot-top a:hover,.h5-foot-top a:focus-visible{color:var(--h5-scream);outline:none}
.h5-wordmark{display:block;margin:5vw 0 0 -.04em;font-weight:900;font-stretch:62%;font-size:29.5vw;line-height:.74;letter-spacing:-.04em;text-transform:uppercase;white-space:nowrap;color:var(--h5-paper)}
.h5-wordmark em{font-style:normal;color:var(--h5-scream)}
.h5-foot-bottom{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:34px;padding-top:18px;border-top:1.5px solid rgba(242,239,233,.3);font:500 11px var(--h5-mono);letter-spacing:.12em;text-transform:uppercase;color:rgba(242,239,233,.65)}
.h5-foot-bottom b{color:var(--h5-scream);font-weight:600}

/* İmleç eşlikçisi (yalnız fare) */
.h5-cursor{position:fixed;left:0;top:0;z-index:90;width:12px;height:12px;margin:-6px 0 0 -6px;background:var(--h5-scream);border:1.5px solid var(--h5-ink);pointer-events:none;opacity:0;will-change:transform;display:flex;align-items:center;justify-content:center;transition:width .3s var(--h5-ease),height .3s var(--h5-ease),margin .3s var(--h5-ease),border-radius .3s,opacity .2s}
.h5-cursor span{font:600 10px var(--h5-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--h5-ink);opacity:0;white-space:nowrap}
.h5-cursor.is-on{opacity:1}
.h5-cursor.is-big{width:78px;height:78px;margin:-39px 0 0 -39px;border-radius:50%}
.h5-cursor.is-big span{opacity:1}
@media (hover:none),(pointer:coarse){.h5-cursor{display:none}}

/* =====================================================================
   MOBİL — ayrı tasarım: grafik ekranın kahramanı, kamera çizginin ucunu
   izler; anlatım altta siyah bir kartta durur.
   ===================================================================== */
@media (max-width:860px){
  :root{--h5-pad:18px;--h5-band-h:30px;--h5-nav-h:52px;--h5-sheet-h:172px}
  .h5-nav-links,.h5-ghost,.h5-corner,.h5-probe{display:none}
  .h5-logo{font-size:21px}
  .h5-btn{height:34px;padding:0 13px;font-size:11px}
  .h5-story{height:820vh}
  .h5-grid{background-size:20vw 100%,100% 9vh}

  .h5-counter-wrap{top:calc(var(--h5-nav-h) + 14px)}
  .h5-kicker{margin-bottom:6px;font-size:10.5px}
  .h5-counter{font-size:17.2vw}
  .h5-trend{margin-top:8px;font-size:10.5px}

  /* Grafik tam genişlik: sayaç bloğunun altından anlatım kartının üstüne kadar */
  .h5-chart{left:0;right:0;top:calc(var(--h5-nav-h) + 62px + 17.2vw);bottom:calc(var(--h5-band-h) + var(--h5-sheet-h));overflow:hidden;border-top:1.5px solid var(--h5-ink)}
  .h5-svg .h5-mark-label{display:none}
  .h5-line{stroke-width:5}
  .h5-dot{width:22px;height:22px;margin:-11px 0 0 -11px}
  .h5-ylabels{display:block;position:absolute;inset:0;pointer-events:none;z-index:1}
  .h5-ylabels span{position:absolute;right:6px;top:0;margin-top:-9px;background:var(--h5-paper);font:500 9.5px var(--h5-mono);letter-spacing:.08em;padding:2px 4px;color:rgba(10,10,10,.6);will-change:transform}

  /* Anlatım kartı */
  .h5-milestones{left:0;right:0;top:auto;bottom:var(--h5-band-h);width:auto;height:var(--h5-sheet-h);background:var(--h5-ink);color:var(--h5-paper);z-index:5}
  .h5-ms{left:var(--h5-pad);right:var(--h5-pad);top:18px;width:auto}
  .h5-ms-meta{margin-bottom:12px;font-size:10.5px}
  .h5-ms-meta i{padding:4px 8px}
  .h5-ms-body span{font-size:clamp(21px,6.1vw,30px);line-height:1.06}
  .h5-ms:last-child .h5-ms-body span{font-size:15vw}
  .h5-ms-note{display:none}
  .h5-ms-delta{margin-top:10px;font-size:10.5px;color:rgba(242,239,233,.62)}
  .h5-ms-delta b{color:var(--h5-paper)}

  .h5-open{font-size:9.4vw;right:var(--h5-pad);bottom:calc(var(--h5-band-h) + 74px)}
  .h5-hint{right:auto;left:var(--h5-pad);bottom:calc(var(--h5-band-h) + 28px);font-size:10.5px}
  .h5-band{font-size:12px}
  .h5-wipe{height:22vh;font-size:17vh;line-height:22vh}

  .h5-boom{padding-bottom:6vh}
  .h5-boom-meta{flex-direction:column;gap:6px;font-size:10.5px}
  .h5-boom-num{font-size:21.5vw}
  .h5-boom-line{font-size:7vw;margin-top:22px}
  .h5-boom-next{margin-top:26px;font-size:10.5px}

  .h5-sec-head{grid-template-columns:1fr;gap:18px}
  .h5-sec h2{font-size:15.5vw}
  .h5-index a{grid-template-columns:auto 1fr;grid-template-areas:"no tag" "title title" "desc desc";gap:12px 12px;padding:22px 4px}
  .h5-index a:hover,.h5-index a:focus-visible{padding-left:12px}
  .h5-ri-no{grid-area:no}
  .h5-ri-tag{grid-area:tag;justify-self:end;font-size:10px;padding:4px 8px}
  .h5-ri-title{grid-area:title;font-size:11.4vw}
  .h5-ri-desc{grid-area:desc;font-size:12.5px}
  .h5-steps{grid-template-columns:1fr}
  .h5-step,.h5-step:first-child{border-left:0;border-top:1.5px solid var(--h5-ink);padding:26px 0 32px}
  .h5-step:first-child{border-top:0}
  .h5-step-no{font-size:30vw;-webkit-text-stroke-width:1.5px}
  .h5-price-grid{grid-template-columns:1fr}
  .h5-price{font-size:22.5vw}
  .h5-price small{font-size:11px;margin-top:16px}
  .h5-refs-head h2{font-size:13vw}
  .h5-refs-marquee{font-size:21vw}
  .h5-refs-marquee .h5-track span:nth-child(even){-webkit-text-stroke-width:1.5px}
  .h5-final{padding:calc(9vh + 44px) var(--h5-pad) 34px}
  .h5-final-band{height:9vh;font-size:6.4vh;line-height:9vh}
  .h5-final h2{font-size:17.5vw}
  .h5-final-cta{gap:18px;margin-top:26px;padding-top:20px}
  .h5-final-cta small{margin-left:0}
  .h5-final-refs{margin-top:20px;padding-top:18px}
  .h5-final-refs a{width:100%;justify-content:space-between}
  .h5-btn.is-xl{height:54px;padding:0 24px;font-size:13.5px}
  .h5-foot{padding-top:40px}
  .h5-wordmark{font-size:28vw;margin-top:10vw}
}

/* Hareket azaltma: sabitleme yok; bitmiş grafik + altında düz doruk bölümü */
@media (prefers-reduced-motion:reduce){
  .h5-story{height:100vh;height:100svh}
  .h5-wipe,.h5-hint,.h5-open,.h5-cursor{display:none}
  .h5-dot::after,.h5-hint::after{animation:none}
  .h5-boom.is-static{position:relative;inset:auto;min-height:100vh;clip-path:none !important}
  .h5-mask>span,[data-fade]{transform:none !important;opacity:1 !important;transition:none}
}
