/* latin-ext */
@font-face {
  font-family: 'Anton';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/anton-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: 'Anton';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/anton-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin-ext */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url(../fonts/manrope-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url(../fonts/manrope-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ==========================================================================
   Argun Badur — main.css (v5 "carousel deste")
   Tek fikir: site, Argun'un Instagram carousel'lerinden biri.
   Her bölüm bir slayt kartı; kaydırdıkça kartlar üst üste biner,
   alttaki geriye doğru 3D yatar. Dört kart rengi: mürekkep, karbon,
   kâğıt, sinyal turuncusu. Anton (başlık) + Manrope (metin).
   ========================================================================== */

:root {
  --orange: #ff5a1f;
  --black: #000000;
  --bone: #ede9e3;
  --cream: #f6f3ee;

  --page: #000000;
  --page-fg: #f4f1ec;
  --page-mute: #8f8880;

  --ff-d: "Anton", "Impact", "Arial Narrow", sans-serif;
  --ff-b: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;

  --pad: clamp(18px, 2.6vw, 34px);
  --gap: clamp(8px, 1vw, 12px);
  --bar-h: 64px;
  --r: 30px;
  --ease: cubic-bezier(.22, 1, .36, 1);
  --t-h2: clamp(2.5rem, 1.4rem + 4.4vw, 5.4rem);
  --t-big: clamp(3rem, 1.4rem + 6.4vw, 7.6rem);
  color-scheme: dark;
}
:root[data-theme="light"] {
  --page: #d8d2c9;
  --page-fg: #0b0b0b;
  --page-mute: #5c564f;
  color-scheme: light;
}

/* Kart derileri. Her slayt kendi rengini taşır; içindeki her şey bu değişkenleri kullanır. */
.slide--ink    { --bg: #000; --fg: #f4f1ec; --mute: #9b948b; --line: rgba(255,255,255,.13); --acc: var(--orange); --acc-ink: #000; --sub: #121110; }
.slide--carbon { --bg: #141210; --fg: #f4f1ec; --mute: #a29a91; --line: rgba(255,255,255,.13); --acc: var(--orange); --acc-ink: #000; --sub: #000; }
.slide--paper  { --bg: var(--bone); --fg: #0b0b0b; --mute: #5b554e; --line: rgba(0,0,0,.14); --acc: #bb380a; --acc-ink: #fff; --sub: #000; }
.slide--signal { --bg: var(--orange); --fg: #0b0b0b; --mute: rgba(0,0,0,.78); --line: rgba(0,0,0,.2); --acc: #000; --acc-ink: #fff; --sub: rgba(0,0,0,.08); }
:root[data-theme="light"] .slide--ink    { --bg: var(--cream); --fg: #0b0b0b; --mute: #5b554e; --line: rgba(0,0,0,.13); --acc: #bb380a; --acc-ink: #fff; --sub: #fff; }
:root[data-theme="light"] .slide--carbon { --bg: #fff; --fg: #0b0b0b; --mute: #5b554e; --line: rgba(0,0,0,.13); --acc: #bb380a; --acc-ink: #fff; --sub: var(--cream); }
:root[data-theme="light"] .slide--paper  { --bg: #000; --fg: #f4f1ec; --mute: #9b948b; --line: rgba(255,255,255,.13); --acc: var(--orange); --acc-ink: #000; --sub: #000; }

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
* { margin: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: auto; }
body {
  min-height: 100svh; background: var(--page); color: var(--page-fg);
  font-family: var(--ff-b); font-size: 1rem; line-height: 1.6; -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}
body.is-gated { overflow: hidden; }
img, video { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; padding: 0; }
ul, ol { list-style: none; padding: 0; }
h1, h2, h3, h4 { font-weight: 800; line-height: 1.1; text-wrap: balance; }
p { text-wrap: pretty; }
::selection { background: var(--orange); color: #000; }
:focus-visible { outline: 2px solid var(--acc, var(--orange)); outline-offset: 3px; border-radius: 6px; }
.sr-only { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: fixed; left: 1rem; top: -4rem; z-index: 400; background: var(--orange); color: #000; padding: .6rem 1rem; border-radius: 10px; font-weight: 800; }
.skip:focus { top: 1rem; }
.wrap { width: 100%; max-width: 1400px; margin-inline: auto; padding-inline: calc(var(--gap) + var(--pad)); }
.i { width: 1.1em; height: 1.1em; flex: none; fill: currentColor; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.live { display: inline-block; width: .5rem; height: .5rem; border-radius: 50%; background: var(--orange); box-shadow: 0 0 0 0 rgba(255,90,31,.6); animation: live 2s infinite; flex: none; }
@keyframes live { to { box-shadow: 0 0 0 .6rem rgba(255, 90, 31, 0); } }

/* ── Yazı ── */
.hl { font-family: var(--ff-d); font-weight: 400; text-transform: uppercase; line-height: .92; letter-spacing: .005em; font-size: var(--t-h2); }
.hl--big { font-size: var(--t-big); line-height: .88; overflow-wrap: anywhere; }
.lead { color: var(--mute); font-size: clamp(1.02rem, .95rem + .3vw, 1.2rem); max-width: 52ch; line-height: 1.55; }

/* ── Butonlar ── */
.btns { display: flex; flex-wrap: wrap; gap: .6rem; }
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .6rem;
  min-height: 3.25rem; padding: 0 1.5rem; border-radius: 999px;
  font-weight: 800; text-decoration: none; white-space: nowrap;
  transition: transform .35s var(--ease), background-color .3s, color .3s, border-color .3s;
}
.btn:hover { transform: translateY(-2px); }
.btn:active { transform: translateY(0) scale(.98); }
.btn--o { background: var(--acc); color: var(--acc-ink); }
.btn--ink { background: #000; color: #fff; }
.btn--line { border: 2px solid var(--line); }
.btn--line:hover { border-color: var(--fg); }
.btn .i--arrow { transition: transform .3s var(--ease); }
.btn:hover .i--arrow { transform: translateX(3px); }

/* ==========================================================================
   Üst bar: kartların üstündeki sayfa boşluğunda yaşar
   ========================================================================== */
.bar {
  position: fixed; inset: 0 0 auto; z-index: 100; height: calc(var(--bar-h) + env(safe-area-inset-top, 0px));
  padding: env(safe-area-inset-top, 0px) calc(var(--gap) + 10px) 0;
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  background: var(--page); color: var(--page-fg);
}
.bar__mark { display: flex; align-items: center; gap: .65rem; text-decoration: none; font-family: var(--ff-d); font-size: 1.2rem; text-transform: uppercase; letter-spacing: .01em; }
.bar__mark img { width: 36px; height: 36px; border-radius: 50%; background: var(--orange); object-fit: cover; }
.bar__nav ul { display: flex; gap: .15rem; }
.bar__nav a { display: block; padding: .45rem .8rem; border-radius: 999px; text-decoration: none; font-weight: 700; font-size: .92rem; color: var(--page-mute); transition: color .25s, background-color .25s; }
.bar__nav a:hover { color: var(--page-fg); }
.bar__nav a[aria-current="true"] { color: #000; background: var(--orange); }
.bar__end { display: flex; align-items: center; gap: .4rem; }
.seg { display: flex; padding: 3px; border-radius: 999px; border: 1px solid color-mix(in srgb, var(--page-fg) 18%, transparent); }
.seg a { min-width: 2.5rem; padding: .28rem .55rem; text-align: center; border-radius: 999px; text-decoration: none; font-weight: 800; font-size: .78rem; color: var(--page-mute); }
.seg a[aria-current="true"] { color: #000; background: var(--orange); }
.iconbtn { width: 2.5rem; height: 2.5rem; border-radius: 50%; display: grid; place-items: center; border: 1px solid color-mix(in srgb, currentColor 22%, transparent); transition: border-color .3s, transform .3s var(--ease); }
.iconbtn:hover { border-color: currentColor; }
.iconbtn:active { transform: scale(.94); }
.iconbtn .i { width: 1.1rem; height: 1.1rem; }
[data-theme="dark"] .i--sun, [data-theme="light"] .i--moon { display: none; }
.eq { display: none; align-items: flex-end; gap: 2px; height: 14px; }
.eq i { width: 3px; height: 30%; border-radius: 2px; background: var(--orange); animation: eq .9s ease-in-out infinite alternate; }
.eq i:nth-child(2) { animation-delay: -.3s; } .eq i:nth-child(3) { animation-delay: -.6s; } .eq i:nth-child(4) { animation-delay: -.15s; }
@keyframes eq { 0% { height: 20%; } 100% { height: 100%; } }
.is-playing [data-music-toggle] .eq { display: inline-flex; }
.is-playing [data-music-toggle] .i--sound, .is-playing [data-music-toggle] .i--play { display: none; }
.bar__burger { display: none; width: 2.5rem; height: 2.5rem; position: relative; border-radius: 50%; border: 1px solid color-mix(in srgb, currentColor 22%, transparent); }
.bar__burger i { position: absolute; left: .75rem; right: .75rem; height: 2px; background: currentColor; transition: transform .4s var(--ease), top .4s var(--ease); }
.bar__burger i:first-child { top: .98rem; } .bar__burger i:last-child { top: 1.42rem; }
.bar__burger[aria-expanded="true"] i { top: 1.2rem; } .bar__burger[aria-expanded="true"] i:first-child { transform: rotate(45deg); } .bar__burger[aria-expanded="true"] i:last-child { transform: rotate(-45deg); }

.menu { position: fixed; inset: calc(var(--bar-h) + env(safe-area-inset-top, 0px)) var(--gap) var(--gap); z-index: 95; border-radius: var(--r); background: var(--orange); color: #000; display: grid; align-content: center; padding: 2rem var(--pad); perspective: 900px; overflow: auto; }
.menu a { display: flex; align-items: baseline; gap: .8rem; text-decoration: none; font-family: var(--ff-d); text-transform: uppercase; font-size: clamp(2.6rem, 12vw, 4.4rem); line-height: 1.08; transform-origin: 50% 100%; animation: menuIn .6s var(--ease) both; animation-delay: calc(var(--i) * 50ms); }
.menu a span { font-family: var(--ff-b); font-weight: 800; font-size: .8rem; }
@keyframes menuIn { from { opacity: 0; transform: translateY(50%) rotateX(-70deg); } }

/* ==========================================================================
   SLAYT: sitenin tek bileşeni
   ========================================================================== */
.anchor { position: relative; top: 0; height: 0; }
.slide {
  position: relative; top: auto;
  min-height: 100svh; min-height: 100svh;
  padding: calc(var(--bar-h) + env(safe-area-inset-top, 0px)) var(--gap) var(--gap);
  display: flex;
}
.slide__card {
  position: relative; flex: 1; min-width: 0;
  display: grid; grid-template-rows: auto 1fr auto; gap: clamp(14px, 2.4svh, 30px);
  padding: var(--pad); border-radius: var(--r);
  background: var(--bg); color: var(--fg);
  transform-origin: 50% 100%;
  transform: none;
  box-shadow: 0 -24px 60px -28px rgba(0, 0, 0, .75);
  overflow: clip;
}
.slide__card::after { content: ""; position: absolute; inset: 0; border-radius: inherit; background: #000; opacity: 0; pointer-events: none; }

.slide__chrome { display: flex; justify-content: space-between; gap: 1rem; font-weight: 800; font-size: .74rem; letter-spacing: .06em; text-transform: uppercase; color: var(--mute); font-variant-numeric: tabular-nums; }
.slide__chrome--top > :first-child { color: var(--acc); }
.slide__chrome--bot b { color: var(--acc); display: inline-block; animation: nudge 1.4s ease-in-out infinite; }
@keyframes nudge { 50% { transform: translateX(5px); } }
.slide__body { min-width: 0; display: grid; align-content: center; gap: clamp(18px, 3svh, 34px); }
.slide__head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 1rem 2rem; }
.slide__head > div:first-child { display: grid; gap: .8rem; }

/* ==========================================================================
   Kapak (giriş)
   ========================================================================== */
.gate { position: fixed; inset: 0; z-index: 300; display: flex; padding: var(--gap); background: var(--page); transition: opacity .5s var(--ease), visibility .5s; perspective: 1600px; }
.gate__card {
  --bg: #000; --fg: #f4f1ec; --mute: #9b948b; --acc: var(--orange); --acc-ink: #000; --line: rgba(255,255,255,.14);
  flex: 1; display: flex; flex-direction: column; align-items: center; padding: var(--pad); border-radius: var(--r); background: var(--bg); color: var(--fg);
  text-align: center; transform-origin: 50% 0; transition: transform .8s cubic-bezier(.7, 0, .2, 1), opacity .8s; overflow: auto;
}
.gate__me { width: clamp(120px, 18svh, 190px); height: auto; margin-top: auto; border-radius: 50%; background: var(--orange); animation: bob 3s ease-in-out infinite; }
@keyframes bob { 50% { transform: translateY(-8px) rotate(-3deg); } }
.gate__name { font-family: var(--ff-d); text-transform: uppercase; font-size: clamp(3.6rem, 13vw, 9rem); line-height: .86; margin-top: 1rem; }
.gate__name span { display: inline-block; }
.gate__copy { display: grid; justify-items: center; gap: .6rem; margin-top: 1.4rem; margin-bottom: auto; }
.gate__kicker { font-weight: 800; font-size: 1.15rem; }
.gate__line { color: var(--mute); max-width: 40ch; }
.gate__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem; margin-top: .8rem; }
.gate .slide__chrome { width: 100%; }
.gate.is-gone { opacity: 0; visibility: hidden; pointer-events: none; }
.gate.is-gone .gate__card { transform: translateY(-30%) rotateX(28deg) scale(.86); opacity: 0; }
html:not(.js) .gate { display: none; }

/* ==========================================================================
   01 Kapak slaytı
   ========================================================================== */
.hero { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); align-items: center; gap: clamp(24px, 4vw, 64px); }
.hero__text { display: grid; gap: 1.1rem; justify-items: start; }
.hero__name { font-family: var(--ff-d); font-weight: 400; text-transform: uppercase; font-size: clamp(4.4rem, 1rem + 10.5vw, 12.5rem); line-height: .84; letter-spacing: -.005em; }
.hero__name span { display: block; }
.hero__quip {
  display: inline-block; padding: .35rem .8rem .4rem; border-radius: 10px; background: var(--acc); color: var(--acc-ink);
  font-weight: 800; font-size: clamp(1.05rem, .9rem + .6vw, 1.45rem); line-height: 1.25; transform: rotate(-1.6deg); max-width: 30ch;
}
.hero__role { font-weight: 700; font-size: 1.05rem; }
.hero__lead { color: var(--mute); max-width: 50ch; }

/* Gönderi destesi: sürükle, dokun, ok tuşları */
.deck { position: relative; justify-self: center; width: min(400px, 72vw); aspect-ratio: 678 / 907; margin: 2rem 2rem 3rem 0; touch-action: pan-y; cursor: grab; outline: none; }
.deck:active { cursor: grabbing; }
.deck__card {
  position: absolute; inset: 0; border-radius: 18px; overflow: hidden; background: #111;
  box-shadow: 0 0 0 1px rgba(255,255,255,.08), 0 30px 50px -24px rgba(0,0,0,.9);
  transform-origin: 50% 110%;
  transform: translate3d(calc(var(--d, 0) * 16px + var(--dx, 0px)), calc(var(--d, 0) * -12px), 0) rotate(calc(var(--d, 0) * 3.2deg + var(--dr, 0deg))) scale(calc(1 - var(--d, 0) * .045));
  z-index: calc(20 - var(--d, 0));
  opacity: calc(1 - max(0, var(--d, 0) - 3) * 1);
  transition: transform .55s var(--ease), opacity .4s;
  user-select: none;
}
.deck__card.is-drag { transition: none; }
.deck__card img { width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
.deck__me { position: absolute; z-index: 30; left: -14%; bottom: -12%; width: 46%; filter: drop-shadow(0 18px 24px rgba(0,0,0,.55)); pointer-events: none; animation: bob 4s ease-in-out infinite; }
.deck__hint { position: absolute; right: -.5rem; bottom: -2.2rem; font-weight: 800; font-size: .74rem; letter-spacing: .06em; text-transform: uppercase; color: var(--mute); }
.deck__hint b { color: var(--acc); display: inline-block; animation: nudge 1.4s ease-in-out infinite; }
.deck:focus-visible { outline: 2px solid var(--acc); outline-offset: 12px; border-radius: 22px; }

.brands { display: flex; flex-wrap: wrap; align-items: baseline; gap: .4rem 1.4rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.brands__k { font-size: .82rem; color: var(--mute); }
.brands__list { display: flex; flex-wrap: wrap; gap: .3rem 1.4rem; }
.brands__list li { font-family: var(--ff-d); text-transform: uppercase; font-size: clamp(1rem, .8rem + .6vw, 1.35rem); letter-spacing: .01em; }

/* ==========================================================================
   Ray: işler, kariyer, galeri (aynı bileşen)
   ========================================================================== */
.rail { display: grid; gap: clamp(16px, 2.6svh, 28px); min-width: 0; }
.rail__nav { display: flex; align-items: center; gap: .6rem; }
.rail__count { font-weight: 800; font-size: .8rem; color: var(--mute); font-variant-numeric: tabular-nums; min-width: 4.2rem; text-align: center; }
.rail__count b { color: var(--fg); }
.rail__track {
  display: flex; gap: clamp(12px, 1.6vw, 20px); overflow-x: auto; overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory; scrollbar-width: none; outline: none;
  margin-inline: calc(var(--pad) * -1); padding: 6px var(--pad) 10px; scroll-padding-inline: var(--pad);
}
.rail__track::-webkit-scrollbar { display: none; }
.rail__track.is-drag { scroll-snap-type: none; cursor: grabbing; }
.rail__item { flex: none; scroll-snap-align: start; width: min(310px, 74vw); transform: none; }
.rail__item--job { width: min(420px, 84vw); }
.rail__item--shot { width: auto; }

/* Proje kartı */
.pcard { display: grid; grid-template-rows: auto 1fr; height: 100%; border-radius: 20px; overflow: hidden; background: var(--sub); color: var(--fg); text-decoration: none; box-shadow: 0 0 0 1px var(--line); transition: box-shadow .3s; }
.pcard:hover { box-shadow: 0 0 0 2px var(--acc); }
.pcard__body { display: grid; gap: .5rem; align-content: start; padding: 1rem 1.1rem 1.2rem; }
.pcard__meta { display: flex; justify-content: space-between; gap: 1rem; font-weight: 800; font-size: .72rem; letter-spacing: .04em; text-transform: uppercase; color: var(--mute); }
.pcard__meta span:first-child { color: var(--acc); }
.pcard__title { font-family: var(--ff-d); text-transform: uppercase; font-size: 1.9rem; line-height: .98; }
.pcard__sum { color: var(--mute); font-size: .93rem; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.pcard__go { font-weight: 800; font-size: .82rem; letter-spacing: .04em; text-transform: uppercase; }
.pcard__go b { color: var(--acc); }

.cover { position: relative; aspect-ratio: 1 / 1.08; overflow: hidden; background: #000; }
.cover__img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 12%; transition: transform .8s var(--ease); }
.cover__img--top { object-position: 50% 0; }
.pcard:hover .cover__img { transform: scale(1.04); }
.mock-agency { position: absolute; inset: 0; display: grid; place-content: center; justify-items: center; gap: .3rem; background: var(--orange); color: #000; text-align: center; }
.mock-agency b { font-family: var(--ff-d); font-weight: 400; font-size: clamp(4.5rem, 12vw, 7rem); line-height: .9; }
.mock-agency em { font-style: normal; font-weight: 800; font-size: .8rem; letter-spacing: .08em; text-transform: uppercase; }
.cover--hero { aspect-ratio: auto; height: 100%; max-height: 72svh; border-radius: 20px; }
.cover--hero .mock-agency b { font-size: clamp(6rem, 18vw, 12rem); }
.cover--video { border-radius: 20px; aspect-ratio: 600 / 680; max-height: 72svh; margin-inline: auto; }
.cover--video video { width: 100%; height: 100%; object-fit: cover; }
.cover__rec { position: absolute; left: .9rem; top: .9rem; display: flex; align-items: center; gap: .45rem; padding: .35rem .7rem; border-radius: 999px; background: rgba(0,0,0,.7); color: #fff; font-weight: 800; font-size: .72rem; letter-spacing: .04em; text-transform: uppercase; }

/* Kariyer kartı: bir carousel slaytı gibi */
.job {
  height: 100%; display: grid; grid-template-rows: auto auto auto auto 1fr auto; gap: .55rem;
  padding: 1.3rem 1.3rem 1.2rem; border-radius: 20px; background: #000; color: #f4f1ec;
  box-shadow: 0 24px 40px -26px rgba(0,0,0,.8);
}
:root[data-theme="light"] .slide--paper .job { background: var(--cream); color: #0b0b0b; }
.job__chrome { display: flex; justify-content: space-between; gap: 1rem; font-weight: 800; font-size: .72rem; letter-spacing: .05em; text-transform: uppercase; color: #9b948b; font-variant-numeric: tabular-nums; }
.job__chrome span:first-child { display: flex; align-items: center; gap: .45rem; color: var(--orange); }
.job__sector { margin-top: .9rem; font-size: .85rem; color: #9b948b; }
.job__org { font-family: var(--ff-d); font-weight: 400; text-transform: uppercase; font-size: clamp(2rem, 1.5rem + 1.6vw, 2.8rem); line-height: .95; }
.job__role { display: grid; gap: .05rem; font-size: .95rem; }
.job__role span { color: #9b948b; font-size: .88rem; }
.job__did { display: grid; gap: .45rem; align-content: start; margin-top: .4rem; font-size: .93rem; line-height: 1.5; color: #d9d4cd; }
.job__did li { display: grid; grid-template-columns: auto 1fr; gap: .6rem; }
.job__did li::before { content: ""; width: 7px; height: 7px; margin-top: .55em; border-radius: 2px; background: var(--orange); }
.job__lesson { margin-top: .6rem; padding-top: .9rem; border-top: 1px dashed rgba(255,255,255,.22); font-weight: 800; font-size: 1.02rem; line-height: 1.35; }
.job__lesson span { display: block; margin-bottom: .3rem; font-size: .7rem; letter-spacing: .06em; text-transform: uppercase; color: var(--orange); }
:root[data-theme="light"] .slide--paper .job__did { color: #3c3833; }
:root[data-theme="light"] .slide--paper .job__lesson { border-color: rgba(0,0,0,.2); }

/* Galeri karesi */
.shot { height: min(62svh, 520px); border-radius: 18px; overflow: hidden; background: #111; box-shadow: 0 0 0 1px var(--line); }
.shot img { height: 100%; width: auto; max-width: none; }

/* ==========================================================================
   04 Test (turuncu slayt)
   ========================================================================== */
.quiz { display: grid; justify-items: center; text-align: center; gap: 1.6rem; perspective: 1400px; }
.quiz__intro { display: grid; justify-items: center; gap: 1.2rem; }
.quiz__intro .hl { max-width: 13ch; }
.quiz__intro .lead { color: var(--fg); }
.quiz__stage { width: 100%; max-width: 820px; display: grid; gap: 1.4rem; }
.quiz__step { font-weight: 800; font-size: .76rem; letter-spacing: .06em; text-transform: uppercase; }
.quiz__q { font-family: var(--ff-d); text-transform: uppercase; font-size: clamp(2rem, 1.2rem + 3vw, 3.8rem); line-height: .95; }
.quiz__opts { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap: .6rem; }
.quiz__opt { display: flex; align-items: center; gap: .8rem; min-height: 3.8rem; padding: .8rem 1rem; border-radius: 16px; text-align: left; background: #000; color: #fff; font-weight: 700; transition: transform .3s var(--ease), background-color .25s; }
.quiz__opt:hover, .quiz__opt:focus-visible { transform: translateY(-3px) rotate(-.6deg); }
.quiz__opt b { flex: none; display: grid; place-items: center; width: 1.9rem; height: 1.9rem; border-radius: 50%; background: var(--orange); color: #000; font-size: .8rem; }
.quiz__nav button { font-weight: 800; font-size: .8rem; text-decoration: underline; text-underline-offset: 3px; }
.quiz__res { display: grid; justify-items: center; gap: 1rem; }
.quiz__res > p:not(.quiz__step):not(.quiz__q) { max-width: 54ch; font-size: 1.1rem; }
.quiz__dots { display: flex; gap: .35rem; }
.quiz__dots i { width: 7px; height: 7px; border-radius: 4px; background: rgba(0,0,0,.25); transition: width .3s var(--ease), background-color .3s; }
.quiz__dots i.is-on { width: 22px; background: #000; }
.quiz-in { animation: quizIn .55s var(--ease) both; transform-origin: 50% 0; }
@keyframes quizIn { from { opacity: 0; transform: rotateX(-40deg) translateY(30px); } }
.tags { display: flex; flex-wrap: wrap; gap: .4rem; }
.tags li { padding: .38rem .8rem; border-radius: 999px; border: 1.5px solid var(--line); font-size: .86rem; font-weight: 700; }
.quiz .tags { justify-content: center; }
.quiz .tags li { border-color: rgba(0,0,0,.35); }

/* ==========================================================================
   05 Bana sor
   ========================================================================== */
.ask { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(24px, 4vw, 64px); align-items: center; }
.ask__side { display: grid; gap: 1.1rem; }
.chat { display: grid; grid-template-columns: minmax(0, 1fr); gap: .9rem; padding: clamp(14px, 2vw, 22px); border-radius: 24px; background: var(--sub); box-shadow: 0 0 0 1px var(--line); }
.chat__top { display: flex; align-items: center; gap: .7rem; padding-bottom: .8rem; border-bottom: 1px solid var(--line); }
.chat__top img { width: 44px; height: 44px; border-radius: 50%; background: var(--orange); }
.chat__top p { display: grid; line-height: 1.25; }
.chat__top span { display: flex; align-items: center; gap: .4rem; font-size: .8rem; color: var(--mute); }
.chat__log { display: grid; grid-template-columns: minmax(0, 1fr); gap: .7rem; max-height: min(42svh, 26rem); overflow-y: auto; align-content: end; }
.msg { max-width: 90%; padding: .75rem 1rem; border-radius: 18px; line-height: 1.5; font-size: .96rem; }
.msg--q { justify-self: end; background: var(--orange); color: #000; font-weight: 600; border-bottom-right-radius: 6px; }
.msg--a { justify-self: start; background: color-mix(in srgb, var(--fg) 8%, transparent); border-bottom-left-radius: 6px; }
.msg--wait { color: var(--mute); }
.msg--a.is-typing::after { content: ""; display: inline-block; width: .5em; height: 1em; margin-left: 2px; vertical-align: -2px; background: var(--orange); animation: blink .8s steps(2) infinite; }
@keyframes blink { 50% { opacity: 0; } }
.chat__chips { display: flex; flex-wrap: wrap; gap: .4rem; }
.chat__chips button { padding: .42rem .85rem; border-radius: 999px; border: 1px solid var(--line); font-size: .84rem; font-weight: 600; color: var(--mute); text-align: left; transition: color .25s, border-color .25s; }
.chat__chips button:hover { color: var(--fg); border-color: var(--acc); }
.chat__form { display: flex; gap: .4rem; padding: .3rem; border-radius: 999px; background: var(--bg); box-shadow: 0 0 0 1px var(--line); }
.chat__form:focus-within { box-shadow: 0 0 0 2px var(--acc); }
.chat__form input { flex: 1; min-width: 0; background: transparent; border: 0; color: var(--fg); font: inherit; padding: 0 1rem; outline: none; }
.chat__form input::placeholder { color: var(--mute); }
.chat__send { display: inline-flex; align-items: center; gap: .4rem; min-height: 2.7rem; padding: 0 1.1rem; border-radius: 999px; background: var(--acc); color: var(--acc-ink); font-weight: 800; }
.chat__send[disabled] { opacity: .6; cursor: wait; }
.chat__note { font-size: .76rem; color: var(--mute); }

/* ==========================================================================
   06 Hakkımda
   ========================================================================== */
.about { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: clamp(24px, 4vw, 64px); align-items: center; }
.about__main { display: grid; gap: 1.1rem; }
.about__main > p { max-width: 60ch; font-size: 1.06rem; color: var(--mute); }
.about__main > p:first-of-type { color: var(--fg); font-size: clamp(1.1rem, 1rem + .4vw, 1.3rem); font-weight: 600; }
.facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem 1.4rem; margin-top: .6rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.facts div { display: grid; gap: .15rem; align-content: start; }
.facts dt { font-size: .78rem; color: var(--mute); }
.facts dd { font-weight: 800; line-height: 1.3; }
.facts a { display: inline-flex; align-items: center; gap: .3rem; color: var(--acc); text-decoration: none; }
.about__side { display: grid; gap: 1rem; align-content: start; }
.track { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: .5rem 1rem; padding: 1.1rem; border-radius: 22px; background: #000; color: #f4f1ec; }
:root[data-theme="light"] .slide--paper .track { background: var(--orange); color: #000; }
.track__play { width: 3.6rem; height: 3.6rem; border-radius: 50%; display: grid; place-items: center; background: var(--orange); color: #000; }
:root[data-theme="light"] .slide--paper .track__play { background: #000; color: #fff; }
.track__play .i--play { width: 1.25rem; height: 1.25rem; }
.track__play .eq i { background: currentColor; width: 4px; }
.track__t { font-family: var(--ff-d); font-size: 1.7rem; text-transform: uppercase; line-height: 1; }
.track__a { color: #9b948b; font-size: .9rem; }
:root[data-theme="light"] .slide--paper .track__a { color: rgba(0,0,0,.8); }
.track__note { grid-column: 1 / -1; font-size: .84rem; opacity: .8; }
.about__h { font-family: var(--ff-d); font-weight: 400; text-transform: uppercase; font-size: 1.6rem; margin-top: .4rem; }
.off { display: grid; gap: .5rem; }
.off li { display: flex; gap: .6rem; align-items: baseline; }
.off li::before { content: ""; width: 7px; height: 7px; border-radius: 2px; background: var(--acc); flex: none; transform: translateY(-1px); }

/* ==========================================================================
   07 İletişim (turuncu slayt)
   ========================================================================== */
.contact { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(24px, 4vw, 64px); align-items: center; }
.contact__copy { display: grid; gap: 1rem; justify-items: start; }
.contact__copy .lead { color: var(--fg); }
.direct__label { font-size: .8rem; font-weight: 700; margin-top: .4rem; }
.direct__mail { display: flex; flex-wrap: wrap; align-items: center; gap: .7rem; }
.direct__mail a { font-family: var(--ff-d); text-transform: lowercase; font-size: clamp(1.6rem, 1rem + 2.4vw, 2.7rem); line-height: 1; text-decoration: none; word-break: break-all; }
.direct__mail a:hover { text-decoration: underline; text-decoration-thickness: 3px; text-underline-offset: 5px; }
.direct__mail button { font-size: .78rem; font-weight: 800; padding: .35rem .8rem; border-radius: 999px; border: 1.5px solid currentColor; }
.social { display: flex; flex-wrap: wrap; gap: .5rem; }
.social a { display: inline-flex; align-items: center; gap: .45rem; padding: .55rem .95rem; border-radius: 999px; border: 1.5px solid var(--line); text-decoration: none; font-size: .9rem; font-weight: 700; transition: border-color .25s; }
.social a:hover { border-color: var(--fg); }
.form { display: grid; grid-template-columns: 1fr 1fr; gap: .9rem; padding: clamp(16px, 2.4vw, 26px); border-radius: 24px; background: #000; color: #f4f1ec; }
.field { display: grid; gap: .35rem; min-width: 0; }
.field--full, .form__foot { grid-column: 1 / -1; }
.field label, .topics legend { font-size: .8rem; font-weight: 700; color: #a29a91; }
.field input, .field textarea { width: 100%; padding: .8rem 1rem; border-radius: 14px; border: 1px solid rgba(255,255,255,.16); background: #121110; color: #f4f1ec; font: inherit; resize: vertical; transition: border-color .25s; }
.field input:focus, .field textarea:focus { outline: none; border-color: var(--orange); }
.field.is-bad input, .field.is-bad textarea { border-color: #ff4d4d; }
.topics { border: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; }
.topics legend { margin-bottom: .45rem; }
.topics label { position: relative; }
.topics input { position: absolute; opacity: 0; }
.topics span { display: inline-block; padding: .4rem .8rem; border-radius: 999px; border: 1px solid rgba(255,255,255,.2); font-size: .85rem; font-weight: 600; cursor: pointer; transition: all .2s; }
.topics input:checked + span { background: var(--orange); border-color: var(--orange); color: #000; }
.topics input:focus-visible + span { outline: 2px solid var(--orange); outline-offset: 2px; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form__foot { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; }
.form .btn--ink { background: var(--orange); color: #000; }
.form__status { font-size: .9rem; }
.form__status.is-ok { color: #5fe39a; }
.form__status.is-err { color: #ff7a7a; }

/* ==========================================================================
   Proje sayfası
   ========================================================================== */
.crumbs a { font-weight: 800; font-size: .85rem; text-decoration: none; color: var(--mute); }
.crumbs a:hover { color: var(--fg); }
.slide--proj .slide__body { grid-template-rows: auto 1fr; align-content: stretch; }
.proj { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(24px, 4vw, 64px); align-items: center; }
.proj__text { display: grid; gap: 1.1rem; }
.hl--proj { font-size: clamp(3.4rem, 1rem + 8vw, 9rem); line-height: .86; }
.facts--proj { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 40rem; }
.proj__note { font-size: .88rem; color: var(--mute); }
.proj__media { display: grid; justify-items: center; }
.proj__media .cover--hero { width: min(100%, 460px); aspect-ratio: 3 / 3.6; height: auto; }
.proj__media .cover--hero.cover--agency { aspect-ratio: 1; }

.story { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 64px); align-items: start; }
.story__col { display: grid; gap: 1.1rem; }
.story__lead { font-size: clamp(1.08rem, 1rem + .4vw, 1.3rem); font-weight: 600; line-height: 1.5; }
.story__h { font-family: var(--ff-d); font-weight: 400; text-transform: uppercase; font-size: 1.6rem; }
.quote { padding: 1.2rem 1.3rem; border-radius: 20px; background: var(--acc); color: var(--acc-ink); }
.quote p { font-weight: 800; font-size: 1.08rem; line-height: 1.45; }
.quote span { display: block; margin-bottom: .3rem; font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; opacity: .75; }
.ticks { display: grid; gap: .7rem; }
.ticks li { display: grid; grid-template-columns: auto 1fr; gap: .7rem; color: var(--mute); }
.ticks li::before { content: ""; width: 8px; height: 8px; margin-top: .55em; border-radius: 2px; background: var(--acc); }

.swaps { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: .5rem; counter-reset: sw; }
.swaps li { counter-increment: sw; display: grid; grid-template-columns: 2rem auto auto 1fr; grid-template-areas: "n k k k" "n a r b"; align-items: baseline; gap: .1rem .55rem; padding: .85rem 1rem; border-radius: 16px; background: var(--sub); box-shadow: 0 0 0 1px var(--line); }
.swaps li::before { content: counter(sw, decimal-leading-zero); grid-area: n; font-weight: 800; font-size: .78rem; color: var(--acc); }
.swaps__k { grid-area: k; font-size: .76rem; color: var(--mute); }
.swaps__option { grid-area: a; font-weight:700; }
.swaps__arrow { grid-area: r; color: var(--acc); font-weight: 800; }
.swaps li b { grid-area: b; }

.next { display: grid; gap: .8rem; text-decoration: none; position: relative; padding-right: 4rem; }
.next__k { font-weight: 800; font-size: .85rem; }
.next__t { font-family: var(--ff-d); text-transform: uppercase; font-size: clamp(3.4rem, 1rem + 9vw, 10rem); line-height: .86; }
.next__s { max-width: 50ch; font-size: 1.05rem; }
.next__go { position: absolute; right: 0; bottom: 0; font-family: var(--ff-d); font-size: clamp(4rem, 9vw, 9rem); line-height: .8; transition: transform .4s var(--ease); }
.next:hover .next__go { transform: translateX(12px); }

/* ==========================================================================
   Alt bilgi, sayaç, müzik hapı
   ========================================================================== */
.foot { position: relative; z-index: 2; background: var(--page); padding-top: 2rem; }
.foot__giant { display: flex; flex-wrap: wrap; justify-content: center; gap: 0 .2em; font-family: var(--ff-d); text-transform: uppercase; font-size: clamp(4rem, 17vw, 17rem); line-height: .84; padding-inline: var(--gap); text-decoration: none; color: var(--orange); }
.foot__giant span:first-child { color: var(--page-fg); }
.foot__row { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; padding-block: 1.5rem 6rem; margin-top: 1.5rem; border-top: 1px solid color-mix(in srgb, var(--page-fg) 14%, transparent); color: var(--page-mute); font-size: .88rem; }
.foot__links { display: flex; flex-wrap: wrap; gap: .4rem 1.2rem; }
.foot__links a { text-decoration: none; }
.foot__links a:hover { color: var(--orange); }

.counter {
  position: fixed; left: calc(var(--gap) + 12px); bottom: calc(var(--gap) + 12px + env(safe-area-inset-bottom, 0px)); z-index: 80;
  display: flex; align-items: center; gap: .35rem; padding: .45rem .8rem; border-radius: 999px;
  background: #000; color: #f4f1ec; font-weight: 800; font-size: .74rem; letter-spacing: .05em; font-variant-numeric: tabular-nums;
  box-shadow: 0 0 0 1px rgba(255,255,255,.14);
  opacity: 0; transform: translateY(8px); transition: opacity .4s, transform .4s var(--ease);
}
.counter.is-on { opacity: 1; transform: none; }
.counter b { color: var(--orange); }
.counter em { font-style: normal; margin-left: .3rem; padding-left: .55rem; border-left: 1px solid rgba(255,255,255,.25); text-transform: uppercase; }

.np-pill {
  position: fixed; right: calc(var(--gap) + 12px); bottom: calc(var(--gap) + 12px + env(safe-area-inset-bottom, 0px)); z-index: 110;
  display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .7rem;
  width: min(300px, calc(100vw - 2rem)); padding: .45rem .5rem .65rem .45rem; border-radius: 999px;
  background: #000; color: #f4f1ec; box-shadow: 0 0 0 1px rgba(255,255,255,.14), 0 20px 40px -20px rgba(0,0,0,.8);
  transition: transform .5s var(--ease), opacity .4s;
}
.np-pill[hidden] { display: grid !important; opacity: 0; pointer-events: none; transform: translateY(140%); }
.np-pill__play { width: 2.6rem; height: 2.6rem; border-radius: 50%; display: grid; place-items: center; background: var(--orange); color: #000; }
.np-pill__play .eq i { background: #000; }
.np-pill__meta { display: grid; line-height: 1.2; min-width: 0; }
.np-pill__meta b { font-family: var(--ff-d); font-weight: 400; font-size: 1.02rem; text-transform: uppercase; }
.np-pill__meta span { font-size: .7rem; color: #a29a91; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.np-pill__btn { width: 2.2rem; height: 2.2rem; border-radius: 50%; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.2); }
.np-pill__bar { position: absolute; left: 3.4rem; right: 1.4rem; bottom: .38rem; height: 2px; border-radius: 2px; background: rgba(255,255,255,.14); overflow: hidden; }
.np-pill__bar i { display: block; height: 100%; width: 100%; transform-origin: left; transform: scaleX(var(--np, 0)); background: var(--orange); }

/* Short, non-blocking page feedback. The reading surface never rotates or scales. */
.pt-in main { animation: pageReady .18s ease-out both; }
@keyframes pageReady { from { opacity:.75; } to { opacity:1; } }
main[aria-busy=true] { cursor:progress; }

/* ── 404 ── */
.nf__slide { position: relative; }
.nf__body { justify-items: center; text-align: center; }
.nf__body img { width: 140px; border-radius: 50%; background: #000; }
.nf__body .lead { color: #000; }

/* ==========================================================================
   Duyarlı
   ========================================================================== */
@media (max-width: 1180px) {
  .bar__nav { display: none; }
  .bar__burger { display: block; }
}
@media (max-width: 900px) {
  :root { --r: 24px; --bar-h: 58px; }
  .hero, .ask, .about, .contact, .proj, .story { grid-template-columns: minmax(0, 1fr); }
  .hero { gap: 1.6rem; }
  .deck { order: -1; width: min(260px, 62vw); margin: .4rem 0 1.4rem 2.4rem; }
  .deck__me { width: 44%; left: -22%; }
  .hero__name { font-size: clamp(3.6rem, 18vw, 6.2rem); }
  .facts { grid-template-columns: 1fr 1fr; }
  .proj__media { order: -1; }
  .proj__media .cover--hero, .cover--video { width: min(100%, 360px); max-height: 50svh; }
  .chat__log { max-height: 40svh; }
}
@media (max-width: 560px) {
  :root { --gap: 6px; --pad: 16px; }
  .bar__mark span { display: none; }
  .bar__end { gap: .3rem; }
  .iconbtn, .bar__burger { width: 2.3rem; height: 2.3rem; }
  .bar__burger i:first-child { top: .92rem; } .bar__burger i:last-child { top: 1.36rem; } .bar__burger[aria-expanded="true"] i { top: 1.14rem; }
  .seg a { min-width: 2.2rem; }
  .form { grid-template-columns: minmax(0, 1fr); }
  .slide__head .rail__nav { width: 100%; justify-content: space-between; }
  .counter em { display: none; }
  .counter { display: none; }
  .np-pill { left: 50%; right: auto; transform: translateX(-50%); }
  .np-pill[hidden] { transform: translate(-50%, 140%); }
  .next { padding-right: 0; }
  .next__go { display: none; }
  .brands__list li { font-size: .95rem; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
/* Personal editorial layer — same Anton / Manrope, same four card colours. */
.hero__edition,.eyebrow { font-size:.71rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--acc,var(--orange)); }
.hero__edition { margin-bottom:1.3rem; }
.hero__explore { display:flex; align-items:center; justify-content:space-between; gap:1rem; width:100%; border-top:1px solid var(--line); padding-top:1rem; color:var(--fg); text-decoration:none; font-size:.85rem; font-weight:700; }
.hero__explore > :last-child { display:grid; place-items:center; width:34px; height:34px; border:1px solid var(--line); border-radius:50%; transition:transform .25s; }
.hero__explore:hover > :last-child { transform:translateY(4px); }
.worlds__head,.journal__head { display:grid; grid-template-columns:1.1fr 1fr; align-items:end; gap:2rem; }
.worlds__head .hl,.journal__head .hl { max-width:15ch; overflow-wrap:normal; }
.worlds__head .lead,.journal__head .lead { max-width:44ch; }
.worlds { display:grid; grid-template-columns:170px minmax(0,1fr); gap:clamp(20px,3vw,48px); align-items:start; }
.worlds__tabs { display:grid; border-top:1px solid var(--line); }
.worlds__tabs button { display:grid; grid-template-columns:20px 1fr 16px; gap:.6rem; align-items:center; text-align:left; padding:1.15rem 0; border-bottom:1px solid var(--line); font-weight:800; font-size:.9rem; }
.worlds__tabs button span { font-size:.65rem; color:var(--mute); font-variant-numeric:tabular-nums; }
.worlds__tabs button b { color:var(--acc); opacity:0; transform:translate(-4px,4px); transition:transform .25s,opacity .25s; }
.worlds__tabs button[aria-selected=true] b { opacity:1; transform:none; }
.worlds__tabs button[aria-selected=true] { color:var(--acc); }
.worlds__stage { min-width:0; perspective:1400px; }
.world { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); align-items:center; gap:clamp(24px,4vw,56px); animation:world-in .5s var(--ease) both; }
.world__visual { min-width:0; position:relative; background:#111; color:#f4f1ec; padding:10px; border-radius:14px; transform:perspective(1200px) rotateX(var(--depth-x,3deg)) rotateY(var(--depth-y,-7deg)); transition:transform .35s var(--ease); box-shadow:12px 15px 0 -7px var(--acc),22px 28px 45px -28px #0008; }
.world__photo { height:clamp(240px,27vw,355px); border-radius:7px; overflow:hidden; background:#000; }
.world__photo img { width:100%; height:100%; object-fit:contain; }
#world-panel-0 .world__photo img { object-fit:cover; }
.world__visual figcaption { font-size:.65rem; padding:12px 2px 2px; line-height:1.5; }
.world__number { position:absolute; top:16px; right:18px; font:2.4rem/1 var(--ff-d); color:var(--orange); text-shadow:0 1px 12px #000; }
.world__copy { display:grid; gap:1.15rem; }
.world__copy h3 { font-family:var(--ff-d); font-weight:400; font-size:clamp(2rem,3.2vw,3.7rem); line-height:1.03; text-transform:uppercase; }
.world__copy > p:not(.eyebrow) { color:var(--mute); font-size:.93rem; line-height:1.75; }
.world__tags { display:flex; flex-wrap:wrap; gap:.4rem; }
.world__tags li { border:1px solid var(--line); border-radius:99px; padding:.28rem .6rem; font-size:.65rem; font-weight:700; }
.textlink { display:flex; justify-content:space-between; gap:1rem; align-items:center; padding:.75rem 0; border-bottom:2px solid var(--acc); text-decoration:none; font-size:.84rem; font-weight:800; }
.textlink span { font-size:1.35rem; color:var(--acc); transition:transform .25s; }
.textlink:hover span { transform:translate(3px,-3px); }
.worlds__hint { text-align:right; font-size:.69rem; color:var(--mute); }
@keyframes world-in { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:none; } }
.journal { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:14px; }
.journal__item { min-width:0; border:1px solid var(--line); border-radius:18px; overflow:hidden; background:var(--sub); }
.journal__link { height:100%; display:flex; flex-direction:column; color:inherit; text-decoration:none; }
.journal__image { overflow:hidden; background:#000; }
.journal__image img { width:100%; height:100%; object-fit:contain; transition:transform .6s var(--ease); }
.journal__link:hover .journal__image img { transform:scale(1.025); }
.journal__body { display:grid; gap:.8rem; padding:clamp(18px,2.2vw,28px); flex:1; align-content:start; }
.journal__body h3 { font:400 clamp(1.6rem,2.5vw,2.7rem)/1.05 var(--ff-d); text-transform:uppercase; }
.journal__body > p:not(.eyebrow) { font-size:.85rem; line-height:1.7; color:var(--mute); }
.journal__open { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-top:auto; padding-top:.6rem; font-size:.73rem; font-weight:800; }
.journal__open b { color:var(--acc); font-size:1.3rem; }
.journal__type { font:400 clamp(2rem,4vw,4rem)/.94 var(--ff-d); text-transform:uppercase; display:grid; padding:24px 24px 0; letter-spacing:-.02em; }
.journal__type span:nth-child(2) { transform:translateX(8px); }
.journal__type span:last-child { -webkit-text-stroke:1px #000; color:transparent; }
.field-process { display:grid; grid-template-columns:repeat(3,1fr); gap:1.6rem; margin-top:1rem; border-top:1px solid var(--line); padding-top:2rem; }
.field-process article { display:grid; gap:.8rem; }
.field-process h3 { font:400 clamp(1.5rem,2.6vw,2.8rem)/1.05 var(--ff-d); text-transform:uppercase; }
.field-process article > p:last-child { font-size:.85rem; color:var(--mute); }
.project--field .proj { grid-template-columns:1fr 1.15fr; }
.project--field .proj__media .cover--hero { width:100%; max-width:650px; aspect-ratio:3/2; transform:perspective(1300px) rotateY(-6deg); border-radius:16px; box-shadow:12px 14px 0 -5px var(--acc); }
.project--field .proj__media .cover--hero img { object-position:center; }
.project--field .rail__item--shot { flex-basis:min(75vw,640px); }
.project--field .shot img { aspect-ratio:3/2; object-fit:contain; }
.foot__links button { text-decoration:underline; text-underline-offset:3px; font-size:inherit; }
.privacy-note { position:fixed; z-index:220; bottom:max(18px,env(safe-area-inset-bottom)); left:18px; width:min(390px,calc(100vw - 36px)); padding:20px; border-radius:18px; background:var(--cream); color:#111; border:1px solid #0002; box-shadow:0 12px 50px #0003; font-size:.75rem; line-height:1.65; }
.is-gated .privacy-note { display:none; }
.privacy-note__title { font:400 1.6rem/1.1 var(--ff-d); margin-bottom:.6rem; text-transform:uppercase; }
.privacy-note > div { display:flex; gap:1rem; justify-content:space-between; align-items:center; margin-top:1rem; }
.privacy-note__details { text-decoration:underline; text-underline-offset:3px; font-weight:700; }
.privacy-note__ok { padding:.6rem 1.2rem; background:var(--orange); border-radius:99px; color:#000; font-weight:800; }
.privacy-dialog { position:fixed; inset:0; margin:auto; width:min(600px,calc(100vw - 28px)); max-height:85svh; overflow:auto; border:0; border-radius:22px; padding:clamp(24px,4vw,42px); background:var(--cream); color:#111; box-shadow:0 20px 80px #0006; }
.privacy-dialog::backdrop { background:#0009; backdrop-filter:blur(5px); }
.privacy-dialog__close { position:absolute; top:15px; right:20px; font-size:2rem; width:34px; height:34px; line-height:1; }
.privacy-dialog h2 { font:400 clamp(2.2rem,5vw,3.4rem)/1.03 var(--ff-d); text-transform:uppercase; margin:1rem 2rem 1.8rem 0; }
.privacy-dialog section { margin:1.3rem 0; }
.privacy-dialog h3 { font-size:.95rem; margin-bottom:.4rem; }
.privacy-dialog section p { font-size:.82rem; color:#48443f; }
.privacy-dialog > a { font-size:.85rem; font-weight:800; }
@media (max-width:1100px) {
 .bar__nav a { font-size:.74rem; }
 .bar__nav ul { gap:1rem; }
 .worlds { grid-template-columns:130px minmax(0,1fr); gap:24px; }
 .world { gap:24px; }
}
@media (max-width:760px) {
 .worlds__head,.journal__head { grid-template-columns:1fr; gap:1rem; }
 .worlds__head .hl,.journal__head .hl { max-width:13ch; font-size:clamp(2.7rem,10vw,4.7rem); }
 .worlds { grid-template-columns:1fr; gap:28px; }
 .worlds__tabs { grid-template-columns:repeat(3,1fr); border-top:0; gap:8px; }
 .worlds__tabs button { grid-template-columns:1fr; gap:.4rem; text-align:center; border:1px solid var(--line); border-radius:10px; padding:.7rem .3rem; font-size:.8rem; }
 .worlds__tabs button b { display:none; }
 .worlds__tabs button[aria-selected=true] { background:var(--acc); color:var(--acc-ink); border-color:var(--acc); }
 .worlds__tabs button[aria-selected=true] span { color:inherit; }
 .world { grid-template-columns:1fr; gap:30px; }
 .world__visual { margin:0 10px 0 4px; transform:perspective(1200px) rotateY(-4deg); }
 .world__photo { height:260px; }
 .world__copy h3 { font-size:2.7rem; }
 .worlds__hint { text-align:left; }
 .journal { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
 .journal__body > p:not(.eyebrow) { font-size:.78rem; }
 .journal__type { font-size:clamp(1.7rem,6vw,2.9rem); padding:20px 16px 0; }
 .field-process { grid-template-columns:1fr; gap:1.7rem; }
 .project--field .proj { grid-template-columns:1fr; }
 .project--field .proj__media .cover--hero { max-height:none; }
 .hero__edition { font-size:.65rem; letter-spacing:.08em; }
 .privacy-note { bottom:max(12px,env(safe-area-inset-bottom)); left:12px; width:calc(100vw - 24px); padding:16px; }
 .privacy-note__title { font-size:1.35rem; }
}
@media (prefers-reduced-motion:reduce) {
 .world,.world__visual,.project--field .proj__media .cover--hero { animation:none; transform:none; }
 .journal__link:hover .journal__image img,.textlink:hover span,.hero__explore:hover > :last-child { transform:none; }
}
@media print { .privacy-note,.privacy-dialog { display:none!important; } }


/* Stable reading on phones: native flow, fixed card width and no scroll-driven compositing. */
@media (max-width:900px), (hover:none), (pointer:coarse), (prefers-reduced-motion:reduce) {
 .slide { position:relative; top:auto; }
 .slide__card { transform:none; will-change:auto; box-shadow:none; }
 .rail__track { perspective:none; }
 .rail__item { transform:none; }
 .pt-in main { animation:none; }
 .deck__me,.gate__me,.deck__hint b,.slide__chrome--bot b,.live { animation:none; }
 .deck__me { filter:none; }
 .gate { transition:opacity .16s,visibility .16s; }
 .gate.is-gone .gate__card { transform:none; opacity:1; transition:none; }
 .world__visual { transition:none; }
}

@media (hover:none), (pointer:coarse) {
 .btn:hover,.btn:hover .i--arrow,.quiz__opt:hover,.pcard:hover .cover__img,.journal__link:hover .journal__image img,.textlink:hover span,.hero__explore:hover > :last-child { transform:none; }
 .cover__img,.journal__image img { transition:none; }
}

/* Readable display type and explicit source / story choices. No scroll transforms. */
.hl { line-height: 1.08; overflow-wrap: normal; word-break: normal; }
.hl--big { line-height: 1.06; overflow-wrap: normal; }
.hero__name { line-height: .98; }
.hero__name span { display: block; }
.gate__name, .foot__giant { line-height: 1.02; }
.hl--proj { font-size: clamp(2.2rem, .9rem + 5.6vw, 6.5rem); line-height: 1.08; overflow-wrap: break-word; }
.pcard__title, .job__org, .quiz__q, .next__t { line-height: 1.1; }
.next__t { font-size: clamp(2.25rem, .9rem + 6vw, 7rem); overflow-wrap: break-word; }
.proj__text, .world__copy, .slide__head > div { min-width: 0; }
.pcard__body { align-content: stretch; grid-template-rows: auto auto 1fr auto; }
.pcard__meta { flex-wrap: wrap; gap: .3rem .8rem; }
.pcard__meta span:last-child { white-space: nowrap; }
.pcard__sum { display: block; overflow: visible; }
.pcard__source { display: block; }
.pcard__actions { display: grid; gap: .7rem; padding-top: .7rem; border-top: 1px solid var(--line); }
.pcard__actions a { display: flex; align-items: center; justify-content: space-between; min-height: 44px; text-decoration: none; gap: .6rem; }
.pcard__detail { font-size: .82rem; color: var(--mute); }
.pcard__actions a:hover, .pcard__actions a:focus-visible { text-decoration: underline; text-underline-offset: .25em; }
.pcard:hover .cover__img { transform: none; }
.world__links { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem 1.5rem; }
.world__detail { font-size: .8rem; color: var(--mute); }
.work-filters { display: flex; flex-wrap: wrap; gap: .5rem; margin: .1rem 0 1.1rem; }
.work-filters button { min-height: 44px; padding: .55rem .9rem; border: 1px solid var(--line); border-radius: 99px; font-size: .8rem; font-weight: 700; }
.work-filters button[aria-pressed="true"] { background: var(--acc); color: var(--acc-ink); border-color: var(--acc); }
.work-filters button:focus-visible { outline: 2px solid var(--acc); outline-offset: 3px; }
.type-cover { position: absolute; inset: 0; background: var(--orange); color: #111; padding: 1.4rem; display: flex; flex-direction: column; justify-content: space-between; gap: 1rem; }
.type-cover > span { font-size: .65rem; letter-spacing: .14em; font-weight: 800; }
.type-cover b { font: 400 clamp(2.4rem, 5vw, 4rem)/1.12 var(--ff-d); }
.type-cover em { font-size: .8rem; font-style: normal; font-weight: 700; }
@media (max-width: 600px) {
  .hl--big { font-size: clamp(2.2rem, 10.5vw, 3.8rem); }
  .hl--proj { font-size: clamp(2.2rem, 10vw, 3.6rem); }
  .hero__name { font-size: clamp(4.2rem, 20vw, 6rem); }
  .worlds__head, .slide__head { gap: 1.2rem; }
  .next { padding-right: 2.5rem; }
  .next__go { font-size: 3rem; }
  .work-filters { gap: .4rem; }
  .work-filters button { padding-inline: .75rem; font-size: .74rem; }
}

/* Real source media: local posters keep the page light; playback opens the original. */
.cover__caption { position:absolute; inset:auto 0 0; padding:2rem 1rem .8rem; color:#fff; background:linear-gradient(transparent,rgba(0,0,0,.85)); font-size:.67rem; line-height:1.45; font-weight:700; pointer-events:none; }
.cover__play { position:absolute; top:1rem; right:1rem; padding:.45rem .65rem; border:1px solid #fff5; border-radius:99px; background:#111d; color:#fff; font-size:.7rem; font-weight:800; pointer-events:none; }
.cover__img--portrait { object-position:50% 32%; }
.cover__img--field { object-position:50% 50%; }
.proj__source { display:block; width:min(100%,460px); border-radius:20px; text-decoration:none; }
.proj__source .cover--hero { width:100%; }
.proj__source:focus-visible { outline:3px solid var(--orange); outline-offset:5px; }
.archive-cover { position:absolute; inset:0; display:flex; flex-direction:column; justify-content:space-between; gap:1.5rem; padding:1.5rem; background:#e8e2d6; color:#182b30; border:1px solid #182b3033; }
.archive-cover > span { font-size:.65rem; font-weight:800; letter-spacing:.08em; }
.archive-cover b { font:400 clamp(2rem,5vw,4.3rem)/1.12 var(--ff-d); }
.archive-cover em { font-size:.72rem; font-style:normal; line-height:1.6; border-top:1px solid #182b3044; padding-top:1rem; }
.source-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,270px),1fr)); gap:1.4rem; align-items:start; }
.source-grid--single { width:min(100%,440px); margin-inline:auto; }
.source-card { display:block; min-width:0; overflow:hidden; border:1px solid var(--line); border-radius:20px; background:var(--sub); color:var(--fg); text-decoration:none; }
.source-card figure { position:relative; background:#111; }
.source-card img { width:100%; height:auto; display:block; }
.source-card--photo figure { aspect-ratio:4/3; }
.source-card--photo img { height:100%; object-fit:cover; }
.source-card__play { position:absolute; right:1rem; bottom:1rem; width:44px; height:44px; display:grid; place-items:center; border-radius:50%; background:var(--orange); color:#111; font-size:1.15rem; }
.source-card > div { display:grid; gap:.7rem; padding:1.3rem; }
.source-card h3 { font-family:var(--ff-d); font-weight:400; font-size:clamp(1.5rem,2vw,2.2rem); line-height:1.15; }
.source-card p:not(.eyebrow) { color:var(--mute); font-size:.87rem; line-height:1.65; }
.source-card__open { font-weight:800; font-size:.77rem; padding-top:.4rem; }
.source-card:hover .source-card__open { text-decoration:underline; text-underline-offset:.25em; }
.proof-signals { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; margin-top:1.5rem; padding-block:1.4rem; border-block:1px solid var(--line); }
.proof-signals p { display:grid; gap:.5rem; }
.proof-signals strong { font:400 clamp(2rem,4vw,4rem)/1.1 var(--ff-d); }
.proof-signals span { font-size:.8rem; color:var(--mute); }
.proof-note { font-size:.7rem; color:var(--mute); }
.source-links { display:flex; flex-wrap:wrap; gap:1rem 2rem; }
.world__photo:has(img[src*="/reels/"]) img { object-position:50% 30%; }
@media (max-width:600px) { .source-grid { grid-template-columns:1fr; } .proof-signals { gap:.6rem; } .proof-signals span { font-size:.7rem; } .proof-signals strong { font-size:2rem; } }

/* Açık arşiv: sayıdan bağımsız tek tip ızgara; ilk paylaşım vitrinde */
.journal { grid-template-columns:repeat(4,minmax(0,1fr)); grid-auto-flow:dense; }
.journal__image { aspect-ratio:4/5; flex:none; }
.journal__image img { object-fit:cover; object-position:center 28%; }
.journal__item:first-child { grid-column:span 2; grid-row:span 2; }
.journal__item:first-child .journal__image { aspect-ratio:auto; flex:1; min-height:320px; }
.journal__item:first-child .journal__body h3 { font-size:clamp(2rem,3.2vw,3.4rem); }
.journal__item:first-child .journal__body { flex:none; }
.journal__body h3 { font-size:clamp(1.35rem,1.75vw,2rem); }
.journal__item { transition:border-color .25s, transform .35s var(--ease); }
.journal__item:hover { border-color:var(--acc); transform:translateY(-3px); }
@media (max-width:1100px) { .journal { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:760px) {
 .journal { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .journal__item:first-child { grid-row:auto; }
 .journal__item:first-child .journal__image { aspect-ratio:4/5; flex:none; min-height:0; }
 .journal__body { padding:14px; gap:.55rem; }
 .journal__body h3 { font-size:1.25rem; }
}

/* Kamerada: gerçek video duvarı */
.camera__head { display:grid; grid-template-columns:1.1fr 1fr; align-items:end; gap:2rem; }
.camera__head .hl { max-width:14ch; }
.camera__head .lead { max-width:44ch; }
.camera__stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); margin:clamp(22px,3vw,40px) 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.camera__stats > div { padding:clamp(14px,1.8vw,24px) clamp(10px,1.4vw,20px); display:grid; gap:.45rem; align-content:start; }
.camera__stats > div + div { border-left:1px solid var(--line); }
.camera__stats dt { display:flex; align-items:baseline; gap:.45rem; flex-wrap:wrap; }
.camera__stats b { font:400 clamp(2.6rem,5vw,4.8rem)/.9 var(--ff-d); color:var(--acc); letter-spacing:.005em; }
.camera__stats dt span { font-size:.72rem; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }
.camera__stats dd { font-size:.8rem; line-height:1.55; color:var(--mute); max-width:24ch; }
.reelwall { position:relative; display:grid; gap:14px; margin-inline:calc(var(--pad,24px) * -1); overflow:hidden; }
/* Kenar solması: maske yerine kaplama, 3D kart içinde ucuz kalır */
.reelwall::before,.reelwall::after { content:""; position:absolute; top:0; bottom:0; width:6%; z-index:2; pointer-events:none; }
.reelwall::before { left:0; background:linear-gradient(90deg,var(--bg),transparent); }
.reelwall::after { right:0; background:linear-gradient(-90deg,var(--bg),transparent); }
.reelwall.is-off .reelwall__track { animation-play-state:paused; }
.reelwall__track { display:flex; width:max-content; animation:reel-slide calc(var(--n) * 7s) linear infinite; }
.reelwall__row--1 .reelwall__track { animation-direction:reverse; animation-duration:calc(var(--n) * 8s); }
.reelwall:hover .reelwall__track,.reelwall:focus-within .reelwall__track,.reelwall.is-paused .reelwall__track { animation-play-state:paused; }
@keyframes reel-slide { to { transform:translateX(-50%); } }
.reel { position:relative; flex:none; width:clamp(138px,12.5vw,196px); aspect-ratio:9/16; margin-right:14px; border-radius:18px; overflow:hidden; background:#111; border:1px solid var(--line); color:#fff; text-decoration:none; isolation:isolate; transition:transform .35s var(--ease), box-shadow .35s var(--ease); }
.reel img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-1; transition:transform .6s var(--ease); }
.reel:hover,.reel:focus-visible { transform:translateY(-6px) rotate(-1.2deg); box-shadow:0 0 0 2px var(--orange),0 22px 40px -18px #000c; }
.reel:hover img { transform:scale(1.05); }
.reel__top { position:absolute; top:9px; left:9px; right:9px; display:flex; justify-content:space-between; gap:6px; align-items:center; }
.reel__pf { font-style:normal; font-size:.58rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; padding:.28rem .5rem; border-radius:99px; background:#000c; } /* bulanıklık yok: 30 rozetin her biri ayrı katman olup 3D kartı parçalıyordu */
.reel__pf--facebook::before,.reel__pf--instagram::before { content:""; display:inline-block; width:.45rem; height:.45rem; border-radius:50%; margin-right:.35rem; background:#3b82f6; vertical-align:.02rem; }
.reel__pf--instagram::before { background:linear-gradient(45deg,#f59e0b,#ec4899,#8b5cf6); }
.reel__views { font-size:.62rem; font-weight:900; padding:.28rem .5rem; border-radius:99px; background:var(--orange); color:#000; white-space:nowrap; }
.reel__label { position:absolute; left:0; right:0; bottom:0; padding:44px 11px 11px; display:grid; gap:.3rem; font-size:.74rem; font-weight:800; line-height:1.3; background:linear-gradient(transparent,#000d 55%); }
.reel__label em { font-style:normal; font-size:.6rem; color:var(--orange); letter-spacing:.06em; text-transform:uppercase; }
.camera__foot { display:flex; justify-content:space-between; align-items:center; gap:1rem; flex-wrap:wrap; margin-top:clamp(18px,2.4vw,30px); }
.camera__pause { display:inline-flex; gap:.55rem; align-items:center; padding:.55rem .95rem; border-radius:99px; border:1px solid var(--line); font-size:.72rem; font-weight:800; }
.camera__pause[aria-pressed="true"] > span:first-child { letter-spacing:-.1em; }
.camera__links { display:flex; flex-wrap:wrap; gap:.5rem; }
.camera__links a { display:inline-block; padding:.55rem .95rem; border-radius:99px; border:1px solid var(--line); font-size:.74rem; font-weight:800; text-decoration:none; transition:background-color .25s,color .25s,border-color .25s; }
.camera__links a:hover { background:var(--acc); color:var(--acc-ink); border-color:var(--acc); }
.camera__links span { color:var(--acc); }
.camera__links a:hover span { color:inherit; }
@media (max-width:900px) {
 .camera__head { grid-template-columns:1fr; gap:1rem; }
 .camera__head .hl { font-size:clamp(2.7rem,10vw,4.7rem); }
 .camera__stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .camera__stats > div:nth-child(3) { border-left:0; }
 .camera__stats > div:nth-child(n+3) { border-top:1px solid var(--line); }
}
@media (prefers-reduced-motion:reduce) {
 .reelwall { margin-inline:0; }
 .reelwall::before,.reelwall::after { display:none; }
 .reelwall__row { overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:6px; }
 .reelwall__track { animation:none; }
 .reel { scroll-snap-align:start; }
 .reel[aria-hidden="true"],.camera__pause { display:none; }
}
.camera__head .hl { line-height:1.02; }
.journal__item:first-child .journal__image img { object-position:center; }

/* Gerçek reklam ekran görüntüsü ve sesli röportaj videosu */
.cover__img--ad { object-fit:contain; background:#fff; padding:9% 7%; }
.cover:has(.cover__img--ad) { background:#fff; }
.cover__img--talk { object-position:16% 50%; }
.cover--talk { aspect-ratio:16/9; width:100%; max-width:760px; max-height:none; background:#000; box-shadow:12px 14px 0 -5px var(--acc); }
.cover--talk video { object-fit:contain; }
.project--talk .proj { grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); }
@media (max-width:900px) { .project--talk .proj { grid-template-columns:1fr; } .proj__media .cover--talk { width:100%; max-height:none; } }
.camfeature { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); gap:clamp(20px,3.5vw,52px); align-items:center; margin-bottom:clamp(26px,3.4vw,46px); }
.camfeature__video { aspect-ratio:16/9; border-radius:16px; overflow:hidden; background:#000; box-shadow:12px 14px 0 -5px var(--acc),0 30px 50px -30px #000a; }
.camfeature__video video { width:100%; height:100%; object-fit:cover; display:block; }
.camfeature__copy { display:grid; gap:1rem; }
.camfeature__copy h3 { font:400 clamp(2rem,3.4vw,3.6rem)/1 var(--ff-d); text-transform:uppercase; }
.camfeature__copy > p:not(.eyebrow) { color:var(--mute); font-size:.92rem; line-height:1.75; max-width:42ch; }
@media (max-width:900px) { .camfeature { grid-template-columns:1fr; } }
.cover__img--ad { padding:22% 6% 12%; object-position:center 40%; }
.cover__rank { position:absolute; top:6%; left:7%; font:400 clamp(3.4rem,7vw,6.5rem)/.85 var(--ff-d); color:var(--orange); letter-spacing:-.01em; pointer-events:none; }
.proj__media .cover--hero:has(.cover__img--ad) { aspect-ratio:1/1; }
/* Küçük kaynak görselleri büyütmeden: kompakt gönderi ızgarası */
.source-grid--compact { grid-template-columns:repeat(auto-fill,minmax(min(100%,190px),1fr)); max-width:1340px; }
.source-grid--compact figure { aspect-ratio:1; max-width:247px; margin-inline:auto; width:100%; }
.source-grid--compact figure img { width:100%; height:100%; object-fit:cover; }
.source-grid--compact h3 { font-size:1.15rem; }
.source-grid--compact .source-card > div > p:not(.eyebrow) { display:none; }
.source-grid--compact .source-card__play { display:none; }
.source-grid--compact .source-card > div { padding:1rem; gap:.5rem; }
@media (max-width:600px) { .source-grid--compact { grid-template-columns:repeat(2,minmax(0,1fr)); gap:.7rem; } .source-grid--compact h3 { font-size:1rem; } }

/* ── Hareket dili geri geldi: slayt destesi, 3D raylar, küp geçiş ──
   Yalnızca .has-motion (JS) açıkken; "hareketi azalt" tercihinde hiçbiri çalışmaz. */
.has-motion .slide { position:sticky; top:var(--stick,0px); }
.has-motion .slide__card { transform-origin:50% var(--o,100%); transform:perspective(1800px) translate3d(0,var(--ty,0px),0) rotateX(var(--rx,0deg)) scale(var(--sc,1)); backface-visibility:hidden; }
.has-motion .slide__card::after { opacity:var(--dim,0); }
.has-motion .rail__track { perspective:1400px; }
.has-motion .rail__item { transform:rotateY(var(--ry,0deg)) scale(var(--rs,1)); transform-origin:50% 50%; transition:transform .2s linear; }
.has-motion.pt-out main { animation:cubeOut .3s cubic-bezier(.7,0,.3,1) both; }
.has-motion.pt-in main { animation:cubeIn .55s var(--ease) both; }
.has-motion.pt-out .foot,.has-motion.pt-in .foot { opacity:0; }
main { transform-origin:50% var(--po,50vh) -50vw; }
@keyframes cubeOut { to { transform:perspective(2000px) rotateY(-90deg); opacity:.2; } }
@keyframes cubeIn { from { transform:perspective(2000px) rotateY(90deg); opacity:.2; } }
body.pt-out,body.pt-in { overflow-x:hidden; }
@media (prefers-reduced-motion:reduce) {
 .has-motion .slide { position:relative; top:auto; }
 .has-motion .slide__card,.has-motion .rail__item { transform:none; }
 .has-motion.pt-out main,.has-motion.pt-in main { animation:none; }
}
.has-motion .slide__card.is-live { will-change:transform; }
.has-motion .slide__card.is-live::after { will-change:opacity; }

/* ── Kaydırmaya bağlı 3D (html.sda): animasyonlar ekran kartında, kaydırmayla aynı karede akar ──
   Zaman çizelgeleri app.js'te: her .anchor bir --abN; slayt kendi çapasıyla doğrulur (--tl-in),
   kartı bir sonraki çapa ekrana girerken geriye yatar (--tl-out). Giriş slaytta, çıkış kartta:
   her biri kendi sabit ekseninden döner, eksen hiç atlamaz.
   Bellek: Chrome animasyonu olan her elemanı katmanda tutar ve eğik kartın içini parça parça katmana böler.
   Bu yüzden animasyon yalnızca hareket aralığında bağlıdır (.tl-on; app.js); okurken kart düz ve katmansızdır. */
@keyframes deckIn { from { transform:perspective(1800px) translate3d(0,40px,0) rotateX(-9deg); } to { transform:perspective(1800px) translate3d(0,0,0) rotateX(0deg); } }
@keyframes deckOut { from { transform:perspective(1800px) translate3d(0,0,0) rotateX(0deg) scale(1); } to { transform:perspective(1800px) translate3d(0,-30px,0) rotateX(16deg) scale(.9); } }
@keyframes deckDim { from { opacity:0; } to { opacity:.6; } }
.sda .has-motion .slide__card { transform:none; will-change:auto; backface-visibility:visible; transform-origin:50% 100%; }
.sda .has-motion .slide.tl-on { transform-origin:50% 0; animation:deckIn auto linear none; animation-timeline:var(--tl-in, none); animation-range:cover 0% cover 100%; }
.sda .has-motion .slide__card.tl-on { animation:deckOut auto linear forwards; animation-timeline:var(--tl-out, none); animation-range:cover 0% cover 100%; }
.sda .has-motion .slide__card.tl-on::after { animation:deckDim auto linear forwards; animation-timeline:var(--tl-out, none); animation-range:cover 0% cover 100%; }
/* İki slayt geride kalan kart, üstündeki yapışkan kartın tamamen altında: çizilmesin */
.sda .has-motion .slide__card.is-buried { opacity:0; }

/* Telefon: yapışkan deste yok (uzun katmanlar belleği taşırıyordu). Kart ekrana yatık girip doğrulur,
   çıkarken geriye yatıp kararır. Aralık dışında dönüşüm yok; aynı anda en çok iki slayt hareketli. */
@keyframes cardIn { from { transform:perspective(900px) translate3d(0,30px,0) rotateX(-14deg) scale(.94); } to { transform:perspective(900px) translate3d(0,0,0) rotateX(0deg) scale(1); } }
@keyframes cardOut { from { transform:perspective(900px) translate3d(0,0,0) rotateX(0deg) scale(1); } to { transform:perspective(900px) translate3d(0,0,0) rotateX(14deg) scale(.95); } }
@keyframes cardDim { from { opacity:0; } to { opacity:.5; } }
.has-scroll3d .slide.tl-on { transform-origin:50% 0; animation:cardIn auto linear none; animation-timeline:view(); animation-range:entry 0% entry 100%; }
.has-scroll3d .slide__card.tl-on { transform-origin:50% 100%; animation:cardOut auto linear none; animation-timeline:view(); animation-range:exit 0% exit 100%; }
.has-scroll3d .slide__card.tl-on::after { animation:cardDim auto linear none; animation-timeline:view(); animation-range:exit 0% exit 100%; }

/* Raylar (masaüstü + telefon): kart sağdan yana dönük gelir, soldan çıkarken geriye kıvrılır */
@keyframes railIn { from { transform:rotateY(-24deg) scale(.95); } to { transform:rotateY(0deg) scale(1); } }
@keyframes railOut { from { transform:rotateY(0deg) scale(1); } to { transform:rotateY(32deg) scale(.9); } }
.sda .rail__track { perspective:1400px; }
.sda .rail__item { transform:none; transition:none; }
.sda .near .rail__item { animation:railIn auto linear none, railOut auto linear none; animation-timeline:view(inline), view(inline); animation-range:entry 0% entry 100%, exit 0% exit 100%; }

/* Seçili kart turuncu çerçeveyle işaretlenir; çerçeve kaydırmayı ve okları takip eder */
.job { transition:box-shadow .3s var(--ease); }
.shot { transition:box-shadow .3s var(--ease); }
.rail__item.is-cur .job, .rail__item.is-cur .pcard, .rail__item.is-cur .shot { box-shadow:0 0 0 2px var(--orange), 0 24px 40px -26px rgba(0,0,0,.8); }
/* Farede serbest kaydırma: çerçeve oranla ilerlediği için kartlara yapışma onu geri itiyordu */
@media (hover:hover) and (pointer:fine) { .rail__track { scroll-snap-type:none; } }

/* Hizmetler: arama niyeti + gerçek iş kanıtı */
.services { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-top:clamp(18px,2.6vw,34px); }
.service { position:relative; display:grid; align-content:start; gap:.85rem; padding:clamp(18px,2vw,28px); border:1px solid var(--line); border-radius:18px; background:color-mix(in srgb,var(--fg) 3%,transparent); transition:border-color .25s, transform .35s var(--ease); }
.service:hover { border-color:var(--acc); transform:translateY(-3px); }
.service__n { font:400 2.4rem/1 var(--ff-d); color:var(--acc); }
.service h3 { font:400 clamp(1.45rem,1.9vw,2.1rem)/1.08 var(--ff-d); text-transform:uppercase; }
.service > p:not(.service__proof) { color:var(--mute); font-size:.88rem; line-height:1.7; }
.service__proof { display:flex; flex-wrap:wrap; gap:.4rem; align-items:center; margin-top:auto; padding-top:.6rem; border-top:1px solid var(--line); }
.service__proof span { width:100%; font-size:.62rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--acc); }
.service__proof a { display:inline-flex; gap:.35rem; align-items:center; min-height:36px; padding:.35rem .75rem; border:1px solid var(--line); border-radius:99px; font-size:.74rem; font-weight:800; text-decoration:none; transition:background-color .25s,color .25s,border-color .25s; }
.service__proof a:hover { background:var(--acc); color:var(--acc-ink); border-color:var(--acc); }
.service__proof b { color:var(--acc); }
.service__proof a:hover b { color:inherit; }
.services__cta { margin-top:clamp(18px,2.4vw,30px); }
@media (max-width:1100px) { .services { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:640px) { .services { grid-template-columns:1fr; } }
.cover__img--low { object-position:50% 66%; }

/* ── Giriş: reklam arası ── */
.seen .gate { display:none; }
.gate__card { position:relative; min-width:0; max-width:100%; align-items:stretch; text-align:left; padding:0; overflow:hidden; }
.gate__top { display:flex; justify-content:space-between; align-items:center; padding:var(--pad) var(--pad) 0; font-weight:800; font-size:.74rem; letter-spacing:.12em; text-transform:uppercase; color:var(--mute); font-variant-numeric:tabular-nums; }
.gate__rec { display:inline-flex; align-items:center; gap:.5rem; color:var(--fg); }
.gate__rec i { width:.62rem; height:.62rem; border-radius:50%; background:#ff2d2d; box-shadow:0 0 0 0 #ff2d2d88; animation:rec 1.2s ease-in-out infinite; }
@keyframes rec { 50% { opacity:.25; } }
.gate__stage { flex:1; min-height:0; display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); align-items:center; gap:clamp(24px,5vw,80px); padding:clamp(16px,3vw,40px) var(--pad); }
.gate__copy { justify-items:start; margin:0; gap:.9rem; animation:gateCopy .8s .15s var(--ease) both; }
@keyframes gateCopy { from { opacity:0; transform:translateY(24px); } }
.gate__kicker { display:inline-block; padding:.4rem .8rem; border-radius:10px; background:var(--orange); color:#000; font-size:clamp(1rem,1.6vw,1.3rem); transform:rotate(-1.5deg); }
.gate__name { margin:0; font-size:clamp(3.4rem,9vw,8.5rem); line-height:.9; }
.gate__name span:last-child { color:var(--orange); }
.gate__line { font-size:clamp(.95rem,1.3vw,1.15rem); max-width:36ch; }
.gate__actions { justify-content:flex-start; margin-top:.4rem; }
.gate__ticker { min-width:0; width:100%; overflow:hidden; background:var(--orange); color:#000; font:400 clamp(1.1rem,2vw,1.6rem)/1 var(--ff-d); text-transform:uppercase; padding:.7rem 0; white-space:nowrap; }
.gate__ticker p { display:flex; width:max-content; animation:gateTick 28s linear infinite; }
.gate__ticker span { padding-right:.6rem; }
@keyframes gateTick { to { transform:translateX(-50%); } }
.gate.is-gone .gate__card { transform:scale(.92) rotateX(16deg); opacity:0; }
@media (max-width:760px) {
 .gate__stage { grid-template-columns:minmax(0,1fr); align-content:center; gap:1.3rem; }
 .gate__stage > * { min-width:0; }
 .gate__name { font-size:clamp(2.8rem,15vw,5rem); }
}
@media (prefers-reduced-motion:reduce) { .gate__copy,.gate__ticker p,.gate__rec i,.vinyl__label { animation:none; } }

/* ── Telefon: slayt ekrana girerken bir kez döner, sonra düz ve hafif kalır ── */
.has-reveal .slide__card { transform:perspective(1200px) translateY(34px) rotateX(9deg) scale(.97); transition:transform .7s var(--ease); transform-origin:50% 0; }
.has-reveal .slide__card.is-in { transform:none; }

/* ── Telefon sayfa geçişi: ekran boyutunda turuncu kapı. Soldan dönerek kapanır, sağa dönerek açılır (3D, tek ekranlık katman) ── */
.pagewipe { position:fixed; inset:0; z-index:250; display:grid; place-items:center; background:var(--orange); color:#000; transform:perspective(1100px) rotateY(-90deg); transform-origin:0 50%; backface-visibility:hidden; pointer-events:none; }
.pagewipe span { font:400 clamp(3rem,16vw,7rem)/.9 var(--ff-d); text-transform:uppercase; text-align:center; }
.pagewipe b { display:block; font-weight:400; color:#fff; }
.pw-out .pagewipe { transform:perspective(1100px) rotateY(0deg); transition:transform .28s cubic-bezier(.7,0,.3,1); }
.pw-in .pagewipe { transform:perspective(1100px) rotateY(90deg); transform-origin:100% 50%; transition:transform .45s var(--ease); }

/* 3D eğim perspektifte kartı genişletir; sayfa yana taşmasın (clip yapışkanlığı bozmaz) */
main { overflow-x:hidden; }
@supports (overflow:clip) { main { overflow-x:clip; } }

/* Giriş: müzik seçimi bir plak. Dokun → iğne düşer, müzik başlar. */
.gate__stage { grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); }
.gate__mute { justify-self:start; margin-top:.6rem; padding:.7rem 0; border-bottom:2px solid var(--line); font-size:.9rem; font-weight:800; color:var(--mute); transition:color .25s,border-color .25s; }
.gate__mute:hover,.gate__mute:focus-visible { color:var(--fg); border-color:var(--orange); }
.gate__mute span { color:var(--orange); }
.vinyl { position:relative; justify-self:center; display:grid; justify-items:center; gap:1rem; width:min(100%,380px); padding:0; color:var(--fg); animation:gateCopy .8s .25s var(--ease) both; }
.vinyl__disc { position:relative; display:grid; place-items:center; width:100%; aspect-ratio:1; border-radius:50%;
  background:radial-gradient(circle at 50% 50%,transparent 33%,#0000 33%),repeating-radial-gradient(circle at 50% 50%,#141414 0 2px,#060606 2px 4px);
  box-shadow:0 0 0 2px #222,0 30px 60px -25px #000,inset 0 0 0 10px #0a0a0a; transform:rotate(var(--rot,0deg)); touch-action:none; cursor:grab; }
.vinyl__disc::before { content:""; position:absolute; inset:0; border-radius:50%; background:conic-gradient(from 30deg,transparent 0 12%,#ffffff14 15%,transparent 20% 62%,#ffffff10 66%,transparent 72%); }
.vinyl__label { position:relative; animation:spin 9s linear infinite; display:grid; place-items:center; align-content:center; gap:.15rem; width:36%; aspect-ratio:1; border-radius:50%; background:var(--orange); color:#000; text-align:center; padding:.6rem; }
.vinyl__label::after { content:""; position:absolute; width:7%; aspect-ratio:1; border-radius:50%; background:#000; }
.vinyl__label b { font:400 clamp(.85rem,1.6vw,1.15rem)/1 var(--ff-d); text-transform:uppercase; transform:translateY(-.7rem); }
.vinyl__label i { font-style:normal; font-size:.62rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; transform:translateY(.7rem); }
.vinyl__arm { position:absolute; top:-2%; right:-4%; width:44%; height:6px; border-radius:6px; background:linear-gradient(90deg,#bbb,#eee); transform-origin:100% 50%; transform:rotate(-38deg); transition:transform .5s var(--ease); box-shadow:0 6px 12px -4px #000; }
.vinyl__arm::before { content:""; position:absolute; right:-10px; top:-9px; width:24px; height:24px; border-radius:50%; background:#d9d9d9; box-shadow:inset 0 0 0 6px #9a9a9a; }
.vinyl__arm::after { content:""; position:absolute; left:-4px; top:-4px; width:16px; height:14px; border-radius:3px; background:var(--orange); }
.vinyl:hover .vinyl__arm,.vinyl:focus-visible .vinyl__arm,.gate.is-gone .vinyl__arm { transform:rotate(-14deg); }
.vinyl:hover .vinyl__label { animation-duration:2.2s; }
.vinyl.is-grab .vinyl__label { animation-play-state:paused; }
.vinyl.is-grab .vinyl__disc { cursor:grabbing; }
.gate.is-dropping .vinyl__label { animation-duration:.45s; }
.gate.is-dropping .vinyl__arm { transform:rotate(-14deg); }
.gate.is-dropping .vinyl__cta { background:#fff; }
.vinyl__cta { display:inline-flex; align-items:center; gap:.5rem; padding:.85rem 1.3rem; border-radius:99px; background:var(--orange); color:#000; font-weight:800; font-size:.95rem; transition:transform .25s var(--ease); }
.vinyl:hover .vinyl__cta,.vinyl:focus-visible .vinyl__cta { transform:translateY(-2px); }
.vinyl__hint { font-size:.7rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--mute); }
@keyframes spin { to { transform:rotate(360deg); } }
@media (max-width:760px) {
 .gate__stage { grid-template-columns:minmax(0,1fr); }
 .vinyl { order:-1; width:min(62vw,230px); gap:.7rem; }
 .vinyl__hint { font-size:.62rem; }
 .vinyl__arm { top:8%; right:-2%; width:40%; }
 .vinyl__cta { white-space:nowrap; font-size:.85rem; padding:.75rem 1.1rem; }
}
@media (max-height:620px) and (max-width:760px) { .vinyl { width:min(44vw,150px); } }

:root[data-theme="light"] .foot__giant { color:#bb380a; }
:root:not([data-theme="light"]) .slide--paper .service__proof span { color:#a3310a; }

/* Kamerada: iki rekor video, dev rakamlarla */
.records { display:grid; grid-template-columns:repeat(2,minmax(0,260px)) minmax(0,1fr); gap:clamp(14px,2vw,26px); align-items:center; margin-bottom:clamp(26px,3.4vw,46px); }
.record { position:relative; display:block; aspect-ratio:9/16; border-radius:20px; overflow:hidden; background:#111; color:#fff; text-decoration:none; isolation:isolate; box-shadow:0 26px 50px -28px #000c; transition:transform .35s var(--ease), box-shadow .35s var(--ease); }
.record:nth-child(1) { transform:rotate(-2.5deg); }
.record:nth-child(2) { transform:rotate(2deg) translateY(18px); }
.record:hover,.record:focus-visible { transform:rotate(0) translateY(-6px); box-shadow:0 0 0 3px var(--orange),0 30px 60px -26px #000; }
.record img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-1; }
.record::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,#0008 0,transparent 30%,transparent 50%,#000e 100%); }
.record__n { position:absolute; top:12px; left:14px; right:14px; display:flex; flex-wrap:wrap; align-items:baseline; gap:.1rem .4rem; white-space:nowrap; font:400 clamp(2rem,8.5vw,4.2rem)/.9 var(--ff-d); color:var(--orange); text-shadow:0 2px 18px #000a; }
.record__n small { font:800 .7rem/1 var(--ff-b, inherit); letter-spacing:.1em; text-transform:uppercase; color:#fff; }
.record__t { position:absolute; left:14px; right:14px; bottom:14px; display:grid; gap:.35rem; font-weight:800; font-size:.86rem; line-height:1.3; }
.record__t em { font-style:normal; font-size:.66rem; color:var(--orange); letter-spacing:.06em; text-transform:uppercase; }
.records__copy { display:grid; gap:.9rem; padding-left:clamp(0px,2vw,24px); }
.records__copy h3 { font:400 clamp(1.9rem,3.2vw,3.4rem)/1.02 var(--ff-d); text-transform:uppercase; }
.records__copy > p:not(.eyebrow) { color:var(--mute); font-size:.92rem; line-height:1.7; max-width:40ch; }
@media (max-width:900px) {
 .records { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .records__copy { grid-column:1/-1; grid-row:1; padding-left:0; }
 .record:nth-child(2) { transform:rotate(2deg) translateY(10px); }
}

/* Gerçek mi, yapay zekâ mı? */
.aigrid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:clamp(12px,1.6vw,22px); margin-top:clamp(18px,2.6vw,34px); }
.aicard a { display:grid; gap:.7rem; color:inherit; text-decoration:none; }
.aicard__media { position:relative; aspect-ratio:3/4; border-radius:18px; overflow:hidden; background:#000; box-shadow:0 22px 40px -24px #000b; transform:rotate(calc((var(--i) - 1.5) * 1.6deg)); transition:transform .4s var(--ease), box-shadow .4s var(--ease); }
.aicard__media img { width:100%; height:100%; object-fit:cover; object-position:50% 30%; transition:transform .6s var(--ease), filter .6s; }
.aicard a:hover .aicard__media,.aicard a:focus-visible .aicard__media { transform:rotate(0) translateY(-6px) scale(1.02); box-shadow:0 0 0 3px #000,0 28px 50px -22px #000; }
.aicard a:hover img { transform:scale(1.06); }
.aicard__tag { position:absolute; top:10px; left:10px; padding:.32rem .6rem; border-radius:99px; background:#000; color:#fff; font-size:.6rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.aicard__play { position:absolute; right:10px; bottom:10px; width:44px; height:44px; display:grid; place-items:center; border-radius:50%; background:#fff; color:#000; font-size:1rem; box-shadow:0 8px 20px -6px #000a; }
.aicard h3 { font:400 clamp(1.2rem,1.6vw,1.7rem)/1.06 var(--ff-d); text-transform:uppercase; }
.aicard p { font-size:.8rem; line-height:1.55; color:var(--mute); }
.aicard__go { font-size:.74rem; font-weight:800; }
.slide--ai .btns { margin-top:clamp(16px,2.2vw,28px); flex-wrap:wrap; }
@media (max-width:1000px) { .aigrid { grid-template-columns:repeat(2,minmax(0,1fr)); } .aicard__media { aspect-ratio:9/14; } }
@media (prefers-reduced-motion:reduce) { .record,.aicard__media { transform:none; } }