/* ARTificial Match site sayfaları (ana, İşler, Hakkında): marka.json > site.ekCss. 2026-10-27.
   Kitabın koyu sahnesini kopyalamaz; kitabın dilini üç şeyle taşır: koyu bant (Mürekkep), iki yarı imza sahnesi, şekil dili.
   Renk ve yazı değerleri marka.css değişkenlerinden (--c-*, --f-*, --w-*, --sure-*, --egri-*). Hareket yalnız transform ve opacity;
   .motion yoksa (betik yok ya da azaltılmış hareket) her şey son halinde durur. Turuncu yalnız dolgu, çizgi ve şekil olur; metin rengi olmaz.
   Buz mavisi yalnız sayaç elmasında, altın yalnız künye ayırıcısında, bordo hiç kullanılmaz. */
:root { --as-kagit: #F6EFDC; --as-bant: var(--c-murekkep); --as-mont: "Montserrat", var(--f-metin); --as-nuber: "NuberNext", var(--f-baslik); }
/* kaynak: imza.js (2026-10-16): sağ yarı kâğıt zemini; paletten değil imza sahnesinden */

/* ---- ortak bölümler ---- */
.as-bolum { padding: clamp(48px, 7vw, 96px) 0; }
.as-bolum.as-ust { padding-bottom: clamp(24px, 3vw, 40px); }
.as-ayrac { border-top: 1px solid var(--cizgi); }
.as-bant { padding: clamp(56px, 8vw, 112px) 0; background: var(--as-bant); color: #fff; }
.as-bant .as-etiket { color: rgba(255, 255, 255, .78); }
.as-h2 { font: var(--w-baslik) clamp(26px, 3.2vw, 42px)/1.1 var(--f-baslik); letter-spacing: -.005em; }
.as-h2.as-buyuk { font-size: clamp(28px, 3.6vw, 50px); line-height: 1.04; max-width: 15em; }
.as-h2.as-cubuk::after, .as-etiket::after { content: ""; display: block; width: 36px; height: 2px; margin-top: 12px; background: var(--vurgu); }
.as-etiket { margin: 0 0 14px; font: 700 12px/1 var(--as-mont); letter-spacing: .2em; text-transform: uppercase; color: var(--soluk); }
.as-etiket::after { margin-top: 9px; }
.as-sonuc { margin-top: clamp(24px, 3vw, 36px); }
.as-not { margin-top: 14px; font-size: 14px; color: var(--soluk); }
.as-dugmeler { display: flex; flex-wrap: wrap; gap: 12px; }
.as-bolum .tw-btn, .as-bant .tw-btn, .as-hero .tw-btn { font: 700 13px/1 var(--as-mont); letter-spacing: .12em; text-transform: uppercase; }
.tw-btn.dolu:hover { background: var(--c-murekkep); border-color: var(--c-murekkep); color: #fff; }
.as-bant .tw-btn { border-color: #fff; color: #fff; }
.as-bant .tw-btn:hover { background: #fff; color: var(--c-murekkep); }
.as-isaret { display: flex; gap: 10px; justify-content: center; margin-top: clamp(36px, 5vw, 64px); }
.as-isaret svg { display: block; width: 24px; height: auto; }
.as-isaret path { fill: var(--vurgu); }

/* ---- hero: iki yarı imza sahnesi (imza.js katmanları hero içine ekler) ---- */
.as-hero { position: relative; isolation: isolate; overflow: clip; display: grid; place-items: center; min-height: min(calc(100svh - 68px), 860px); padding: clamp(56px, 6vw, 72px) 0 clamp(40px, 5vw, 64px); text-align: center; }
.as-hero-ic { display: grid; justify-items: center; gap: clamp(16px, 2.2vw, 26px); width: min(1200px, 100% - 2 * var(--kenar)); }
.as-h1 { display: block; line-height: 0; }
.as-hero marka-logo { width: min(72vw, 340px, 30svh); }
@media (min-width: 761px) { .as-hero marka-logo { width: min(30vw, 300px, 27svh); } }
.motion.am-gizle .as-hero marka-logo { opacity: 0; }
.as-sl { font: var(--w-baslik) clamp(22px, 2.6vw, 30px)/1.19 var(--f-baslik); }
.as-tanim { max-width: 32em; font-size: clamp(17px, 1.5vw, 19px); }
.as-hero .as-dugmeler { justify-content: center; margin-top: 6px; }
.as-hero > .am-p { position: absolute; top: 0; bottom: 0; width: 50%; z-index: -1; pointer-events: none; }
.am-sol, .as-mantik { background-color: #fff; background-image: linear-gradient(rgba(var(--c-metin-rgb), .075) 1px, transparent 1px), linear-gradient(90deg, rgba(var(--c-metin-rgb), .075) 1px, transparent 1px), linear-gradient(rgba(var(--c-metin-rgb), .13) 1px, transparent 1px), linear-gradient(90deg, rgba(var(--c-metin-rgb), .13) 1px, transparent 1px); background-size: 40px 40px, 40px 40px, 200px 200px, 200px 200px; background-position: right top; }
.am-sag, .as-doku { background-color: var(--as-kagit); background-image: radial-gradient(120% 70% at 0% 50%, rgba(var(--c-vurgu-rgb), .15), transparent 62%), url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .32 0 0 0 0 .26 0 0 0 0 .16 0 0 0 .3 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); background-size: auto, 200px 200px; }
.am-sol { left: 0; }
.am-sag { right: 0; }
.am-cizgi { position: absolute; left: 50%; top: 0; bottom: 0; width: 1px; margin-left: -.5px; background: rgba(var(--c-metin-rgb), .4); z-index: -1; pointer-events: none; }
.am-et { position: absolute; top: 22px; z-index: 1; font: 800 12px/1 var(--f-baslik); letter-spacing: .2em; text-transform: uppercase; color: rgba(var(--c-metin-rgb), .66); pointer-events: none; }
.am-et.s { left: 24px; }
.am-et.d { right: 24px; }
.am-et::after { content: ""; display: block; width: 36px; height: 2px; margin-top: 9px; background: var(--vurgu); }
.am-et.d::after { margin-left: auto; }

/* ---- afişler (koyu bant) ---- */
.as-bant .as-h2 { margin-bottom: clamp(24px, 3vw, 40px); }
.as-afis { margin: 0 0 clamp(20px, 2.4vw, 32px); }
.as-afis a, .as-afis img { display: block; }
.as-afis img { width: 100%; height: auto; border-radius: 4px; }
.as-afis a { border-radius: 4px; }
.as-afis a:focus-visible { outline-color: var(--c-camgobegi); }
.as-afis figcaption { margin-top: 10px; font: 700 12px/1.4 var(--as-mont); letter-spacing: .14em; text-transform: uppercase; color: rgba(255, 255, 255, .78); }
.as-bant .as-sonuc { margin-top: clamp(8px, 1vw, 16px); }

/* ---- oyun dünyaları ---- */
.as-oyun-izgara { display: grid; grid-template-columns: 1fr; gap: clamp(12px, 1.6vw, 20px); align-items: start; }
.as-oyun-ana img, .as-oyun-kare img { display: block; width: 100%; height: auto; border-radius: 4px; }
.as-oyun-kare { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(12px, 1.6vw, 20px); }

/* ---- küçük resimler ---- */
.as-galeri { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px 20px; margin-top: clamp(24px, 3vw, 40px); }
.as-galeri figure { display: block; }
.as-galeri img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 4px; transition: transform var(--sure-kisa) var(--egri-ana); }
.as-galeri li:hover img { transform: translateY(-3px); }
.as-galeri figcaption { margin-top: 10px; font-size: 14px; line-height: 1.35; color: var(--soluk); display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* ---- ana sayfa: kavram ve kitap ---- */
.as-kitap, .as-kavram { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 280px); gap: clamp(24px, 5vw, 80px); align-items: center; }
.as-kavram { grid-template-columns: minmax(0, 1fr) minmax(0, 300px); align-items: start; }
.as-rozet { margin: 0; }
.as-rozet img { display: block; width: 100%; height: auto; max-width: 280px; margin-inline: auto; }

/* ---- Hakkında: mantık ve doku ---- */
.as-birlesim .as-sonuc { margin-top: clamp(24px, 3vw, 36px); }
.as-iki { display: grid; grid-template-columns: 1fr 1fr; margin-top: clamp(24px, 3vw, 40px); }
.as-panel { position: relative; display: grid; place-items: center; min-height: clamp(280px, 32vw, 420px); padding: 64px 24px 40px; }
.as-panel-rozet { width: min(52%, 220px); height: auto; }
.as-panel-logo { width: min(70%, 300px); }
.as-doku { background-position: 0 0, 0 0; }
.as-mantik { background-position: right top; }
.as-yolculuk { display: grid; justify-items: start; }
.as-nuber { font: 800 clamp(32px, 4.4vw, 56px)/1 var(--as-nuber); letter-spacing: .01em; }
.as-yol-s { margin-top: 14px; font: var(--w-baslik) clamp(20px, 2vw, 26px)/1.2 var(--f-baslik); }
.as-yolculuk .ts-p { margin-top: 12px; }

/* ---- künye ---- */
.as-kunye { margin-top: clamp(20px, 2.4vw, 32px); max-width: 52em; }
.as-kunye > div { display: grid; grid-template-columns: 12em minmax(0, 1fr); gap: 16px; padding: 14px 0; border-top: 1px solid var(--c-altin); }
.as-kunye > div:last-child { border-bottom: 1px solid var(--c-altin); }
.as-kunye dt { font: 700 12px/1.5 var(--as-mont); letter-spacing: .14em; text-transform: uppercase; color: var(--soluk); padding-top: 3px; }
.as-kunye dd { margin: 0; }

/* ---- menü: etkin sayfada sayaç elması ---- */
@media (min-width: 761px) {
  .ts-menu a[aria-current="page"]::before { content: ""; width: 6px; height: 14px; margin-right: 8px; background: var(--c-camgobegi); clip-path: polygon(50% 0, 100% 66%, 50% 100%, 0 66%); }
}

/* ---- altbilgi: aile bandı beyaz yüzeyde, altbilgi altından taşar ---- */
.ts-alt { padding-bottom: 0; }
.ts-alt .tw-aile { margin-top: 32px; }

/* ---- sanat turu ---- */
.ts-logo { width: 128px; padding: 10px 0; }
.as-bant { padding-bottom: clamp(40px, 5vw, 72px); }
.as-bant .as-isaret { margin-top: clamp(24px, 3vw, 40px); }

/* ---- orta ve dar ekranlar ---- */
@media (max-width: 1000px) {
  .as-galeri { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .as-oyun-izgara { grid-template-columns: 1fr; }
  .as-oyun-kare { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ts-logo { width: 112px; }
  .as-hero marka-logo { width: min(56vw, 220px, 26svh); }
  .as-hero-ic { gap: 14px; }
  .as-kitap, .as-kavram { grid-template-columns: 1fr; }
  .as-kitap .as-rozet img, .as-kavram .as-rozet img { max-width: 200px; margin-inline: 0; }
  .as-iki { grid-template-columns: 1fr; }
  .as-hero { min-height: 0; padding-top: 56px; }
  .as-hero .as-dugmeler { flex-direction: column; align-self: stretch; }
  .as-hero .as-dugmeler .tw-btn { width: 100%; min-height: var(--dokun); }
  .as-kunye > div { grid-template-columns: 1fr; gap: 2px; }
}
@media (max-width: 700px) {
  .as-galeri { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 14px; }
}
@media (max-width: 520px) {
  .am-et.s { left: 16px; }
  .am-et.d { right: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .as-galeri img { transition: none; }
  .as-galeri li:hover img { transform: none; }
}