/* ============================================================
   SCENES v3 — ana sayfa (style.css üstüne). 05.09.2026
   AKIŞ SAYFASI: pin yok, kilit yok. Yolculuk kendi kutusunda YATAY kayar.
   Katman (z): bg 0 · media 1 · deco 2 · content 3 · nav 50 · progress 60
   · prelude 100 · wipe 250 · cursor 300 · vbox 400
   ============================================================ */
:root{
  --z-bg:0;--z-media:1;--z-deco:2;--z-content:3;--z-nav:50;--z-progress:60;--z-prelude:100;--z-wipe:250;--z-cursor:300;--z-vbox:400;
  --gx:clamp(20px,4vw,72px);
  --fs-hero:clamp(56px,10.5vw,176px);
  --fs-d1:clamp(48px,8.4vw,136px);
  --fs-d2:clamp(40px,6.4vw,104px);
  --fs-h3:clamp(28px,3.4vw,56px);
  --fs-lead:clamp(18px,1.9vw,29px);
  --fs-body:clamp(15px,1.2vw,19px);
  --fs-label:clamp(10px,.75vw,12px);
}
html,body{overflow-x:clip}
/* Lenis resmi CSS'i (paketten gelmiyor, elle) */
html.lenis,html.lenis body{height:auto}
.lenis:not(.lenis-autoToggle).lenis-stopped{overflow:clip}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
.scene{position:relative;overflow:hidden}
.page-home{background:var(--bg)}
html.prelude-lock{overflow:hidden}
body.static .rv{opacity:1;transform:none}
.nav{z-index:var(--z-nav)}
#vbox{z-index:var(--z-vbox)}

/* split yardımcıları */
.w{display:inline-block;overflow:hidden;vertical-align:bottom}
.w i{display:inline-block;font-style:normal}
.c{display:inline-block}
/* Aksan kırpma YASAK: İ noktası / Ğ şapkası satır kutusunun üstüne taşar; maske üstte pay bırakır (yaşanmış: "YIGIT EROGLU") */
.l1,.l2{display:block;overflow:hidden;padding:.16em 0 .04em;margin:-.16em 0 -.04em}

/* ---------- Progress ---------- */
#progress{position:fixed;left:0;top:0;height:2px;width:100%;background:var(--red);transform:scaleX(0);transform-origin:left;z-index:var(--z-progress);pointer-events:none}
[dir="rtl"] #progress{transform-origin:right}

/* ---------- SCENE 00 — PRELUDE ----------
   Giriş animasyonu CSS ile HEMEN başlar (GSAP CDN'i beklemez; ölçüldü: GSAP 4G'de 1.84 sn'de
   geliyordu, perde o ana kadar donuk kalıyordu). GSAP yüklenince JS devralır: .js-ready varsa
   CSS animasyonu iptal, zaman çizelgesi sürer. */
#prelude{position:fixed;inset:0;z-index:var(--z-prelude);background:#050506;display:grid;place-items:center;clip-path:circle(150% at 50% 50%)}
.pl-center{text-align:center;padding:0 var(--gx)}
.pl-mask{overflow:hidden;line-height:.95;padding-top:.12em;margin-top:-.12em}
.pl-line{font-family:var(--font-d);font-size:clamp(48px,10.5vw,168px);color:#fff;text-transform:uppercase;letter-spacing:.01em;
  transform:translateY(110%);animation:plUp .62s cubic-bezier(.16,1,.3,1) forwards}
.pl-mask:nth-child(2) .pl-line{animation-delay:.06s}
.pl-mask:nth-child(3) .pl-line{animation-delay:.12s}
@keyframes plUp{to{transform:none}}
.pl-red{color:var(--red)}
.pl-rule{width:min(46vw,420px);height:2px;background:var(--red);margin:clamp(16px,3vh,28px) auto clamp(14px,2.4vh,22px);transform-origin:left;transform:scaleX(0);animation:plRule .42s cubic-bezier(.65,0,.35,1) .3s forwards}
@keyframes plRule{to{transform:none}}
.pl-tag{font-size:var(--fs-label);font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:var(--muted);opacity:0;animation:plFade .34s ease .52s forwards}
@keyframes plFade{to{opacity:1}}
html.js-ready .pl-line,html.js-ready .pl-rule,html.js-ready .pl-tag{animation:none}
.pl-skip{position:absolute;right:var(--gx);top:clamp(18px,3vh,28px);font-size:11px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);padding:10px 0;border-bottom:1px solid transparent;transition:.3s;z-index:1}
.pl-skip:hover{color:#fff;border-color:#fff}

/* ---------- HERO — tam ekran fotoğraf ----------
   Kadraj TEK YERDEN: --hero-pos (object-position). Görsel değişince yalnız bunu ayarla. */
.id-scene{height:100svh;min-height:560px;--hero-pos:62% 30%}
.id-media{position:absolute;inset:0;z-index:var(--z-media)}
.id-media img{width:100%;height:100%;object-fit:cover;object-position:var(--hero-pos);filter:contrast(1.06) saturate(.85)}
/* okunurluk: sol alt köşe karartılır; fotoğrafın sağ üstü (aksiyon) açık kalır */
.id-media::after{content:"";position:absolute;inset:0;background:
  linear-gradient(0deg,rgba(11,11,12,.96) 0%,rgba(11,11,12,.55) 34%,rgba(11,11,12,.12) 62%,rgba(11,11,12,.25) 100%),
  linear-gradient(90deg,rgba(11,11,12,.7) 0%,rgba(11,11,12,.25) 42%,transparent 70%)}
.id-alias{position:absolute;left:var(--gx);top:calc(var(--nav-h) + 6svh);font-family:var(--font-d);font-size:clamp(13px,1.5vw,20px);letter-spacing:.44em;color:var(--red-2);z-index:var(--z-content)}
.id-name{position:absolute;left:var(--gx);bottom:16svh;z-index:var(--z-content);font-size:var(--fs-hero);line-height:1.02;letter-spacing:-.005em;max-width:calc(100% - var(--gx)*2);text-shadow:0 4px 40px rgba(0,0,0,.5)}
.id-name .l2{color:#fff}
.id-meta{position:absolute;left:var(--gx);bottom:6svh;z-index:var(--z-content);display:flex;gap:clamp(16px,2vw,28px);flex-wrap:wrap;font-size:var(--fs-label);font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--silver);max-width:70vw}
.id-meta span{position:relative}
.id-meta span+span::before{content:"";position:absolute;left:-14px;top:50%;width:4px;height:4px;background:var(--red);transform:translateY(-50%) rotate(45deg)}
.id-scroll{position:absolute;right:var(--gx);bottom:6svh;z-index:var(--z-content);display:flex;flex-direction:column;align-items:center;gap:10px;font-size:9.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--muted)}
.id-scroll i{width:1px;height:44px;background:linear-gradient(var(--red),transparent);animation:drop 1.8s ease-in-out infinite}
@keyframes drop{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
[dir="rtl"] .id-alias,[dir="rtl"] .id-name,[dir="rtl"] .id-meta{left:auto;right:var(--gx)}
[dir="rtl"] .id-scroll{right:auto;left:var(--gx)}
[dir="rtl"] .id-media::after{background:
  linear-gradient(0deg,rgba(11,11,12,.96) 0%,rgba(11,11,12,.55) 34%,rgba(11,11,12,.12) 62%,rgba(11,11,12,.25) 100%),
  linear-gradient(-90deg,rgba(11,11,12,.7) 0%,rgba(11,11,12,.25) 42%,transparent 70%)}

/* ---------- GİRİŞ METNİ — akışta ---------- */
.in-scene{position:relative;isolation:isolate;background:var(--bg);padding:clamp(70px,14svh,150px) var(--gx)}
/* ---- Giriş metni arka planı: Higgsfield ring sahnesi (sessiz döngü, yaklaşınca yüklenir) ---- */
.in-bg{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.in-bg video{width:120%;height:100%;object-fit:cover;object-position:0% 35%;transform:translateX(-46%);opacity:.6;filter:saturate(.8) contrast(1.05)}
.in-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#0b0b0c,rgba(11,11,12,.2) 30%,rgba(11,11,12,.3) 70%,#0b0b0c),linear-gradient(90deg,transparent 12%,rgba(11,11,12,.92) 30%,#0b0b0c 40%)}
.in-scene .in-lead{position:relative;text-shadow:0 2px 24px rgba(0,0,0,.8)}
@media (max-width:900px){.in-bg video{opacity:.35}}
.in-inner{max-width:900px;margin-inline-start:auto;margin-inline-end:0}
.in-lead{font-family:var(--font-b);font-size:var(--fs-lead);line-height:1.5;color:var(--silver);font-weight:400}
.in-lead::before{content:"";display:block;width:56px;height:3px;background:var(--red);margin-bottom:clamp(20px,3vh,32px)}

/* ---------- YOLCULUK — bir hareket, bir durak ----------
   Fine pointer: JS adımları; coarse pointer: yerli kaydırma + proximity snap. */
.jr-scene{background:#070708;--figw:min(34vw,520px);--figx:var(--gx);--jr-card-h:clamp(340px,52svh,480px);--jr-gap:clamp(24px,3vw,56px);--jr-lead:0px;padding:clamp(60px,10svh,110px) 0 clamp(50px,8svh,90px);
  background-image:radial-gradient(40% 50% at 22% 70%,rgba(255,255,255,.08),transparent 70%),linear-gradient(0deg,#070708,#0b0b0c)}
.jr-head{display:flex;align-items:baseline;gap:18px;padding:0 var(--gx);margin-bottom:clamp(24px,4svh,44px);position:relative}
.jr-head .eyebrow{margin-bottom:0;font-family:var(--font-d);font-weight:400;font-size:clamp(34px,4.6vw,72px);letter-spacing:.02em;line-height:.9;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.82);position:relative;gap:0}
.jr-head .eyebrow::before{width:clamp(28px,3vw,46px);height:4px;margin-inline-end:16px;transform:skewX(-18deg) translateY(-.32em)}
.jr-head .eyebrow::after{content:"";position:absolute;inset-inline-start:calc(clamp(28px,3vw,46px) + 16px);bottom:-.06em;width:0;height:3px;background:var(--red);transition:width .8s cubic-bezier(.2,.7,.2,1) .15s}
.jr-scene.is-in .jr-head .eyebrow::after{width:calc(100% - clamp(28px,3vw,46px) - 16px)}
.jr-head .jr-count{align-self:flex-end;padding-bottom:.35em}
.jr-count{font-family:var(--font-d);font-size:13px;letter-spacing:.24em;color:var(--dim);white-space:nowrap}
.jr-count-mask{position:relative;display:inline-block;overflow:hidden;vertical-align:bottom;height:1.3em;line-height:1.3}
.jr-count b{display:block;color:var(--red-2);font-weight:400;line-height:1.3}
.jr-count .jr-count-old{position:absolute;inset-inline-start:0;top:.16em}
.jr-hint{margin-inline-start:auto;margin-inline-end:116px;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--dim)}
.jr-hint::after{content:"→";margin-inline-start:8px;display:inline-block;animation:jr-nudge 1.6s ease-in-out infinite}
@keyframes jr-nudge{50%{transform:translateX(6px)}}
.jr-body{position:relative;display:grid;grid-template-columns:var(--figw) minmax(0,1fr);column-gap:clamp(0px,1vw,24px);align-items:end;padding-inline-start:var(--figx)}
.jr-body::before{content:"";position:absolute;inset:auto 0 0 0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.10) 30%,rgba(255,255,255,.10) 70%,transparent)}
.jr-fig{position:relative;height:min(64svh,640px);width:var(--figw);z-index:calc(var(--z-content) + 1);pointer-events:none;align-self:end;margin-bottom:-6%;--jr-shadow-x:1}
.jr-fig img{position:absolute;left:50%;bottom:0;height:100%;width:auto;transform:translateX(-50%);opacity:0;filter:drop-shadow(0 30px 40px rgba(0,0,0,.6))}
.jr-fig img.on{opacity:1}
/* ---- Anime hamle efektleri (JS zamanlar; başlangıçta görünmez) ---- */
.jr-fx{position:absolute;inset:-12% -40% -4% -40%;pointer-events:none;--fx-dir:1}
.jr-fx>span{position:absolute;opacity:0;will-change:transform,opacity}
/* flash: darbe anında tek kare beyaz-kırmızı yıkama, figürün ÜSTÜNDE */
.jr-fx-flash{inset:0;z-index:2;background:radial-gradient(60% 55% at 50% 45%,rgba(255,255,255,.95),rgba(225,6,0,.55) 45%,transparent 72%);mix-blend-mode:screen}
/* hız çizgileri: yatay ince çizgi demeti, hamle yönüne akar */
.jr-fx-lines{left:-6%;right:-6%;top:14%;height:64%;transform-origin:50% 50%;
  background:repeating-linear-gradient(180deg,transparent 0 7px,rgba(255,255,255,.85) 7px 9px,transparent 9px 19px,rgba(225,6,0,.75) 19px 21px,transparent 21px 33px);
  -webkit-mask:linear-gradient(90deg,transparent,#000 22%,#000 78%,transparent);mask:linear-gradient(90deg,transparent,#000 22%,#000 78%,transparent)}
/* darbe halkası: yumruk/tekme ucunda genişleyen ince çember */
.jr-fx-ring{left:calc(50% + var(--fx-dir,1) * -22%);top:22%;width:30%;aspect-ratio:1;margin-left:-15%;border-radius:50%;border:2.5px solid rgba(255,255,255,.9);box-shadow:0 0 0 5px rgba(225,6,0,.35),0 0 24px rgba(225,6,0,.5),inset 0 0 14px rgba(255,255,255,.35);transform-origin:50% 50%}
@media (prefers-reduced-motion:reduce){.jr-fx{display:none}}
.jr-fig::after{content:"";position:absolute;left:50%;bottom:-2%;width:70%;height:6%;transform:translateX(-50%) scaleX(var(--jr-shadow-x));background:radial-gradient(50% 50% at 50% 50%,rgba(0,0,0,.7),transparent);filter:blur(4px)}
.jr-strip{position:relative;z-index:var(--z-content);min-width:0;overflow-x:auto;overflow-y:hidden;scroll-snap-type:none;scroll-padding-inline-start:var(--jr-lead);scrollbar-width:none;cursor:grab;outline:none}
.jr-strip::-webkit-scrollbar{display:none}
.jr-strip.dragging{cursor:grabbing;scroll-snap-type:none;user-select:none}
.jr-strip:focus-visible{box-shadow:inset 0 0 0 2px var(--red)}
.jr-track{display:flex;align-items:stretch;gap:var(--jr-gap);width:max-content}
.jr-track::before{content:"";flex:0 0 var(--jr-lead);margin-inline-end:calc(-1 * var(--jr-gap))}
.jr-track::after{content:"";flex:0 0 var(--jr-tail,var(--gx));margin-inline-start:calc(-1 * var(--jr-gap))}
.jr-stop{flex:0 0 auto;width:min(46vw,620px);height:var(--jr-card-h);min-height:0;scroll-snap-align:start;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;gap:12px;opacity:.55;transition:opacity .35s cubic-bezier(.2,.7,.2,1)}
.jr-stop.active{opacity:1}
/* Metne ayrılan sabit alan, son kartın bağlantısını da barındırır; plaka oranı bozulmaz. */
.jr-plate{position:relative;margin:0;align-self:stretch;width:100%;height:100%;min-height:0;overflow:hidden;border:1px solid rgba(255,255,255,.08);background:radial-gradient(ellipse at 25% 15%,rgba(255,255,255,.06),transparent 70%),linear-gradient(135deg,#0e0e11,#070708)}
.jr-scene[data-enhanced] .jr-stop:not([data-revealed]) .jr-plate{clip-path:inset(0 100% 0 0)}
.jr-scene[data-enhanced] .jr-stop.active .jr-plate,.jr-scene[data-enhanced] .jr-stop.active + .jr-stop .jr-plate{clip-path:inset(0 0 0 0)}
.jr-plate picture{display:block;position:absolute;inset:0}
.jr-plate-photo img{width:100%;height:100%;object-fit:cover;object-position:center 30%;filter:grayscale(.4) contrast(1.1)}
.jr-plate-photo::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(0deg,rgba(0,0,0,.85),transparent 65%,rgba(0,0,0,.45))}
.jr-year{position:absolute;inset-inline-start:16px;top:10px;font-family:var(--font-d);font-size:clamp(64px,6.4vw,112px);line-height:1;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.55);z-index:1}
.jr-year::after{content:"";position:absolute;inset-inline-start:0;bottom:-6px;width:100%;height:2px;background:var(--red);transform:scaleX(0);transform-origin:left;transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.jr-stop.active .jr-year::after{transform:scaleX(1)}
.jr-stop[data-gold="1"] .jr-year{-webkit-text-stroke-color:var(--red)}
.jr-plate-photo .jr-year{top:12px;font-size:32px;-webkit-text-stroke:1px var(--silver)}
.jr-tag{position:absolute;left:16px;right:16px;bottom:14px;font-size:clamp(9px,.75vw,11px);line-height:1.5;letter-spacing:.3em;color:var(--silver);z-index:1}
.jr-tag::after{content:"";display:block;width:40px;height:2px;background:var(--red);margin-top:6px}
.jr-No{position:absolute;inset-inline-end:12px;top:12px;font-family:var(--font-d);font-size:11px;letter-spacing:.3em;color:var(--silver);z-index:1}
.jr-copy{min-width:0;height:174px;overflow:hidden}
.jr-copy h3{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:clamp(18px,1.6vw,24px);line-height:1.2;margin:0 0 6px;padding-top:.16em;overflow-wrap:anywhere}
.jr-copy h3 em{font-style:normal;color:transparent;-webkit-text-stroke:1px #fff}
.jr-copy p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;font-size:clamp(12px,1vw,14px);color:var(--silver);max-width:44ch;line-height:1.4;margin:0}
.jr-gold h3{color:var(--red-2)}
.jr-copy .btn{margin-top:8px;padding:8px 14px;font-size:11px;line-height:1.2;max-width:100%}
.jr-nav{position:absolute;right:var(--gx);top:calc(clamp(60px,10svh,110px) - 14px);z-index:var(--z-content);display:flex;gap:8px}
.jr-nav button{width:44px;height:44px;border:1px solid rgba(255,255,255,.3);color:#fff;font-size:18px;display:grid;place-items:center;transition:.3s var(--ease)}
.jr-nav button:hover{background:var(--red);border-color:var(--red)}
.jr-nav button:disabled{opacity:.25;pointer-events:none}
.jr-bar{position:relative;margin:clamp(24px,4svh,40px) var(--gx) 0;height:2px;background:rgba(255,255,255,.1)}
.jr-bar i{position:absolute;left:0;top:0;height:100%;width:0;background:var(--red)}
[dir="rtl"] .jr-nav{right:auto;left:var(--gx)}
[dir="rtl"] .jr-nav button{transform:scaleX(-1)}
[dir="rtl"] .jr-hint::after{content:"←"}
[dir="rtl"] .jr-bar i{left:auto;right:0}
[dir="rtl"] .jr-year::after{transform-origin:right}
@media (min-width:901px) and (max-height:800px){.jr-plate-type .jr-year{font-size:64px}}
@media (pointer:coarse){.jr-strip{scroll-snap-type:x proximity}.jr-strip.dragging{scroll-snap-type:none}}

/* ---------- KILLER GYM ---------- */
.cx-scene{display:flex;align-items:flex-end;background:#000;min-height:100svh}
.cx-media{position:absolute;inset:0;z-index:var(--z-media)}
.cx-media video{width:100%;height:100%;object-fit:cover}
.cx-media::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(11,11,12,1) 0%,rgba(11,11,12,.6) 40%,rgba(11,11,12,.35) 100%)}
.cx-inner{position:relative;z-index:var(--z-content);padding:0 var(--gx) clamp(50px,12svh,130px);max-width:1100px;min-width:0}
.cx-inner .d1{margin:14px 0 20px;font-size:var(--fs-d1)}
.cx-inner p{font-size:clamp(16px,1.3vw,20px);color:var(--silver);max-width:54ch;margin-bottom:clamp(20px,4vh,34px)}
.cx-actions{display:flex;gap:14px;flex-wrap:wrap}

/* ---------- KAPANIŞ ---------- */
.cl-scene{background:#050506;display:grid;place-items:center;text-align:center;min-height:100svh;padding:clamp(60px,12svh,120px) var(--gx)}
.cl-tag{font-size:var(--fs-label);font-weight:600;letter-spacing:.32em;text-transform:uppercase;color:var(--muted);margin-bottom:22px}
.cl-name{font-family:var(--font-d);font-size:clamp(56px,15vw,260px);line-height:.92;color:#fff;letter-spacing:.01em;overflow:hidden;padding-bottom:.06em}
.cl-body{margin-top:clamp(20px,4vh,34px)}
.cl-body p{font-size:13px;letter-spacing:.22em;text-transform:uppercase;color:var(--dim)}
.cl-links{display:flex;justify-content:center;gap:clamp(18px,3vw,34px);margin:26px 0 clamp(30px,6vh,60px);flex-wrap:wrap}
.cl-links a,.cl-links button{font-size:12.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--silver);padding:8px 0;border-bottom:2px solid transparent;transition:.3s}
.cl-links a:hover,.cl-links button:hover{color:#fff;border-color:var(--red)}
.cl-foot{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}

/* ---------- Cursor ---------- */
.cursor{position:fixed;left:0;top:0;z-index:var(--z-cursor);pointer-events:none;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:var(--red);mix-blend-mode:difference;transition:width .3s,height .3s,margin .3s,background .3s}
.cursor span{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--font-d);font-size:12px;letter-spacing:.2em;color:#fff;opacity:0;transition:opacity .25s}
.cursor.on{width:84px;height:84px;margin:-42px 0 0 -42px;background:var(--red);mix-blend-mode:normal}
.cursor.on span{opacity:1}
@media (pointer:fine){.page-home .mag{cursor:none}}

/* ---------- Tablet (900–1180) ---------- */
@media (max-width:1180px) and (min-width:901px){
  .jr-scene{--figw:min(22vw,260px)}
  .jr-fig{height:min(50svh,460px)}
}

/* ---------- Mobil ---------- */
@media (max-width:900px){
  .brand-mark{font-size:17px;white-space:nowrap}
  .brand-mark b{display:none}
  .id-scene{--hero-pos:64% 28%}
  .id-media::after{background:linear-gradient(0deg,rgba(11,11,12,.97) 0%,rgba(11,11,12,.62) 42%,rgba(11,11,12,.2) 70%,rgba(11,11,12,.3) 100%)}
  .id-name{font-size:clamp(48px,15vw,110px);bottom:22svh;left:var(--gx);right:var(--gx);max-width:none}
  .id-meta{flex-direction:column;gap:6px;bottom:7svh;left:var(--gx);max-width:none}
  .id-meta span+span::before{display:none}
  .id-scroll{display:none}
  .in-scene{padding:clamp(50px,10svh,90px) var(--gx)}
  .in-inner{margin:0}
  /* yolculuk: figür şeridin üstünde küçük; şerit tam genişlik */
  .jr-scene{--figw:clamp(110px,30vw,200px);--jr-lead:var(--gx);padding-top:clamp(40px,8svh,70px)}
  .jr-head{flex-wrap:wrap;margin-bottom:12px}
  .jr-hint{width:100%;margin:8px 0 0}
  .jr-body{display:block;padding:0}
  .jr-fig{height:clamp(150px,26svh,230px);width:var(--figw);margin:0 var(--gx) 0 auto;overflow:visible;z-index:var(--z-deco);align-self:auto}
  .jr-fig img{left:auto;right:0;transform:none;max-width:none}
  .jr-hint{margin-inline-end:0}
  .jr-stop{width:min(82vw,420px)}
  .jr-nav{display:none}
  .cx-inner{padding:0 var(--gx) clamp(40px,10svh,90px)}
  .cl-name{font-size:clamp(48px,20vw,120px)}
}
@media (max-width:420px){
  .id-name{font-size:clamp(44px,14vw,80px)}
  .cl-links{gap:16px}
}

/* ---------- Sayfa geçişi (wipe) ---------- */
#wipe{position:fixed;inset:0;z-index:var(--z-wipe);background:var(--red);transform:scaleY(0);transform-origin:bottom;pointer-events:none}
#wipe.in{animation:wipeIn .7s cubic-bezier(.76,0,.24,1) forwards}
#wipe.out{transform:scaleY(1);transform-origin:top;animation:wipeOut .8s cubic-bezier(.76,0,.24,1) forwards}
@keyframes wipeIn{to{transform:scaleY(1)}}
@keyframes wipeOut{to{transform:scaleY(0)}}
.page-sub .page-hero h1 .w,.page-sub .page-hero h1 .c{will-change:transform}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  .id-scroll i,.jr-hint::after{animation:none}
  .jr-stop,.jr-year::after,.jr-nav button,.jr-copy .btn{transition:none}
  .jr-scene[data-enhanced] .jr-stop .jr-plate{clip-path:none!important}
  .jr-plate-photo img{transform:none!important}
  .jr-fig,.jr-fig img,.jr-count b{transform:none!important}
  .jr-fig img{transform:translateX(-50%)!important}
  .jr-fig::after{transform:translateX(-50%)}
}