/*
 * NEROTEX · hareket ve görselleştirme (dalga 2, 13 Eki 2026).
 * Kurallar: yalnız transform/opacity (çizgi çizimi için stroke-dashoffset), düzen kayması yok, LCP görseline JS dokunmaz.
 * Gizli başlangıç durumları yalnız JS'in eklediği sınıflarla: .nx-rv (kayarak belirme), .is-hazir (oynamaya hazır), .is-oyna.
 * prefers-reduced-motion: reduce → her şey durağan (dosyanın sonu). Süre/eğri tokenları theme.json → custom.hareket.
 */
:root {
	--hz-kisa: var(--wp--custom--hareket--kisa, 220ms);
	--hz-orta: var(--wp--custom--hareket--orta, 480ms);
	--hz-uzun: var(--wp--custom--hareket--uzun, 900ms);
	--hz-cizim: var(--wp--custom--hareket--cizim, 1100ms);
	--hz-kademe: var(--wp--custom--hareket--kademe, 70ms);
	--hz-kayma: var(--wp--custom--hareket--kayma, 18px);
	--hz-egri: var(--wp--custom--hareket--egri, cubic-bezier(.2, .8, .2, 1));
	--hz-cikis: var(--wp--custom--hareket--cikis, cubic-bezier(.16, 1, .3, 1));
	--hz-yay: var(--wp--custom--hareket--yay, cubic-bezier(.34, 1.56, .64, 1));
	--hz-tur: var(--wp--custom--hareket--tambur-tur, 26s);
	--hz-iplik: var(--wp--custom--hareket--iplik, 1.6px);
}

@keyframes nx-don { to { transform: rotate(360deg); } }
@keyframes nx-ciz { to { stroke-dashoffset: 0; } }
@keyframes nx-belir { from { opacity: 0; } to { opacity: 1; } }

/* ---------- Kayarak belirme (JS yalnız ekranın altındakilere .nx-rv ekler) ---------- */
.nx-rv { opacity: 0; transform: translate3d(0, var(--hz-kayma), 0); transition: opacity var(--hz-orta) var(--hz-cikis), transform var(--hz-uzun) var(--hz-cikis); transition-delay: calc(var(--nx-kademe, 0) * var(--hz-kademe)); }
.nx-rv.is-in { opacity: 1; transform: none; }
@media print { .nx-rv { opacity: 1 !important; transform: none !important; } }

/* ---------- Logo: kulaklar (yüklenince bir kez, üzerine gelince bir kez) ---------- */
.nx-logo-svg { display: block; height: var(--wp--custom--olcu--36); width: auto; overflow: visible; }
@media (min-width: 768px) { .nx-head .nx-logo-svg { height: var(--wp--custom--olcu--40); } }
.nx-logo-svg .nx-kulak { transform-box: fill-box; }
.nx-logo-svg .nx-kulak-sol { transform-origin: 85% 90%; }
.nx-logo-svg .nx-kulak-sag { transform-origin: 15% 90%; }
@keyframes nx-kulak-sol-a { 0%, 100% { transform: none; } 22% { transform: rotate(-16deg); } 44% { transform: rotate(7deg); } 66% { transform: rotate(-4deg); } 84% { transform: rotate(1.5deg); } }
@keyframes nx-kulak-sol-b { 0%, 100% { transform: none; } 22% { transform: rotate(-16deg); } 44% { transform: rotate(7deg); } 66% { transform: rotate(-4deg); } 84% { transform: rotate(1.5deg); } }
@keyframes nx-kulak-sag-a { 0%, 100% { transform: none; } 22% { transform: rotate(16deg); } 44% { transform: rotate(-7deg); } 66% { transform: rotate(4deg); } 84% { transform: rotate(-1.5deg); } }
@keyframes nx-kulak-sag-b { 0%, 100% { transform: none; } 22% { transform: rotate(16deg); } 44% { transform: rotate(-7deg); } 66% { transform: rotate(4deg); } 84% { transform: rotate(-1.5deg); } }

/* ---------- İplik ayracı ---------- */
.nx-iplik { display: flex; align-items: flex-start; height: var(--wp--custom--olcu--40); max-width: var(--maxw); margin: 0 auto !important; padding-inline: var(--gutter); color: var(--c-accent); pointer-events: none; }
.wp-site-blocks .nx-iplik { margin-block: 0 !important; }
.nx-iplik svg { display: block; overflow: visible; fill: none; stroke: currentColor; stroke-width: var(--hz-iplik); stroke-linecap: round; stroke-linejoin: round; }
.nx-iplik-a, .nx-iplik-c { flex: 1 1 0; min-width: 0; height: var(--wp--custom--olcu--24); margin-top: 14px; }
.nx-iplik-b { flex: none; width: 56px; height: var(--wp--custom--olcu--40); }
.nx-iplik-igne { flex: none; width: var(--wp--custom--olcu--40); height: 12px; margin-top: 20px; margin-left: -2px; fill: var(--c-ink) !important; stroke: none !important; }
.nx-iplik.is-hazir path[pathLength] { stroke-dasharray: 1; stroke-dashoffset: 1; }
.nx-iplik.is-hazir .nx-iplik-igne { opacity: 0; transform: translate3d(-24px, 0, 0); }
.nx-iplik.is-oyna .nx-iplik-a path { animation: nx-ciz .7s cubic-bezier(.5, 0, .7, 1) forwards; }
.nx-iplik.is-oyna .nx-iplik-b path { animation: nx-ciz .45s linear .68s forwards; }
.nx-iplik.is-oyna .nx-iplik-c path { animation: nx-ciz .75s var(--hz-cikis) 1.1s forwards; }
.nx-iplik.is-oyna .nx-iplik-igne { animation: nx-igne-it .9s var(--hz-cikis) .95s both; }
@keyframes nx-igne-it { 0% { opacity: 0; transform: translate3d(-24px, 0, 0); } 45% { opacity: 1; transform: translate3d(4px, 0, 0); } 70% { transform: translate3d(-2px, 0, 0); } 100% { opacity: 1; transform: none; } }

/* ---------- Açılış: Ken Burns, balon (yay), 30° mührü ---------- */
.nx-stamp-tur { position: absolute; inset: 0; display: block; border-radius: 50%; overflow: hidden; }
.nx-stamp-ring { transform-origin: 50% 50%; }
@media (prefers-reduced-motion: no-preference) {
	.nx-hero-main img { animation: nx-kenburns 16s var(--hz-cikis) both; transform-origin: 55% 60%; }
	.nx-balon { animation: nx-balon-yay .85s var(--hz-egri) .45s both; transform-origin: 14% 120%; }
	.nx-stamp { animation: nx-muhur-gir 1s var(--hz-egri) .8s both; }
	.nx-stamp-ring { animation: nx-don var(--hz-tur) linear infinite; will-change: transform; }
	.nx-stamp.is-sikma .nx-stamp-tur { animation: nx-sikma 1.7s cubic-bezier(.5, 0, .25, 1); }
	.nx-logo-svg .nx-kulak-sol { animation: nx-kulak-sol-a .75s ease-in-out .9s 1 both; }
	.nx-logo-svg .nx-kulak-sag { animation: nx-kulak-sag-a .75s ease-in-out .96s 1 both; }
	.nx-logo:hover .nx-logo-svg .nx-kulak-sol, .nx-logo:focus-visible .nx-logo-svg .nx-kulak-sol { animation: nx-kulak-sol-b .7s ease-in-out 1 both; }
	.nx-logo:hover .nx-logo-svg .nx-kulak-sag, .nx-logo:focus-visible .nx-logo-svg .nx-kulak-sag { animation: nx-kulak-sag-b .7s ease-in-out .05s 1 both; }
}
@keyframes nx-kenburns { from { transform: scale(1.07); } to { transform: none; } }
@keyframes nx-balon-yay { 0% { opacity: 0; transform: translate3d(0, 12px, 0) scale(.55); } 50% { opacity: 1; transform: scale(1.08); } 70% { transform: scale(.96); } 85% { transform: scale(1.02); } 100% { opacity: 1; transform: none; } }
@keyframes nx-muhur-gir { 0% { opacity: 0; transform: rotate(-150deg) scale(.45); } 65% { opacity: 1; transform: rotate(10deg) scale(1.06); } 82% { transform: rotate(-4deg) scale(.98); } 100% { opacity: 1; transform: none; } }
/* Sıkma: hızlanır, yavaşlar, küçük bir sallanmayla durur (merkez yazı dik kalır). */
@keyframes nx-sikma { 0% { transform: none; } 72% { transform: rotate(705deg); } 82% { transform: rotate(728deg); } 90% { transform: rotate(716deg); } 96% { transform: rotate(722deg); } 100% { transform: rotate(720deg); } }
.nx-stamp { cursor: default; -webkit-tap-highlight-color: transparent; }

/* ---------- Sayaç (kanıt satırı) ---------- */
.nx-say { font-variant-numeric: tabular-nums lining-nums; }
.nx-say.is-say { display: inline-block; text-align: right; white-space: nowrap; }

/* ---------- Çizgi ikonları (güven şeridi, ürün güvenceleri) ---------- */
.nx-ci { overflow: visible; }
.nx-ci .i { stroke: var(--c-accent); }
.nx-trustbar .nx-ci { width: var(--wp--custom--olcu--22); height: var(--wp--custom--olcu--22); }
.nx-ci .ci-don { transform-box: view-box; transform-origin: 12px 14.2px; }
.nx-ci .ci-igne { transform-box: view-box; transform-origin: 16px 10px; }
.nx-ci .ci-kutu { transform-box: view-box; transform-origin: 12px 20px; }
.nx-ci .ci-hiz { opacity: 0; }
.nx-ci .ci-tik { stroke-dasharray: 1; stroke-dashoffset: 0; }
.nx-ci .ci-nokta { transform-box: fill-box; transform-origin: center; }
.is-hazir:not(.is-oyna) > .nx-ci .ci-dikis path, .is-hazir:not(.is-oyna) .ic .nx-ci .ci-dikis path { opacity: 0; }
.is-hazir:not(.is-oyna) .nx-ci .ci-tik { stroke-dashoffset: 1; }
.is-oyna .nx-ci .ci-don { animation: nx-don 1.3s var(--hz-egri) .1s 1; }
.is-oyna .nx-ci .ci-igne { animation: nx-ci-igne .9s ease-in-out .1s 1; }
.is-oyna .nx-ci .ci-dikis .d1 { animation: nx-belir .25s ease-out .35s both; }
.is-oyna .nx-ci .ci-dikis .d2 { animation: nx-belir .25s ease-out .75s both; }
.is-oyna .nx-ci .ci-kutu { animation: nx-ci-zipla .8s var(--hz-egri) .1s 1; }
.is-oyna .nx-ci .ci-hiz { animation: nx-ci-hiz .8s ease-out .1s 1; }
.is-oyna .nx-ci .ci-ok { animation: nx-ci-geri .9s var(--hz-egri) .1s 1; }
.is-oyna .nx-ci .ci-tik { animation: nx-ciz .5s ease-out .2s both; stroke-dashoffset: 1; }
.is-oyna .nx-ci .ci-nokta { animation: nx-ci-pop .6s var(--hz-yay) .1s 1; }
@keyframes nx-ci-igne { 0%, 100% { transform: none; } 25%, 65% { transform: translate(-1.4px, 2.6px); } 45%, 85% { transform: none; } }
@keyframes nx-ci-zipla { 0%, 100% { transform: none; } 35% { transform: translateY(-2.6px) rotate(-4deg); } 60% { transform: translateY(.4px) scaleY(.94); } }
@keyframes nx-ci-hiz { 0% { opacity: 0; transform: translateX(3px); } 40% { opacity: 1; } 100% { opacity: 0; transform: translateX(-2px); } }
@keyframes nx-ci-geri { 0%, 100% { transform: none; } 35% { transform: translateX(-2.4px); } 65% { transform: translateX(1px); } }
@keyframes nx-ci-pop { 0%, 100% { transform: none; } 45% { transform: scale(1.5); } }
/* Ürün rozetindeki mini tambur: yavaş, sürekli döner. */
@media (prefers-reduced-motion: no-preference) { .nx-ci-surekli .ci-don { animation: nx-don 5s linear infinite; } }

/* ---------- Yıkama günü: üç küçük hikâye ---------- */
.nx-wash-akis { position: relative; }
.nx-wash-steps li { position: relative; z-index: 1; cursor: default; }
.nx-wash.is-hazir .nx-wash-steps li { cursor: pointer; }
.nx-wash-ic { flex: none; width: var(--wp--custom--olcu--124); height: auto; aspect-ratio: 5 / 4; padding: 0; margin: 0; border: 0; background: none; color: var(--c-forest); cursor: pointer; border-radius: var(--wp--custom--yaricap--12); -webkit-tap-highlight-color: transparent; }
.nx-wash-ic svg { display: block; width: 100%; height: 100%; overflow: visible; }
.nx-wash-ic .nx-cizim .i { stroke: var(--c-accent); }
@media (min-width: 768px) { .nx-wash-ic { width: var(--wp--custom--olcu--200); } }
.nx-wash-iplik { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 2; overflow: visible; pointer-events: none; fill: none; stroke: var(--c-accent); stroke-width: 1.8; stroke-linecap: round; }
.nx-wash-iplik path { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset .6s cubic-bezier(.5, 0, .3, 1); }
.nx-wash-iplik path.is-ciz { stroke-dashoffset: 0; }
.nx-wash-son { display: flex; align-items: center; gap: var(--wp--custom--bosluk--10); }
.nx-wash-balon { position: relative; display: inline-block; background: var(--c-surface); color: var(--c-forest); border-radius: var(--wp--custom--yaricap--18); padding: var(--wp--custom--bosluk--10) var(--wp--custom--bosluk--16) var(--wp--custom--bosluk--12); box-shadow: var(--sh-1); transform-origin: 18% 130%; }
.nx-wash-balon::after { content: ""; position: absolute; left: var(--wp--custom--bosluk--22); bottom: -7px; width: 16px; height: 16px; background: inherit; transform: rotate(45deg) skew(8deg, 8deg); border-radius: 0 0 var(--wp--custom--yaricap--4) 0; }
.nx-wash-son .nx-pati { width: var(--wp--custom--olcu--28); height: var(--wp--custom--olcu--28); color: var(--c-accent); transform: rotate(-14deg); flex: none; }

/* Sahne 1 — Silkele: yuva sallanır, tüyler uçup yere iner. */
.nx-wash-ic .s1-yuva { transform-box: view-box; transform-origin: 62px 84px; }
.nx-wash-ic .s1-tuy path { transform-box: view-box; }
.nx-wash.is-hazir li:not(.is-oyna) .s1-tuy path, .nx-wash.is-hazir li:not(.is-oyna) .s1-hiz { opacity: 0; }
.nx-wash li.is-oyna .s1-yuva { animation: nx-s1-salla 1.3s ease-in-out both; }
.nx-wash li.is-oyna .s1-hiz { animation: nx-s1-hiz 1.3s ease-out both; }
.nx-wash li.is-oyna .s1-tuy .t1 { animation: nx-s1-t1 1.5s ease-out .25s both; }
.nx-wash li.is-oyna .s1-tuy .t2 { animation: nx-s1-t2 1.5s ease-out .4s both; }
.nx-wash li.is-oyna .s1-tuy .t3 { animation: nx-s1-t3 1.4s ease-out .55s both; }
@keyframes nx-s1-salla { 0%, 100% { transform: none; } 10% { transform: translateX(-2.5px) rotate(-5deg); } 22% { transform: translateX(2.5px) rotate(5deg); } 34% { transform: translateX(-2.5px) rotate(-5deg); } 46% { transform: translateX(2px) rotate(4deg); } 58% { transform: translateX(-1.5px) rotate(-3deg); } 70% { transform: translateX(1px) rotate(2deg); } 82% { transform: rotate(-1deg); } }
@keyframes nx-s1-hiz { 0% { opacity: 0; } 15%, 70% { opacity: 1; } 100% { opacity: 0; } }
@keyframes nx-s1-t1 { 0% { opacity: 0; transform: translate(12px, 8px) scale(.4); } 25% { opacity: 1; transform: translate(-3px, -8px) rotate(-18deg); } 100% { opacity: .8; transform: translate(-4px, 36px) rotate(10deg); } }
@keyframes nx-s1-t2 { 0% { opacity: 0; transform: translate(-12px, 10px) scale(.4); } 25% { opacity: 1; transform: translate(3px, -9px) rotate(16deg); } 100% { opacity: .8; transform: translate(2px, 40px) rotate(-8deg); } }
@keyframes nx-s1-t3 { 0% { opacity: 0; transform: translate(0, 14px) scale(.4); } 30% { opacity: 1; transform: translate(4px, -6px) rotate(20deg); } 100% { opacity: 0; transform: translate(10px, -14px) rotate(40deg); } }

/* Sahne 2 — Olduğu gibi makineye: yuva tambura düşer, tambur döner, su çalkalanır, kabarcık, kadran 30°'ye oturur. */
.nx-wash-ic .s2-dusen { opacity: 0; transform-box: view-box; transform-origin: 23px 54px; }
.nx-wash-ic .s2-tambur, .nx-wash-ic .s2-su { transform-box: view-box; transform-origin: 66px 58px; }
.nx-wash-ic .s2-dial { transform-box: view-box; transform-origin: 87px 21.5px; }
.nx-wash-ic .s2-30 { transform-box: view-box; transform-origin: 74px 22px; }
.nx-wash-ic .s2-kop circle { transform-box: view-box; }
.nx-wash.is-hazir li:not(.is-oyna) .s2-dusen { opacity: 1; }
.nx-wash.is-hazir li:not(.is-oyna) .s2-ic, .nx-wash.is-hazir li:not(.is-oyna) .s2-kop circle { opacity: 0; }
.nx-wash.is-hazir li:not(.is-oyna) .s2-dial { transform: rotate(-110deg); }
.nx-wash.is-hazir li:not(.is-oyna) .s2-30 { opacity: .25; }
.nx-wash li.is-oyna .s2-dusen { animation: nx-s2-dus .95s cubic-bezier(.5, 0, .6, 1) both; }
.nx-wash li.is-oyna .s2-ic { animation: nx-belir .25s ease-out .82s both; }
.nx-wash li.is-oyna .s2-tambur { animation: nx-s2-don 2s cubic-bezier(.45, 0, .3, 1) .9s both; }
.nx-wash li.is-oyna .s2-su { animation: nx-s2-calkala 2s ease-in-out .9s both; }
.nx-wash li.is-oyna .s2-kop .k1 { animation: nx-s2-kop 1.3s ease-out 1.15s both; }
.nx-wash li.is-oyna .s2-kop .k2 { animation: nx-s2-kop 1.3s ease-out 1.45s both; }
.nx-wash li.is-oyna .s2-kop .k3 { animation: nx-s2-kop 1.3s ease-out 1.75s both; }
.nx-wash li.is-oyna .s2-dial { animation: nx-s2-kadran .55s var(--hz-egri) 2.5s both; }
.nx-wash li.is-oyna .s2-30 { animation: nx-s2-30 .5s var(--hz-yay) 2.75s both; }
@keyframes nx-s2-dus { 0% { opacity: 1; transform: none; } 38% { opacity: 1; transform: translate(16px, -12px) rotate(24deg); } 78% { opacity: 1; transform: translate(40px, 2px) rotate(100deg) scale(.6); } 100% { opacity: 0; transform: translate(43px, 4px) rotate(130deg) scale(.4); } }
@keyframes nx-s2-don { from { transform: rotate(0deg); } to { transform: rotate(540deg); } }
@keyframes nx-s2-calkala { 0%, 100% { transform: none; } 20% { transform: translateX(-8px) rotate(-7deg); } 45% { transform: translateX(-16px) rotate(6deg); } 70% { transform: translateX(-6px) rotate(-4deg); } 88% { transform: translateX(-12px) rotate(2deg); } }
@keyframes nx-s2-kop { 0% { opacity: 0; transform: translateY(6px) scale(.4); } 35% { opacity: 1; transform: translateY(0) scale(1); } 100% { opacity: 1; transform: translateY(-4px); } }
@keyframes nx-s2-kadran { 0% { transform: rotate(-110deg); } 75% { transform: rotate(10deg); } 88% { transform: rotate(-4deg); } 100% { transform: none; } }
@keyframes nx-s2-30 { 0% { opacity: .25; transform: scale(.6); } 60% { opacity: 1; transform: scale(1.2); } 100% { opacity: 1; transform: none; } }

/* Sahne 3 — Kurusun, yerine koy: ışık ve buhar, kedi zıplar, kıvrılır, gözler kapanır, z. */
.nx-wash-ic .s3-ziplayan, .nx-wash-ic .s3-goz-acik { opacity: 0; }
.nx-wash-ic .s3-ziplayan { transform-box: view-box; transform-origin: 100px 84px; }
.nx-wash-ic .s3-isin { transform-box: view-box; transform-origin: 101px 17px; }
.nx-wash-ic .s3-ic { transform-box: view-box; transform-origin: 50px 84px; }
.nx-wash-ic .s3-buhar path, .nx-wash-ic .s3-z text { transform-box: view-box; }
.nx-wash.is-hazir li:not(.is-oyna) .s3-ziplayan, .nx-wash.is-hazir li:not(.is-oyna) .s3-goz-acik { opacity: 1; }
.nx-wash.is-hazir li:not(.is-oyna) .s3-ic, .nx-wash.is-hazir li:not(.is-oyna) .s3-z text, .nx-wash.is-hazir li:not(.is-oyna) .s3-buhar path { opacity: 0; }
.nx-wash.is-hazir li:not(.is-oyna) .s3-isin { opacity: .35; }
.nx-wash li.is-oyna .s3-isin { animation: nx-s3-isin 1.6s ease-out both; }
.nx-wash li.is-oyna .s3-buhar .b1 { animation: nx-s3-buhar 1.5s ease-out .05s both; }
.nx-wash li.is-oyna .s3-buhar .b2 { animation: nx-s3-buhar 1.5s ease-out .3s both; }
.nx-wash li.is-oyna .s3-buhar .b3 { animation: nx-s3-buhar 1.5s ease-out .55s both; }
.nx-wash li.is-oyna .s3-ziplayan { animation: nx-s3-zipla .85s cubic-bezier(.4, 0, .5, 1) 1.25s both; }
.nx-wash li.is-oyna .s3-ic { animation: nx-s3-kivril .4s var(--hz-egri) 1.95s both; }
.nx-wash li.is-oyna .s3-goz-acik { animation: nx-s3-goz-ac 2.6s linear both; }
.nx-wash li.is-oyna .s3-goz-kapali { animation: nx-belir .2s ease-out 2.6s both; }
.nx-wash li.is-oyna .s3-z .z1 { animation: nx-s3-z 1s ease-out 2.75s both; }
.nx-wash li.is-oyna .s3-z .z2 { animation: nx-s3-z 1s ease-out 3.05s both; }
@keyframes nx-s3-isin { 0% { opacity: .35; transform: rotate(-30deg); } 100% { opacity: 1; transform: none; } }
@keyframes nx-s3-buhar { 0% { opacity: 0; transform: translateY(8px); } 35% { opacity: .9; } 100% { opacity: 0; transform: translateY(-10px); } }
@keyframes nx-s3-zipla { 0% { opacity: 1; transform: none; } 30% { transform: translate(-4px, 2px) scaleY(.88); } 62% { opacity: 1; transform: translate(-30px, -24px) rotate(-14deg); } 100% { opacity: 0; transform: translate(-52px, 4px) rotate(-8deg) scale(.7); } }
@keyframes nx-s3-kivril { 0% { opacity: 0; transform: scale(.85) translateY(3px); } 100% { opacity: 1; transform: none; } }
@keyframes nx-s3-goz-ac { 0%, 97% { opacity: 1; } 100% { opacity: 0; } }
@keyframes nx-s3-z { 0% { opacity: 0; transform: translate(-2px, 6px); } 100% { opacity: 1; transform: none; } }

/* Son satır: balon + pati damgası */
.nx-wash.is-hazir:not(.is-bitti) .nx-wash-balon, .nx-wash.is-hazir:not(.is-bitti) .nx-pati { opacity: 0; }
.nx-wash.is-bitti .nx-wash-balon { animation: nx-balon-yay .8s var(--hz-egri) both; }
.nx-wash.is-bitti .nx-pati { animation: nx-pati 0.6s var(--hz-egri) .45s both; }
@keyframes nx-pati { 0% { opacity: 0; transform: rotate(-40deg) scale(1.9); } 60% { opacity: 1; transform: rotate(-10deg) scale(.88); } 100% { opacity: 1; transform: rotate(-14deg); } }

/* ---------- Ürün kartı ---------- */
.nx-card-media .wc-block-components-product-image { aspect-ratio: 1 / 1; }
.nx-kart-seri { position: relative; isolation: isolate; z-index: 2; box-shadow: 0 1px 2px color-mix(in srgb, var(--c-ink) 5%, transparent); transition: transform var(--hz-orta) var(--hz-egri), box-shadow var(--hz-orta) var(--hz-egri); }
.nx-kart-seri > a { position: relative; display: block; height: 100%; }
.nx-kart-seri img[src*="-studyo"], .nx-kart-seri img[src*="-yasam"], .nx-spot img[src*="-studyo"] { mix-blend-mode: normal !important; }
.nx-kart-ek { position: absolute; inset: 0; width: 100%; height: 100% !important; object-fit: cover; object-position: 50% 62%; opacity: 0; transition: opacity var(--hz-orta) var(--hz-egri), transform .5s ease; mix-blend-mode: normal !important; }
.nx-renk-gecis { position: absolute; inset: 0; width: 100%; height: 100% !important; object-fit: cover; opacity: 0; transition: opacity .35s var(--hz-egri); z-index: 1; pointer-events: none; }
.nx-renk-gecis.is-on { opacity: 1; }
/* İskelet parıltısı: görselin arkasında; görsel yüklenince JS kapatır, JS yoksa birkaç turda durur. */
.nx-kart-seri::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(100deg, transparent 25%, color-mix(in srgb, var(--wp--preset--color--beyaz) 60%, transparent) 50%, transparent 75%); transform: translateX(-100%); opacity: .9; }
.nx-kart-seri.is-yuklendi::before { content: none; }
@media (prefers-reduced-motion: no-preference) { .nx-kart-seri::before { animation: nx-parilti 1.3s ease-in-out 6 forwards; } }
@keyframes nx-parilti { from { transform: translateX(-100%); } to { transform: translateX(100%); } }
.nx-kart-nokta { display: none; position: absolute; left: 50%; bottom: var(--wp--custom--bosluk--8); z-index: 3; gap: var(--wp--custom--bosluk--4); transform: translateX(-50%); pointer-events: none; padding: 4px 6px; border-radius: var(--r-pill); background: color-mix(in srgb, var(--c-surface) 72%, transparent); }
.nx-kart-nokta i { width: 5px; height: 5px; border-radius: 50%; background: var(--c-ink); opacity: .3; transition: opacity var(--hz-kisa), transform var(--hz-kisa); }
.nx-kart-nokta i.is-on { opacity: .9; transform: scale(1.35); }
.nx-rozet { position: absolute; top: var(--wp--custom--bosluk--8); left: var(--wp--custom--bosluk--8); z-index: 3; display: inline-flex; align-items: center; gap: var(--wp--custom--bosluk--4); padding: var(--wp--custom--bosluk--4) var(--wp--custom--bosluk--10); border-radius: var(--r-pill); background: var(--c-surface); color: var(--c-ink); font-size: var(--fs-xs); font-weight: 600; line-height: 1.3; box-shadow: var(--sh-1); pointer-events: none; }
.nx-rozet::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--c-accent); }
.nx-hizli { display: none; }
.nx-kart-kulak { position: absolute; z-index: 3; top: -15px; right: var(--wp--custom--bosluk--20); width: 52px; height: 18px; color: var(--c-ink); pointer-events: none; }
.nx-kart-kulak svg { display: block; width: 100%; height: 100%; overflow: visible; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.nx-kart-kulak path { transform-box: fill-box; }
.nx-kart-kulak .k1 { transform-origin: 70% 100%; }
.nx-kart-kulak .k2 { transform-origin: 30% 100%; }
@media (prefers-reduced-motion: no-preference) {
	.wc-block-product:hover .nx-kart-kulak .k1 { animation: nx-kulak-sol-b .7s ease-in-out 1; }
	.wc-block-product:hover .nx-kart-kulak .k2 { animation: nx-kulak-sag-b .7s ease-in-out .06s 1; }
}
/* Masaüstü: üzerine gelince ikinci görsel (yaşam), hafif kalkma; hızlı bakış düğmesi. */
@media (hover: hover) and (pointer: fine) {
	.nx-kart-ek[data-nx-sira="3"] { display: none; }
	.wc-block-product:hover .nx-kart-seri:not(.is-renk) .nx-kart-ek[data-nx-sira="2"] { opacity: 1; }
	.wc-block-product:hover .nx-kart-seri { transform: translate3d(0, -3px, 0); box-shadow: var(--sh-1); }
}
@media (hover: hover) and (pointer: fine) and (min-width: 900px) {
	.nx-hizli { display: inline-flex; align-items: center; position: absolute; left: 50%; bottom: var(--wp--custom--bosluk--12); z-index: 3; min-height: var(--wp--custom--olcu--36); padding: 0 var(--wp--custom--bosluk--16); border: 0; border-radius: var(--r-pill); background: var(--c-surface); color: var(--c-ink); font: 600 var(--fs-sm)/1 var(--f-body); box-shadow: var(--sh-1); cursor: pointer; opacity: 0; transform: translate3d(-50%, 8px, 0); transition: opacity var(--hz-kisa) var(--hz-egri), transform var(--hz-kisa) var(--hz-egri), background-color var(--hz-kisa); }
	.wc-block-product:hover .nx-hizli, .nx-hizli:focus-visible { opacity: 1; transform: translate3d(-50%, 0, 0); }
	.nx-hizli:hover { background: var(--c-ink); color: var(--wp--preset--color--beyaz); }
}
/* Telefon: kaydırmalı mini galeri + noktalar. */
@media (hover: none), (pointer: coarse) {
	.nx-kart-seri.has-ek > a { display: flex; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; }
	.nx-kart-seri.has-ek > a::-webkit-scrollbar { display: none; }
	.nx-kart-seri.has-ek > a > img { flex: 0 0 100%; width: 100%; scroll-snap-align: start; scroll-snap-stop: always; }
	.nx-kart-seri.has-ek > a > .nx-kart-ek { position: static; opacity: 1; }
	.nx-kart-seri.has-ek > a > .wc-block-components-product-image__inner-container { display: none; }
	.nx-kart-seri.has-ek .nx-kart-nokta { display: flex; }
	.wc-block-product:hover .nx-card-media img { transform: none !important; }
}
/* Renk noktası düğmeleri (kart ve öne çıkan ürün). */
.nx-dots.is-dugme { gap: 0; margin-inline: -6px; position: relative; z-index: 2; }
.nx-dot { width: var(--wp--custom--olcu--24); height: var(--wp--custom--olcu--24); display: inline-grid; place-items: center; padding: 0; margin: 0; border: 0; background: none; border-radius: 50%; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.nx-dot i { width: 12px; height: 12px; border-radius: 50%; background: var(--nx-renk); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--c-ink) 18%, transparent); transition: transform var(--hz-kisa) var(--hz-egri), box-shadow var(--hz-kisa); }
.nx-dot:hover i { transform: scale(1.2); }
.nx-dot[aria-pressed="true"] i { box-shadow: 0 0 0 2px var(--c-surface), 0 0 0 3.5px var(--c-ink); }
.nx-spot-renk .nx-dot i { width: 18px; height: 18px; }
.nx-spot-renk .nx-dot { width: 30px; height: 30px; }
.nx-spot-img { position: relative; display: block; overflow: hidden; }

/* ---------- Hızlı bakış çekmecesi (masaüstü) ---------- */
.nx-hb { position: fixed; inset: 0 0 0 auto; width: min(460px, 100vw); height: 100dvh; max-height: none; margin: 0; padding: 0; border: 0; background: var(--c-surface); color: var(--c-ink); box-shadow: var(--sh-2); overflow-y: auto; overscroll-behavior: contain; }
.nx-hb::backdrop { background: color-mix(in srgb, var(--c-dark) 42%, transparent); }
.nx-hb[open] { animation: nx-hb-gir .42s var(--hz-cikis) both; }
@keyframes nx-hb-gir { from { transform: translate3d(40px, 0, 0); opacity: 0; } to { transform: none; opacity: 1; } }
.nx-hb-ic { padding: var(--wp--custom--bosluk--20); display: grid; gap: var(--wp--custom--bosluk--16); }
.nx-hb-kapat { justify-self: end; width: var(--wp--custom--olcu--44); height: var(--wp--custom--olcu--44); border: 0; border-radius: 50%; background: var(--c-sand); color: var(--c-ink); display: grid; place-items: center; cursor: pointer; }
.nx-hb-kapat svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
.nx-hb-gorsel { position: relative; aspect-ratio: 1 / 1; border-radius: var(--r-lg); overflow: hidden; background: var(--c-card); }
.nx-hb-gorsel img { width: 100%; height: 100% !important; object-fit: cover; display: block; }
.nx-hb-baslik { font-size: var(--fs-xl); margin: 0; }
.nx-hb-fiyat { font-weight: 700; font-size: var(--fs-lg); color: var(--c-accent); }
.nx-hb-renk .nx-dots { flex-wrap: wrap; }
.nx-hb-git { justify-self: start; }

/* ---------- Boş durumlar, 404, atölye: hareketli çizimler ---------- */
.nx-empty-cizim { width: min(280px, 72vw); margin: 0 auto var(--wp--custom--bosluk--16); color: var(--c-ink); }
.nx-empty-cizim svg { display: block; width: 100%; height: auto; overflow: visible; }
.nx-empty-cizim .i { stroke: var(--c-accent); }
.nx-empty-cizim .z { opacity: .3; }
.nx-empty-cizim .dolgu { fill: var(--c-surface); }
.nx-empty-cizim .dolgu-ic { fill: var(--c-sand); }
.nx-empty-bulunamadi { width: min(440px, 88vw); }
.nx-bos-sepet .nx-empty-cizim, .wc-block-mini-cart__drawer .nx-empty-cizim { width: min(240px, 64vw); }
.nx-cizim .bs-kedi, .nx-cizim .bn-igne, .nx-cizim .sy-buyutec { transform-box: view-box; }
.nx-cizim .bs-kedi { transform-origin: 103px 134px; }
.nx-cizim .bs-goz circle, .nx-cizim .sy-goz circle { transform-box: fill-box; transform-origin: center; }
.nx-cizim .bs-kulak-sol { transform-box: fill-box; transform-origin: 70% 100%; }
.nx-cizim .bs-ponpon { transform-box: view-box; transform-origin: 103.2px 95px; }
.nx-cizim .sy-buyutec { transform-origin: 126px 130px; }
.is-hazir:not(.is-oyna) .bs-kedi { transform: translateY(24px); }
.is-oyna .bs-kedi { animation: nx-bs-bak 1s var(--hz-egri) .3s both; }
.is-oyna .bs-goz circle { animation: nx-kirp .35s ease-in-out 1.5s 2; }
.is-oyna .bs-kulak-sol { animation: nx-kulak-sol-b .6s ease-in-out 2.1s 1; }
.is-oyna .bs-ponpon { animation: nx-sallan 1.8s ease-in-out .6s 1; }
@keyframes nx-bs-bak { 0% { transform: translateY(24px); } 60% { transform: translateY(-3px); } 100% { transform: none; } }
@keyframes nx-kirp { 0%, 100% { transform: none; } 50% { transform: scaleY(.1); } }
@keyframes nx-sallan { 0%, 100% { transform: none; } 20% { transform: rotate(12deg); } 45% { transform: rotate(-9deg); } 70% { transform: rotate(5deg); } 88% { transform: rotate(-2deg); } }
.nx-cizim .bn-iplik { stroke-dasharray: 1; stroke-dashoffset: 0; }
.is-hazir:not(.is-oyna) .bn-iplik { stroke-dashoffset: 1; }
.is-hazir:not(.is-oyna) .bn-igne { opacity: 0; }
.is-oyna .bn-iplik { animation: nx-bn-ciz 2.6s cubic-bezier(.45, .05, .4, 1) both; }
.is-oyna .bn-igne { animation: nx-bn-igne .9s var(--hz-egri) 2.1s both; }
@keyframes nx-bn-ciz { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@keyframes nx-bn-igne { 0% { opacity: 0; transform: translate(-14px, 10px); } 60% { opacity: 1; transform: translate(3px, -2px); } 100% { opacity: 1; transform: none; } }
.is-oyna .sy-buyutec { animation: nx-sy-ara 1.8s ease-in-out .3s 1; }
.is-oyna .sy-goz circle { animation: nx-kirp .35s ease-in-out 2.2s 1; }
@keyframes nx-sy-ara { 0%, 100% { transform: none; } 25% { transform: translate(-10px, 2px) rotate(-8deg); } 55% { transform: translate(8px, -2px) rotate(6deg); } 80% { transform: translate(-3px, 0) rotate(-2deg); } }
/* Atölye: kumaş çizilir, dikişler belirir, iplik iğneye uzanır, iğne bir kez batar. */
.nx-cizim .at-kumas, .nx-cizim .at-kumas2, .nx-cizim .at-iplik { stroke-dasharray: 1; stroke-dashoffset: 0; }
.nx-cizim .at-igne { transform-box: view-box; transform-origin: 216px 86px; }
.nx-story-cizim.is-hazir:not(.is-oyna) .at-kumas, .nx-story-cizim.is-hazir:not(.is-oyna) .at-kumas2, .nx-story-cizim.is-hazir:not(.is-oyna) .at-iplik { stroke-dashoffset: 1; }
.nx-story-cizim.is-hazir:not(.is-oyna) .at-dikis, .nx-story-cizim.is-hazir:not(.is-oyna) .at-igne { opacity: 0; }
.nx-story-cizim.is-oyna .at-kumas { animation: nx-bn-ciz 1.3s ease-in-out both; }
.nx-story-cizim.is-oyna .at-kumas2 { animation: nx-bn-ciz .6s ease-out 1s both; }
.nx-story-cizim.is-oyna .at-dikis { animation: nx-belir .7s ease-out 1.1s both; }
.nx-story-cizim.is-oyna .at-igne { animation: nx-at-igne 1.4s var(--hz-egri) 1.3s both; }
.nx-story-cizim.is-oyna .at-iplik { animation: nx-bn-ciz 1.5s ease-in-out 1.6s both; }
@keyframes nx-at-igne { 0% { opacity: 0; transform: translate(26px, -50px); } 45% { opacity: 1; transform: translate(-3px, 6px); } 65% { transform: translate(4px, -8px); } 82% { transform: translate(-2px, 3px); } 100% { opacity: 1; transform: none; } }
.nx-story .nx-cizim .at-kulak { display: none; }

/* ---------- Azaltılmış hareket: her şey durağan, son hâliyle ---------- */
@media (prefers-reduced-motion: reduce) {
	.nx-rv { opacity: 1 !important; transform: none !important; transition: none !important; }
	.nx-balon, .nx-stamp, .nx-hero-main img, .nx-stamp-ring, .nx-stamp-tur, .nx-logo-svg .nx-kulak, .nx-kart-seri::before { animation: none !important; }
	.nx-iplik path, .nx-iplik-igne, .nx-wash *, .nx-ci *, .nx-cizim *, .nx-kart-kulak *, .nx-hb[open] { animation: none !important; transition: none !important; }
	.nx-kart-seri, .nx-kart-ek, .nx-hizli, .nx-renk-gecis { transition: none !important; }
}

/* Alt bilgi: güvenli ödeme çizgi ikonu (kalkan + kil tik; ekrana girince tik çizilir). */
.nx-pay-ikon { display: inline-grid; place-items: center; color: var(--c-on-dark-2); margin-right: var(--wp--custom--bosluk--2); }
.nx-pay-ikon .nx-ci .i { stroke: var(--c-on-dark-accent); }