/* --- 60-intro.css --- */
/* Giris (intro) sahnesi. Ortak stil.css'e girmez; yalniz kok sayfada assets/intro.css.
   Yerlesim tasarim birimiyle (--u) yapilir: masaustu tuvali 1512x1040, mobil 390x844.
   Tum konumlar tasarim pikseli cinsinden ozel ozelliklerdedir; JS bu kutulari olcer. */

.intro-govde {
  margin: 0;
  background: #02040c;
  overflow: hidden;
}
.intro-govde .atla { z-index: 30; }

.intro {
  --u: min(calc(100vw / 1512), calc(100vh / 1040));
  --tw: 1512;
  --th: 1040;
  --logo-y: 4;
  --logo-f: 112;
  --beyin-w: 104;
  --yeni-y: 256;
  --yeni-f: 33;
  --kx: 756;
  --ky: 538;
  --kr: 232;
  --mf: 66;
  --son-y: 976;
  --son-f: 40;
  --hr: 40;
  --lf: 20;
  --altin-metal: linear-gradient(180deg, #fff7d6 0%, #f9e095 18%, #e2b04f 40%, #a06c1c 52%, #d9a849 60%, #fbe6a2 76%, #c08a32 92%, #8a5a14 100%);
  --altin-acik: linear-gradient(180deg, #fffaf0 0%, #f8e7b6 45%, #d9b46a 100%);
  position: fixed;
  inset: 0;
  overflow: hidden;
  color: #f5ecd8;
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
  background: radial-gradient(120% 90% at 50% 52%, #0b1634 0%, #060c20 48%, #02040c 100%);
  -webkit-font-smoothing: antialiased;
}
@supports (height: 100svh) {
  .intro { --u: min(calc(100vw / 1512), calc(100svh / 1040)); }
}

.intro-evren,
.intro-tuval {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
}
.intro-evren { z-index: 0; }
.intro-tuval { z-index: 1; pointer-events: none; }

.intro-kutu {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 2;
  width: calc(var(--tw) * var(--u));
  height: calc(var(--th) * var(--u));
  transform: translate(-50%, -50%);
}
.intro-ust,
.intro-sahne,
.intro-alt {
  position: absolute;
  inset: 0;
  margin: 0;
  pointer-events: none;
}
.intro-sahne:focus { outline: none; }
.intro a { pointer-events: auto; }

/* ---------- Metalik altin metin ---------- */
.intro-altin {
  background-image: linear-gradient(105deg, transparent 40%, rgba(255, 255, 255, .85) 50%, transparent 60%), var(--altin-metal);
  background-size: 320% 100%, 100% 100%;
  background-position: 160% 0, 0 0;
  background-repeat: no-repeat;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 calc(2 * var(--u)) 0 rgba(58, 34, 4, .85)) drop-shadow(0 0 calc(16 * var(--u)) rgba(255, 190, 80, .42));
}
.intro-altin--acik {
  background-image: var(--altin-acik);
  background-size: 100% 100%;
  filter: drop-shadow(0 1px 1px rgba(0, 0, 0, .9)) drop-shadow(0 0 calc(10 * var(--u)) rgba(255, 196, 92, .35));
}

/* ---------- Logo, gunes, beyin ---------- */
.intro-logo-blok {
  position: absolute;
  left: 50%;
  top: calc(var(--logo-y) * var(--u));
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
}
.intro-logo {
  margin: 0;
  padding: .3em 0 0 .07em;
  font-size: calc(var(--logo-f) * var(--u));
  font-weight: 700;
  line-height: 1;
  letter-spacing: .07em;
  white-space: nowrap;
}
.intro-logo-yazi { display: inline-block; }
.intro-gunesli {
  position: relative;
  display: inline-block;
}
.intro-gunes {
  position: absolute;
  left: 50%;
  bottom: .6em;
  width: .92em;
  height: .92em;
  margin-left: 0;
  translate: -50% 0;
  overflow: visible;
  pointer-events: none;
  filter: drop-shadow(0 0 calc(10 * var(--u)) rgba(255, 214, 120, .9));
}
.intro-logo .intro-gunesli:not(.intro-gunesli--ust) .intro-gunes { translate: calc(-50% - .035em) 0; }
/* "İ" icermeyen markalar: gunes sozcugun ortasinin ustunde; yer acmak icin ust bosluk */
.intro-logo--ust { padding-top: .62em; font-size: calc(var(--logo-f) * .9 * var(--u)); }
.intro-gunesli--ust .intro-gunes { bottom: .8em; width: .72em; height: .72em; }
.intro-gunes-hale { fill: rgba(255, 226, 150, .22); }
.intro-gunes-cekirdek { fill: #ffe9a8; }
.intro-gunes-parlak { fill: #fffdf4; }
.intro-gunes-isinlar line {
  stroke: #f8dc8f;
  stroke-width: 1.5;
  stroke-linecap: round;
}
.intro-gunes-isinlar .intro-gunes-ince { stroke-width: .8; stroke: #fff1c4; }
.intro-gunes-dis,
.intro-gunes-isinlar {
  transform-box: fill-box;
  transform-origin: center;
}
.intro-logo-cizgi {
  display: block;
  width: 108%;
  height: max(2px, calc(3 * var(--u)));
  margin-top: calc(6 * var(--u));
  border-radius: 2px;
  background: linear-gradient(90deg, rgba(200, 150, 46, 0) 0%, #c8962e 12%, #fff1bf 50%, #c8962e 88%, rgba(200, 150, 46, 0) 100%);
  box-shadow: 0 0 calc(14 * var(--u)) rgba(246, 214, 130, .6);
}
.intro-beyin {
  display: block;
  width: calc(var(--beyin-w) * var(--u));
  height: auto;
  margin-top: calc(10 * var(--u));
  overflow: visible;
  filter: drop-shadow(0 0 calc(8 * var(--u)) rgba(255, 196, 92, .55));
}
.intro-beyin path {
  fill: none;
  stroke: url(#intro-beyin-altin);
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.intro-beyin .intro-beyin-dis { stroke-width: 3; fill: rgba(232, 190, 94, .1); }
.intro-beyin .intro-beyin-yarik { stroke: #f6de9c; stroke-width: 1.6; }

.intro-yeni {
  position: absolute;
  left: 50%;
  top: calc(var(--yeni-y) * var(--u));
  margin: 0;
  transform: translateX(-50%);
  font-size: calc(var(--yeni-f) * var(--u));
  font-weight: 600;
  line-height: 1;
  letter-spacing: .3em;
  padding-left: .3em;
  white-space: nowrap;
}
.intro-rakam { font-weight: 700; font-size: 1.3em; margin: 0 .05em; letter-spacing: 0; }
.intro-rakam .intro-gunes { width: .9em; height: .9em; bottom: .62em; }

/* ---------- Dunya ve MANIFESTO ---------- */
.intro-manifesto {
  position: absolute;
  left: calc((var(--kx) - var(--kr)) * var(--u));
  top: calc((var(--ky) - var(--kr)) * var(--u));
  width: calc(var(--kr) * 2 * var(--u));
  height: calc(var(--kr) * 2 * var(--u));
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  text-decoration: none;
}
.intro-manifesto-yazi {
  position: relative;
  font-size: calc(var(--mf) * var(--u));
  font-weight: 700;
  line-height: 1;
  letter-spacing: .035em;
  padding-left: .035em;
  white-space: nowrap;
}
.intro-manifesto-yazi .intro-altin {
  filter: drop-shadow(0 calc(2 * var(--u)) 0 rgba(40, 22, 2, .95)) drop-shadow(0 0 calc(6 * var(--u)) rgba(0, 0, 0, .85)) drop-shadow(0 0 calc(22 * var(--u)) rgba(255, 190, 80, .5));
  transition: filter .35s;
}
.intro-manifesto:hover .intro-altin,
.intro-manifesto:focus-visible .intro-altin {
  filter: drop-shadow(0 calc(2 * var(--u)) 0 rgba(40, 22, 2, .95)) drop-shadow(0 0 calc(6 * var(--u)) rgba(0, 0, 0, .7)) drop-shadow(0 0 calc(30 * var(--u)) rgba(255, 214, 120, .95));
}
.intro a:focus:not(:focus-visible) { outline: none; }
.intro-manifesto:focus-visible { outline: 2px solid #f6de9c; outline-offset: calc(14 * var(--u)); }

/* JS'siz: CSS kure (noscript icinde) */
.intro-kure-yedek {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: #123 url("/assets/gorsel/dunya-gunduz.jpg") 40% 45% / 230% 128%;
  box-shadow: inset calc(-40 * var(--u)) calc(-30 * var(--u)) calc(90 * var(--u)) rgba(2, 6, 20, .9), 0 0 calc(40 * var(--u)) rgba(110, 160, 255, .45);
}

.intro-yan {
  position: absolute;
  left: calc((var(--x) - var(--r)) * var(--u));
  top: calc((var(--y) - var(--r)) * var(--u));
  width: calc(var(--r) * 2 * var(--u));
  height: calc(var(--r) * 2 * var(--u));
  border-radius: 50%;
}
.intro-yan--sol { --x: 92; --y: 512; --r: 120; }
.intro-yan--sag { --x: 1420; --y: 512; --r: 120; }
.intro-yan-not {
  position: absolute;
  top: calc(674 * var(--u));
  transform: translateX(-50%);
  font-size: max(11px, calc(15 * var(--u)));
  font-style: italic;
  letter-spacing: .06em;
  color: rgba(239, 228, 200, .5);
  white-space: nowrap;
}
.intro-yan-not--sol { left: calc(92 * var(--u)); }
.intro-yan-not--sag { left: calc(1420 * var(--u)); }

/* ---------- Hilaller ---------- */
.intro-hilal {
  --r: var(--hr);
  position: absolute;
  left: calc(var(--x) * var(--u));
  top: calc(var(--y) * var(--u));
  width: 0;
  height: 0;
  text-decoration: none;
}
.intro-hilal-yer {
  position: absolute;
  left: calc(var(--r) * -1 * var(--u));
  top: calc(var(--r) * -1 * var(--u));
  width: calc(var(--r) * 2 * var(--u));
  height: calc(var(--r) * 2 * var(--u));
  border-radius: 50%;
}
/* Tuval yoksa (JS kapali) CSS hilal: sirt dunyaya, acik yuz disa */
.intro:not(.intro--canli) .intro-hilal-yer {
  box-shadow: inset calc(var(--hx) * var(--r) * .34 * var(--u)) calc(var(--hy) * var(--r) * .34 * var(--u)) 0 0 #ecc66c, 0 0 calc(14 * var(--u)) rgba(255, 200, 100, .35);
}
.intro-hilal-ad {
  position: absolute;
  left: calc(var(--dx) * (var(--r) + var(--gap, 14)) * var(--u));
  top: calc((var(--dy) * (var(--r) + 10) + var(--ly, 0)) * var(--u));
  transform: translate(var(--tx), var(--ty));
  padding: calc(4 * var(--u)) calc(2 * var(--u));
  font-size: max(11px, calc(var(--lf) * var(--u)));
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: .14em;
  text-align: var(--ta);
  white-space: nowrap;
}
.intro-hilal-ad .intro-altin { transition: filter .3s; }
.intro-hilal:hover .intro-altin,
.intro-hilal:focus-visible .intro-altin {
  filter: drop-shadow(0 1px 1px rgba(0, 0, 0, .9)) drop-shadow(0 0 calc(12 * var(--u)) rgba(255, 220, 130, 1));
}
.intro-hilal:focus-visible .intro-hilal-ad,
.intro-hilal:focus-visible .intro-hilal-yer { outline: 2px solid #f6de9c; outline-offset: 4px; }

/* yon: --hx/--hy disa birim yon; --dx/--dy/--tx/--ty etiket konumu */
.intro-hilal--1, .intro-hilal--3, .intro-hilal--5 { --dx: -1; --dy: 0; --tx: -100%; --ty: -50%; --ta: right; }
.intro-hilal--2, .intro-hilal--4, .intro-hilal--6 { --dx: 1; --dy: 0; --tx: 0; --ty: -50%; --ta: left; }
.intro-hilal--7 { --dx: 0; --dy: 1; --tx: -50%; --ty: 0; --ta: center; }
.intro-hilal--1 { --x: 476; --y: 304; --hx: -.77; --hy: -.64; --ly: -13; --gap: 4; }
.intro-hilal--2 { --x: 1036; --y: 304; --hx: .77; --hy: -.64; --ly: -13; --gap: 4; }
.intro-hilal--3 { --x: 418; --y: 518; --hx: -1; --hy: -.06; }
.intro-hilal--4 { --x: 1094; --y: 518; --hx: 1; --hy: -.06; }
.intro-hilal--5 { --x: 444; --y: 736; --hx: -.85; --hy: .53; --ly: 11; --gap: 4; }
.intro-hilal--6 { --x: 1068; --y: 736; --hx: .85; --hy: .53; --ly: 11; --gap: 4; }
.intro-hilal--7 { --x: 756; --y: 852; --hx: 0; --hy: 1; }

/* ---------- Alt satir ---------- */
.intro-son {
  position: absolute;
  left: 50%;
  top: calc(var(--son-y) * var(--u));
  margin: 0;
  transform: translate(-50%, -50%);
  font-size: calc(var(--son-f) * var(--u));
  font-weight: 600;
  line-height: 1;
  letter-spacing: .3em;
  padding-left: .3em;
  white-space: nowrap;
}

/* ---------- Kose ogeleri ---------- */
.intro-cip {
  position: absolute;
  top: 14px;
  left: 16px;
  z-index: 5;
  margin: 0;
  padding: 6px 9px;
  font: 600 10px/1 Inter, "Segoe UI", system-ui, sans-serif;
  letter-spacing: .14em;
  color: rgba(236, 200, 120, .8);
  border: 1px dashed rgba(226, 184, 90, .45);
  border-radius: 4px;
}
.intro-gec {
  position: absolute;
  top: 12px;
  right: 14px;
  z-index: 5;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 14px;
  font: 600 13px/1 Inter, "Segoe UI", system-ui, sans-serif;
  letter-spacing: .03em;
  color: rgba(247, 243, 234, .85);
  text-decoration: none;
  background: rgba(3, 6, 15, .45);
  border: 1px solid rgba(226, 184, 90, .4);
  border-radius: 999px;
  transition: color .3s, border-color .3s, background-color .3s;
}
.intro-gec:hover,
.intro-gec:focus-visible {
  color: #fff;
  border-color: #e2b85a;
  background-color: rgba(200, 150, 46, .2);
}
.intro-gec:focus-visible { outline: 2px solid #f6de9c; outline-offset: 3px; }
.intro-gec-tus {
  padding: 3px 5px;
  font-size: 10px;
  color: rgba(236, 200, 120, .85);
  border: 1px solid rgba(226, 184, 90, .35);
  border-radius: 4px;
}

/* ---------- Giris efektleri (saf CSS; zaman cizelgesi 70-intro.js ile ayni) ---------- */
@keyframes intro-belir {
  from { opacity: 0; filter: blur(10px); }
  to { opacity: 1; filter: blur(0); }
}
@keyframes intro-cizgi {
  from { transform: scaleX(0); }
  to { transform: scaleX(1); }
}
@keyframes intro-ciz {
  from { stroke-dashoffset: 1; }
  to { stroke-dashoffset: 0; }
}
@keyframes intro-gunes-ac {
  0% { transform: scale(0); opacity: 0; }
  70% { transform: scale(1.25); opacity: 1; }
  100% { transform: scale(1); opacity: 1; }
}
@keyframes intro-don {
  to { transform: rotate(360deg); }
}
@keyframes intro-nabiz {
  0%, 100% { opacity: .78; }
  50% { opacity: 1; }
}
@keyframes intro-parilti {
  0% { background-position: 160% 0, 0 0; }
  28%, 100% { background-position: -60% 0, 0 0; }
}
@keyframes intro-aralik {
  from { opacity: 0; letter-spacing: .7em; filter: blur(8px); }
  to { opacity: 1; letter-spacing: .3em; filter: blur(0); }
}

.intro-logo { animation: intro-belir 1.1s ease .3s both; }
.intro-logo-cizgi { animation: intro-cizgi 1.2s cubic-bezier(.6, 0, .2, 1) .9s both; }
.intro-logo .intro-gunes-dis { animation: intro-gunes-ac 1s cubic-bezier(.2, 1.4, .4, 1) .8s both; }
.intro-beyin path { stroke-dasharray: 1; animation: intro-ciz 1.8s cubic-bezier(.5, 0, .2, 1) 1.3s both; }
.intro-beyin .intro-beyin-dis { animation-delay: 1.2s; }
.intro-yeni { animation: intro-belir 1s ease 2.1s both; }
.intro-yeni .intro-gunes-dis { animation: intro-gunes-ac 1s cubic-bezier(.2, 1.4, .4, 1) 2.5s both; }
.intro-gunes-isinlar { animation: intro-don 60s linear infinite, intro-nabiz 2.8s ease-in-out infinite; }
.intro-manifesto-yazi { animation: intro-belir 1.2s ease 3.2s both; }
.intro-logo .intro-altin,
.intro-manifesto-yazi .intro-altin { animation: intro-parilti 9s ease-in-out 4.2s infinite; }
.intro-hilal-ad { animation: intro-belir .8s ease both; }
.intro-hilal--1 .intro-hilal-ad { animation-delay: 4.05s; }
.intro-hilal--2 .intro-hilal-ad { animation-delay: 4.27s; }
.intro-hilal--3 .intro-hilal-ad { animation-delay: 4.49s; }
.intro-hilal--4 .intro-hilal-ad { animation-delay: 4.71s; }
.intro-hilal--5 .intro-hilal-ad { animation-delay: 4.93s; }
.intro-hilal--6 .intro-hilal-ad { animation-delay: 5.15s; }
.intro-hilal--7 .intro-hilal-ad { animation-delay: 5.37s; }
.intro-hilal-yer { animation: intro-belir .6s ease 3.7s both; }
.intro-yan-not { animation: intro-belir 1s ease 4.6s both; }
.intro-son { animation: intro-aralik 1.6s cubic-bezier(.2, .7, .2, 1) 5.8s both; }

@media (prefers-reduced-motion: reduce) {
  .intro *,
  .intro *::before,
  .intro *::after {
    animation: none !important;
    transition: none !important;
  }
}

/* ---------- Mobil / dikey ekran: 390x844 tasarim tuvali ---------- */
@media (max-width: 759px), (max-aspect-ratio: 4/5) {
  .intro {
    --u: min(calc(100vw / 390), calc(100vh / 844));
    --tw: 390;
    --th: 844;
    --logo-y: 28;
    --logo-f: 54;
    --beyin-w: 60;
    --yeni-y: 166;
    --yeni-f: 16;
    --kx: 195;
    --ky: 428;
    --kr: 100;
    --mf: 30;
    --son-y: 716;
    --son-f: 19;
    --hr: 17;
    --lf: 11;
  }
  @supports (height: 100svh) {
    .intro { --u: min(calc(100vw / 390), calc(100svh / 844)); }
  }
  .intro-logo-cizgi { margin-top: 4px; }
  .intro-beyin { margin-top: calc(8 * var(--u)); }
  .intro-yan--sol { --x: 46; --y: 462; --r: 46; }
  .intro-yan--sag { --x: 344; --y: 462; --r: 46; }
  .intro-yan-not { display: none; }
  .intro-hilal-ad { letter-spacing: .1em; font-size: max(10.5px, calc(var(--lf) * var(--u))); }
  .intro-hilal--1, .intro-hilal--2, .intro-hilal--3, .intro-hilal--4 { --dx: 0; --dy: -1; --tx: -50%; --ty: -100%; --ta: center; --ly: 0; --gap: 14; }
  .intro-hilal--5, .intro-hilal--6, .intro-hilal--7 { --dx: 0; --dy: 1; --tx: -50%; --ty: 0; --ta: center; --ly: 0; --gap: 14; }
  .intro-hilal--1 { --x: 112; --y: 268; }
  .intro-hilal--2 { --x: 278; --y: 268; }
  .intro-hilal--3 { --x: 40; --y: 352; }
  .intro-hilal--4 { --x: 350; --y: 352; }
  .intro-hilal--5 { --x: 84; --y: 574; }
  .intro-hilal--6 { --x: 306; --y: 574; }
  .intro-hilal--7 { --x: 195; --y: 626; }
  .intro-hilal--5 .intro-hilal-ad { white-space: normal; width: 7.5em; }
  .intro-cip { top: 10px; left: 10px; }
  .intro-gec { top: 8px; right: 8px; padding: 8px 11px; font-size: 12px; }
  .intro-gec-tus { display: none; }
}
.intro:not(.intro--canli) .intro-yan-not { display: none; }