/* ==========================================================================
   Alemo Dijital — Hareket Katmanı (v7)
   Tüm hareket yalnızca transform / opacity / filter ile yapılır.
   "prefers-reduced-motion" açıkken tüm döngüler durur, içerik statik görünür.
   JS gerektiren gizli başlangıç durumları yalnızca html.js altında uygulanır.
   ========================================================================== */

:root{
  --m-blue:#304fff; --m-cyan:#12c7e9; --m-violet:#7756ff; --m-ink:#172530; --m-ice:#8ee7f0;
  --m-ease:cubic-bezier(.16,1,.3,1); --m-ease-io:cubic-bezier(.65,0,.35,1);
}

/* 0. Hata düzeltmeleri ------------------------------------------------------ */
/* Mobilde yatay kaydırmayı engelle (yanlardan gelen reveal ofsetleri taşıyordu). */
html,body{overflow-x:clip}
@supports not (overflow:clip){html,body{overflow-x:hidden}}
@media (max-width:800px){
  [data-reveal="left"],[data-reveal="right"]{transform:translateY(22px)}
}
@media print{
  [data-reveal],.split .w{opacity:1!important;transform:none!important;filter:none!important}
  .hero-field,.m-cursor,.hero-art,.footer-marquee,.scroll-cue,.hero-chip{display:none!important}
}
/* JS kapalıysa / yüklenemezse: içerik gizli kalmasın, ön yükleyici takılmasın. */
html:not(.js) .preloader{display:none!important}
html:not(.js) [data-reveal]{opacity:1!important;transform:none!important}
/* JS hata verse bile ön yükleyici 4 sn sonra kendiliğinden kalkar. */
.preloader{animation:preFailsafe .5s ease 4s forwards}
@keyframes preFailsafe{to{opacity:0;visibility:hidden;pointer-events:none}}
/* Tekrar ziyarette ön yükleyiciyi gösterme */
html.no-preload .preloader{display:none!important}

/* 1. Sayfa geçişleri (View Transitions, destekleyen tarayıcılarda) ------------ */
@view-transition{navigation:auto}
::view-transition-old(root){animation:vtOut .32s var(--m-ease-io) both}
::view-transition-new(root){animation:vtIn .55s var(--m-ease) both}
.site-header{view-transition-name:site-header}
@keyframes vtOut{to{opacity:0;transform:translateY(-14px) scale(.99);filter:blur(4px)}}
@keyframes vtIn{from{opacity:0;transform:translateY(22px);filter:blur(6px)}}

/* 2. Kelime kelime başlık açılışı ------------------------------------------- */
.split .w{display:inline-block;will-change:transform,opacity;
  opacity:0;transform:translate3d(0,.6em,0) rotate(3deg);filter:blur(8px);
  transition:opacity .8s var(--m-ease),transform 1s var(--m-ease),filter .8s var(--m-ease);
  transition-delay:calc(var(--wi,0) * 55ms + var(--sd,0ms));transform-origin:0 100%}
.split.is-in .w{opacity:1;transform:none;filter:none}
.split.is-done .w{will-change:auto}

/* 3. Ana sayfa hero ---------------------------------------------------------- */
.hero-v4{position:relative;isolation:isolate}
.hero-v4 .ai-hero__inner{position:relative;z-index:1}
.hero-field{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;opacity:0;transition:opacity 1.2s ease}
.hero-field.is-on{opacity:1}

/* Vurgulu kelime altına el çizimi çizgi */
.hl{position:relative;display:inline-block;white-space:nowrap}
.hl__scribble{position:absolute;left:-2%;right:-2%;bottom:-.14em;width:104%;height:.3em;overflow:visible;pointer-events:none}
.hl__scribble path{fill:none;stroke:var(--m-cyan);stroke-width:5;stroke-linecap:round;
  stroke-dasharray:1;stroke-dashoffset:0;opacity:.85}
html.js .hl__scribble path{stroke-dashoffset:1;transition:stroke-dashoffset 1.1s var(--m-ease) 1.05s}
html.js .split.is-in .hl__scribble path{stroke-dashoffset:0}

/* Vitrin sahnesi + yüzen çipler */
.hero-stage{position:relative;min-width:0}
.hero-stage .hero-showcase{will-change:transform}
.hero-chip{position:absolute;z-index:5;display:flex;align-items:center;gap:11px;padding:11px 15px 11px 12px;
  background:rgba(255,255,255,.86);backdrop-filter:blur(14px) saturate(1.4);-webkit-backdrop-filter:blur(14px) saturate(1.4);
  border:1px solid rgba(23,37,48,.08);border-radius:16px;box-shadow:0 18px 40px -18px rgba(23,37,48,.35),0 2px 6px rgba(23,37,48,.05);
  color:var(--m-ink);pointer-events:none;translate:var(--cx,0) var(--cy,0);transition:translate .5s var(--m-ease)}
.hero-chip b{display:block;font:700 13px/1.2 var(--font-display);letter-spacing:-.01em}
.hero-chip small{display:block;font:500 10.5px/1.3 var(--font-mono);letter-spacing:.04em;color:#61707e;margin-top:3px}
.hero-chip--graph{left:-58px;top:15%;animation:chipBob 6s ease-in-out infinite}
.hero-chip--live{right:-26px;top:40%;animation:chipBob 7s ease-in-out -2s infinite}
.hero-chip--eq{left:14%;bottom:-24px;animation:chipBob 5.4s ease-in-out -1s infinite}
.hero-chip svg{display:block;flex:0 0 auto}
@keyframes chipBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
html.js .hero-chip{opacity:0;scale:.86}
html.js .hero-go .hero-chip{opacity:1;scale:1;transition:opacity .7s var(--m-ease),scale .9s var(--m-ease),translate .5s var(--m-ease)}
html.js .hero-go .hero-chip--graph{transition-delay:.55s,.55s,0s}
html.js .hero-go .hero-chip--live{transition-delay:.75s,.75s,0s}
html.js .hero-go .hero-chip--eq{transition-delay:.95s,.95s,0s}
.chip-line{stroke-dasharray:1;animation:chipDraw 4.8s var(--m-ease-io) infinite}
.chip-area{animation:chipArea 4.8s var(--m-ease-io) infinite}
.chip-dot{transform-box:fill-box;transform-origin:center;animation:chipDot 4.8s ease infinite}
@keyframes chipDraw{0%{stroke-dashoffset:1}45%,85%{stroke-dashoffset:0}100%{stroke-dashoffset:-1}}
@keyframes chipArea{0%,10%{opacity:0}45%,80%{opacity:1}100%{opacity:0}}
@keyframes chipDot{0%,40%{opacity:0;transform:scale(.2)}50%{opacity:1;transform:scale(1.5)}60%,85%{opacity:1;transform:scale(1)}100%{opacity:0}}
.hero-chip__pulse{position:relative;width:12px;height:12px;border-radius:50%;background:#16c784;flex:0 0 auto;margin:0 3px}
.hero-chip__pulse::before,.hero-chip__pulse::after{content:"";position:absolute;inset:0;border-radius:50%;background:#16c784;animation:ripple 2.4s ease-out infinite}
.hero-chip__pulse::after{animation-delay:1.2s}
@keyframes ripple{from{opacity:.55;transform:scale(1)}to{opacity:0;transform:scale(3.2)}}
.eq{display:flex;align-items:flex-end;gap:3px;height:22px}
.eq i{display:block;width:4px;height:100%;border-radius:2px;background:linear-gradient(180deg,var(--m-cyan),var(--m-blue));transform-origin:50% 100%;animation:eq 1.1s ease-in-out infinite}
.eq i:nth-child(2){animation-delay:-.3s;animation-duration:.9s}.eq i:nth-child(3){animation-delay:-.6s;animation-duration:1.3s}
.eq i:nth-child(4){animation-delay:-.15s;animation-duration:1s}.eq i:nth-child(5){animation-delay:-.45s;animation-duration:1.2s}
@keyframes eq{0%,100%{transform:scaleY(.25)}50%{transform:scaleY(1)}}

/* Dönen yazı rozeti */
.hero-v4 .hero-v6__corner.hero-ring{width:92px;height:92px;top:16px;right:16px;border:0;display:block}
.hero-ring svg{width:100%;height:100%;overflow:visible}
.hero-ring text{fill:#fff;font:600 8.2px var(--font-mono)}
.hero-ring__spin{transform-box:view-box;transform-origin:50px 50px;animation:spin 16s linear infinite}
.hero-ring b{position:absolute;inset:0;display:grid;place-items:center;color:#fff;font:700 12px var(--font-mono);letter-spacing:.06em}
.hero-ring b::before{content:"";position:absolute;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.55);background:rgba(255,255,255,.08);backdrop-filter:blur(6px)}
.hero-ring b{isolation:isolate}
.hero-ring b::before{z-index:-1}
@keyframes spin{to{transform:rotate(360deg)}}

/* Kaydırma ipucu */
.scroll-cue{position:absolute;left:50%;bottom:26px;z-index:2;translate:-50% 0;display:flex;flex-direction:column;align-items:center;gap:8px;color:#56687a;text-decoration:none}
.scroll-cue__mouse{width:22px;height:34px;border:1.6px solid currentColor;border-radius:12px;display:flex;justify-content:center;padding-top:6px}
.scroll-cue__mouse i{width:3px;height:7px;border-radius:2px;background:currentColor;animation:cue 1.8s var(--m-ease) infinite}
.scroll-cue__label{font:600 10px var(--font-mono);letter-spacing:.2em;text-transform:uppercase}
.scroll-cue:hover{color:var(--m-blue)}
@keyframes cue{0%{opacity:0;transform:translateY(-3px)}30%{opacity:1}80%,100%{opacity:0;transform:translateY(10px)}}

@media(max-width:1180px){.hero-chip--graph{left:-22px}.hero-chip--live{right:-12px}}
@media(max-width:800px){
  .scroll-cue{display:none}
  .hero-chip--graph{left:10px;top:-26px}
  .hero-chip--live{right:10px;top:auto;bottom:-22px}
  .hero-chip--eq{display:none}
}
@media(max-width:520px){.hero-chip--live{display:none}.hero-chip{padding:9px 12px 9px 10px}.hero-chip svg{width:96px;height:36px}}

/* 4. Sonsuz kayan bantlar ---------------------------------------------------- */
[data-marquee].mq-on>.container{max-width:none;width:100%;display:block;overflow:hidden;padding-inline:0;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.mq-track{display:flex;width:max-content;will-change:transform}
.mq-group{display:flex;align-items:center;flex:0 0 auto}
.ai-capability-strip.mq-on .container{min-height:74px;display:flex;align-items:center}
.ai-capability-strip.mq-on .mq-group span{white-space:nowrap;padding-right:clamp(28px,3vw,46px);font-size:clamp(12px,1vw,14px)}
.ai-capability-strip.mq-on .mq-group span::before,.ai-capability-strip.mq-on .mq-group span+span::before{content:"✦";color:#81def0;margin-right:clamp(16px,2vw,30px);display:inline-block;animation:spin 8s linear infinite}
.ai-capability-strip.mq-on:hover .mq-group span::before{animation-play-state:paused}

.footer-marquee{overflow:hidden;padding:clamp(28px,5vw,64px) 0 0;border-bottom:1px solid rgba(18,19,26,.08)}
.footer-marquee>.container{display:flex;gap:0;white-space:nowrap;overflow:hidden}
.footer-marquee span{display:inline-flex;align-items:center;flex:0 0 auto;padding-right:.35em;
  font:700 clamp(58px,10.5vw,176px)/1.05 var(--font-display);letter-spacing:-.045em;color:#d5dce6;transition:color .45s ease}
.footer-marquee span:nth-child(odd){color:var(--m-ink)}
.footer-marquee span::after{content:"";display:inline-block;width:.3em;height:.3em;margin-left:.35em;border-radius:50%;
  background:conic-gradient(from 0deg,var(--m-blue),var(--m-cyan),var(--m-violet),var(--m-blue));animation:spin 6s linear infinite}
.footer-marquee span:hover{color:var(--m-blue)}

/* 5. Sistem haritası (tanıtım bölümü) --------------------------------------- */
.intro-split{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(28px,4vw,72px);align-items:center;margin-bottom:clamp(44px,6vw,86px)}
.intro-split>.ai-section-head{margin-bottom:0}
.system-map{margin:0;position:relative;aspect-ratio:1;width:100%;max-width:540px;justify-self:center}
.system-map svg{width:100%;height:100%;overflow:visible}
.sm-ring{fill:none;stroke:#cdd6e4;stroke-width:1.2;transform-box:fill-box;transform-origin:center}
.sm-ring--outer{stroke-dasharray:2 9;animation:spin 70s linear infinite}
.sm-ring--inner{stroke-dasharray:14 10;stroke:#dbe2ee;animation:spin 46s linear infinite reverse}
.sm-ring--faint{stroke:#edf1f7;stroke-dasharray:1 7}
.sm-link{fill:none;stroke:url(#smLine);stroke-width:1.8;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0;opacity:.55}
.sm-flow{fill:none;stroke:var(--m-blue);stroke-width:1.4;stroke-dasharray:2 11;opacity:.45;animation:flow 1.6s linear infinite}
@keyframes flow{to{stroke-dashoffset:-26}}
.sm-pulse{fill:var(--m-cyan)}
.sm-sat{fill:var(--m-violet)}
.sm-sat--2{fill:var(--m-cyan)}
.sm-wave{fill:none;stroke:var(--m-blue);stroke-width:1.5;transform-box:fill-box;transform-origin:center;animation:wave 3.2s var(--m-ease) infinite}
.sm-wave--2{animation-delay:1.6s}
@keyframes wave{from{opacity:.55;transform:scale(1)}to{opacity:0;transform:scale(2.3)}}
.sm-core__t{fill:#fff;font:700 17px var(--font-display);letter-spacing:.14em;text-anchor:middle}
.sm-core__s{fill:rgba(255,255,255,.72);font:500 9.5px var(--font-mono);letter-spacing:.16em;text-anchor:middle;text-transform:uppercase}
.sm-node{cursor:default}
.sm-node__in{animation:smBob 6s ease-in-out infinite;animation-delay:calc(var(--i) * -1s)}
.sm-node__bg{fill:#fff;stroke:#dbe3ef;stroke-width:1.2;transition:fill .35s ease,stroke .35s ease}
.sm-node__halo{fill:rgba(48,79,255,.07);transform-box:fill-box;transform-origin:center;animation:halo 4s ease-in-out infinite;animation-delay:calc(var(--i) * -.66s)}
.sm-node text{fill:var(--m-ink);font:600 13.5px var(--font-display);text-anchor:middle;letter-spacing:-.01em;transition:fill .35s ease}
.sm-node:hover .sm-node__bg{fill:var(--m-ink);stroke:var(--m-ink)}
.sm-node:hover text{fill:#fff}
@keyframes smBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes halo{0%,100%{transform:scale(.92);opacity:.6}50%{transform:scale(1.08);opacity:1}}
/* Giriş koreografisi */
html.js .system-map .sm-link{stroke-dashoffset:1;transition:stroke-dashoffset 1.2s var(--m-ease);transition-delay:calc(.35s + var(--i) * .09s)}
html.js .system-map .sm-node{opacity:0;transition:opacity .7s var(--m-ease)}
html.js .system-map .sm-core{opacity:0;transform-box:fill-box;transform-origin:center;transform:scale(.6);transition:opacity .8s var(--m-ease),transform 1s var(--m-ease)}
html.js .system-map.is-in .sm-link{stroke-dashoffset:0}
html.js .system-map.is-in .sm-node{opacity:1}
html.js .system-map.is-in .sm-core{opacity:1;transform:none}
html.js .system-map .sm-node{transition-delay:calc(.5s + var(--i) * .1s)}
@media(max-width:900px){.intro-split{grid-template-columns:1fr}.system-map{max-width:440px}}

/* 6. Yaklaşım bölümü: aurora + canlı illüstrasyonlar ------------------------- */
.studio-principles{position:relative;overflow:hidden;isolation:isolate}
.studio-principles::before,.studio-principles::after{content:"";position:absolute;z-index:-1;width:62vw;height:62vw;max-width:900px;max-height:900px;border-radius:50%;filter:blur(90px);opacity:.35;pointer-events:none}
.studio-principles::before{left:-18%;top:-40%;background:radial-gradient(circle,#304fff 0,transparent 62%);animation:aurora1 22s ease-in-out infinite alternate}
.studio-principles::after{right:-20%;bottom:-45%;background:radial-gradient(circle,#12c7e9 0,transparent 62%);animation:aurora2 26s ease-in-out infinite alternate}
@keyframes aurora1{to{transform:translate(22vw,18vh) scale(1.2)}}
@keyframes aurora2{to{transform:translate(-18vw,-14vh) scale(1.15)}}
.principle-art{height:128px;margin:0 0 26px;position:relative}
.principle-art svg{width:100%;height:100%;overflow:visible}
.studio-principles__item{transition:background .5s ease}
.studio-principles__item:hover{background:linear-gradient(180deg,rgba(255,255,255,.035),transparent)}
.pa-grid{fill:none;stroke:rgba(255,255,255,.16);stroke-width:1}
.pa-blip{fill:var(--m-ice);transform-box:fill-box;transform-origin:center;animation:blip 4s ease-out infinite;animation-delay:var(--d,0s)}
@keyframes blip{0%{opacity:0;transform:scale(.2)}8%{opacity:1;transform:scale(1.6)}20%{transform:scale(1)}70%{opacity:1}100%{opacity:0}}
.pa-route{fill:none;stroke:var(--m-ice);stroke-width:1.6;stroke-dasharray:4 7;opacity:.8;animation:flow 1.4s linear infinite}
.pa-target circle{fill:none;stroke:rgba(255,255,255,.55);stroke-width:1.4}
.pa-target .pa-bull{fill:var(--m-ice);stroke:none;transform-box:fill-box;transform-origin:center;animation:halo 1.8s ease-in-out infinite}
.pa-handle{stroke:rgba(255,255,255,.35);stroke-width:1;stroke-dasharray:3 4}
.pa-curve{fill:none;stroke:url(#paCurve);stroke-width:3;stroke-linecap:round}
.pa-knob{fill:var(--m-ink);stroke:var(--m-ice);stroke-width:2}
.pa-anchor{fill:var(--m-ice)}
.pa-swatch circle{transform-box:fill-box;transform-origin:center;animation:swatch 3s var(--m-ease) infinite;animation-delay:var(--d)}
@keyframes swatch{0%,100%{transform:translateY(0) scale(1)}30%{transform:translateY(-8px) scale(1.12)}60%{transform:translateY(0) scale(1)}}
.pa-base{stroke:rgba(255,255,255,.2);stroke-width:1}
.pa-bars rect{transform-box:fill-box;transform-origin:50% 100%;animation:bar 4.2s var(--m-ease-io) infinite;animation-delay:calc(var(--i) * .12s)}
@keyframes bar{0%,100%{transform:scaleY(.55)}40%,70%{transform:scaleY(1)}}
.pa-trend{fill:none;stroke:#fff;stroke-width:2.4;stroke-linecap:round;stroke-dasharray:1;animation:trend 4.2s linear infinite}
@keyframes trend{0%{stroke-dashoffset:1}80%,94%{stroke-dashoffset:0}100%{stroke-dashoffset:0;opacity:0}}
.pa-runner{fill:var(--m-ice)}
.pa-check circle{fill:rgba(142,231,240,.12);stroke:var(--m-ice);stroke-width:1.6}
.pa-check path{fill:none;stroke:var(--m-ice);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.pa-check{transform-box:fill-box;transform-origin:center;animation:check 4.2s var(--m-ease) infinite}
@keyframes check{0%,74%{opacity:0;transform:scale(.4)}82%{opacity:1;transform:scale(1.15)}88%,96%{opacity:1;transform:scale(1)}100%{opacity:0}}
@media(max-width:800px){.principle-art{height:112px;max-width:420px;margin-bottom:16px}}

/* 7. Süreç çizgisi ------------------------------------------------------------ */
.ai-process-grid[data-process]{position:relative}
.ai-process-grid[data-process]::before{content:"";position:absolute;left:0;right:0;top:-1px;height:2px;z-index:1;
  background:linear-gradient(90deg,var(--m-blue),var(--m-violet),var(--m-cyan));transform-origin:0 50%;transform:scaleX(var(--p,0));transition:transform .15s linear}
.ai-process-grid[data-process] article{position:relative;transition:background .5s ease}
.ai-process-grid[data-process] article::before{content:"";position:absolute;top:-6px;left:24px;width:11px;height:11px;border-radius:50%;
  background:#f5f7f9;border:2px solid #c8d3dc;z-index:2;transition:background .4s ease,border-color .4s ease,box-shadow .4s ease,transform .5s var(--m-ease)}
.ai-process-grid[data-process] article:first-child::before{left:0}
.ai-process-grid[data-process] article>span{transition:color .4s ease,letter-spacing .6s var(--m-ease)}
.ai-process-grid[data-process] article.is-lit::before{background:var(--m-blue);border-color:var(--m-blue);box-shadow:0 0 0 6px rgba(48,79,255,.14);transform:scale(1.15)}
.ai-process-grid[data-process] article.is-lit>span{color:var(--m-blue);letter-spacing:.18em}
.ai-process-grid[data-process] article:hover{background:linear-gradient(180deg,#fff,transparent)}
@media(max-width:800px){.ai-process-grid[data-process]::before,.ai-process-grid[data-process] article::before{display:none}}

/* 8. Editoryal görsel: perde açılışı + paralaks ------------------------------ */
html.js .studio-editorial__visual[data-wipe]{clip-path:inset(10% 14% 10% 14% round 24px);transition:clip-path 1.4s var(--m-ease),opacity .85s var(--m-ease),transform .85s var(--m-ease)}
html.js .studio-editorial__visual[data-wipe].in{clip-path:inset(0 0 0 0 round 24px)}
html.js .studio-editorial__visual img{scale:1.22;translate:0 var(--py,0px);transition:scale 1.8s var(--m-ease)}
html.js .studio-editorial__visual.in img{scale:1.1}
html.js .about-visual figure img{scale:1.1;translate:0 var(--py,0px)}
[data-scramble]{font-variant-numeric:tabular-nums}

/* 9. Işık takibi (spotlight) + CTA ------------------------------------------ */
[data-spotlight]{position:relative;isolation:isolate}
[data-spotlight]>.spot{position:absolute;inset:0;z-index:0;pointer-events:none;border-radius:inherit;opacity:0;transition:opacity .5s ease;
  background:radial-gradient(420px circle at var(--sx,50%) var(--sy,50%),rgba(255,255,255,.16),transparent 60%)}
[data-spotlight]:hover>.spot{opacity:1}
.studio-invite__copy,.studio-invite .motion-control{position:relative;z-index:1}
.cta-band{position:relative;overflow:hidden;isolation:isolate}
.cta-band>*:not(.cta-band__fx):not(.spot){position:relative;z-index:1}
.cta-band__fx{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;border-radius:inherit}
.cta-band__fx i{position:absolute;border-radius:50%;filter:blur(50px);opacity:.55}
.cta-band__fx i:nth-child(1){width:46%;aspect-ratio:1;left:-10%;top:-40%;background:#4f6bff;animation:blob1 14s ease-in-out infinite alternate}
.cta-band__fx i:nth-child(2){width:38%;aspect-ratio:1;right:-8%;bottom:-50%;background:#12c7e9;animation:blob2 17s ease-in-out infinite alternate}
.cta-band__fx i:nth-child(3){width:26%;aspect-ratio:1;left:40%;top:20%;background:#8a5cff;opacity:.4;animation:blob3 12s ease-in-out infinite alternate}
@keyframes blob1{to{transform:translate(40%,35%) scale(1.2)}}
@keyframes blob2{to{transform:translate(-45%,-30%) scale(1.15)}}
@keyframes blob3{to{transform:translate(-60%,30%) scale(.8)}}

/* 10. Kartlar ----------------------------------------------------------------- */
.tilt-active{transition:transform .12s linear!important;will-change:transform}
.tilt-reset{transition:transform .7s var(--m-ease)!important}
html.js .draw-ready svg *{transition:stroke-dashoffset 1.1s var(--m-ease) .25s}
.card .card__link svg,.btn svg.arrow,.btn svg{transition:transform .4s var(--m-ease)}
.card:hover .card__link svg{transform:translateX(5px)}
.post-card .post-card__media img{transition:transform .9s var(--m-ease),filter .9s var(--m-ease)}
.post-card:hover .post-card__media img{transform:scale(1.06)}

/* 11. Başlık: aşağı kaydırınca gizle, yukarıda göster -------------------------- */
.site-header{transition:transform .5s var(--m-ease),background .3s ease,box-shadow .3s ease}
.site-header.is-hidden{transform:translateY(-102%)}
.read-progress{background:linear-gradient(90deg,var(--m-blue),var(--m-violet),var(--m-cyan))!important;height:3px}

/* 12. Özel imleç (yalnız hassas işaretçili masaüstü) ------------------------- */
.m-cursor{position:fixed;left:0;top:0;z-index:10000;pointer-events:none;opacity:0;transition:opacity .3s ease}
.m-cursor.is-on{opacity:1}
.m-cursor__dot,.m-cursor__ring{position:absolute;left:0;top:0;border-radius:50%;translate:-50% -50%}
.m-cursor__dot{width:6px;height:6px;background:var(--m-blue)}
.m-cursor__ring{width:36px;height:36px;border:1.5px solid rgba(48,79,255,.55);display:grid;place-items:center;
  transition:width .35s var(--m-ease),height .35s var(--m-ease),background .35s ease,border-color .35s ease}
.m-cursor__ring span{font:700 11px var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:#fff;opacity:0;transition:opacity .2s ease;white-space:nowrap}
.m-cursor.is-link .m-cursor__ring{width:58px;height:58px;background:rgba(48,79,255,.08);border-color:rgba(48,79,255,.35)}
.m-cursor.is-label .m-cursor__ring{width:92px;height:92px;background:var(--m-ink);border-color:var(--m-ink)}
.m-cursor.is-label .m-cursor__ring span{opacity:1}
.m-cursor.is-label .m-cursor__dot,.m-cursor.is-text .m-cursor__dot{opacity:0}
.m-cursor.is-text .m-cursor__ring{width:4px;height:26px;border-radius:2px;border-color:transparent;background:rgba(48,79,255,.5)}
.m-cursor.is-down .m-cursor__ring{scale:.8}

/* 13. İç sayfa başlık sanatı ------------------------------------------------ */
.page-hero{position:relative;overflow:hidden;isolation:isolate}
.page-hero>.container{position:relative;z-index:1}
.hero-art{position:absolute;right:-150px;top:50%;width:min(640px,54vw);aspect-ratio:1;z-index:0;pointer-events:none;
  translate:var(--hx,0px) calc(-50% + var(--hy,0px));transition:translate .8s var(--m-ease)}
.hero-art svg{width:100%;height:100%;overflow:visible}
.ha-cross{stroke:rgba(23,37,48,.14);stroke-width:1.2}
.ha-ring{fill:none;stroke:rgba(23,37,48,.08);stroke-width:1}
.ha-ring--1{stroke-dasharray:2 8;transform-box:fill-box;transform-origin:center;animation:spin 90s linear infinite}
.ha-arc{fill:none;stroke:url(#haArc);stroke-linecap:round;transform-box:fill-box;transform-origin:center}
.ha-arc--1{stroke-width:2.5;stroke-dasharray:28 72;animation:spin 26s linear infinite}
.ha-arc--2{stroke-width:2;stroke-dasharray:14 86;animation:spin 18s linear infinite reverse;opacity:.8}
.ha-arc--3{stroke-width:1.6;stroke-dasharray:40 60;animation:spin 12s linear infinite;opacity:.6}
.ha-dot{fill:var(--m-blue)}
.ha-core{fill:var(--m-ink);transform-box:fill-box;transform-origin:center;animation:halo 3s ease-in-out infinite}
html.js .hero-art{opacity:0;transition:opacity 1.2s ease .2s,translate .8s var(--m-ease)}
html.js .hero-art.is-in{opacity:1}
@media(max-width:1100px){.hero-art{right:-240px;opacity:.7}}
@media(max-width:700px){.hero-art{display:none}}

/* 14. Duraklatılmış kapsamlar (ekran dışı) ------------------------------------ */
.anim-off,.anim-off *{animation-play-state:paused!important}

/* 15. Azaltılmış hareket ----------------------------------------------------- */
@media (prefers-reduced-motion: reduce){
  .split .w{opacity:1!important;transform:none!important;filter:none!important;transition:none!important}
  .hero-chip,.hero-chip *,.hero-ring__spin,.sm-ring,.sm-flow,.sm-wave,.sm-node__in,.sm-node__halo,.pa-blip,.pa-route,.pa-bull,
  .pa-swatch circle,.pa-bars rect,.pa-trend,.pa-check,.chip-line,.chip-area,.chip-dot,.eq i,.ha-ring,.ha-arc,.ha-core,
  .studio-principles::before,.studio-principles::after,.cta-band__fx i,.footer-marquee span::after,.scroll-cue__mouse i,
  .ai-capability-strip .mq-group span::before,.hero-chip__pulse::before,.hero-chip__pulse::after{animation:none!important}
  .hero-chip{opacity:1!important;scale:1!important}
  .sm-wave,.hero-chip__pulse::before,.hero-chip__pulse::after{opacity:0}
  .pa-trend,.chip-line{stroke-dashoffset:0!important}
  .pa-check,.chip-dot,.chip-area{opacity:1}
  .system-map .sm-link{stroke-dashoffset:0!important}
  .system-map .sm-node,.hero-art{opacity:1!important}
  .system-map .sm-core{opacity:1!important;transform:none!important}
  .hl__scribble path{stroke-dashoffset:0!important}
  .studio-editorial__visual[data-wipe]{clip-path:none!important}
  .studio-editorial__visual img,.about-visual figure img{scale:1!important;translate:none!important}
  .site-header.is-hidden{transform:none}
  .m-cursor,.hero-field{display:none!important}
  ::view-transition-old(root),::view-transition-new(root){animation:none!important}
}

/* 16. Mobil hero butonları tek satırda kalsın (önceden iki satıra kırılıyordu) */
@media(max-width:520px){
  .hero-v4 .ai-hero__actions{flex-direction:column;align-items:stretch}
  .hero-v4 .ai-hero__actions .btn{width:100%;flex:0 0 auto;justify-content:center;white-space:nowrap}
}
