/* =========================================================
   ANASAYFA.CSS — hero (katmanlı parallax), hakkımda, çark,
   proje / portföy / deneyim / sertifika önizlemeleri, iletişim
   ========================================================= */
body.sayfa-ana.ust-var { padding-top: 0; }
@keyframes imlecYanip { 50% { opacity: 0; } }
@keyframes ikonZipla { 0%, 100% { transform: translateY(0); } 40% { transform: translateY(-6px); } 70% { transform: translateY(1px); } }

/* =========================================================
   HERO
   ========================================================= */
.hero {
  position: relative; isolation: isolate; overflow: hidden;
  /* en az ekran boyu; kısa ekranda Pokémon kartı sığmazsa hero uzar (kart üst menünün altına girmez, kesilmez) */
  min-height: 640px; min-height: max(640px, 100vh); min-height: max(640px, 100svh);
  display: flex; align-items: center;
  background: #2a1c3a;
}
.hero::after { /* piksel basamaklı alt kenar → krem bölüme geçiş */
  content: ''; position: absolute; left: 0; right: 0; bottom: -1px; height: 24px; z-index: 8; pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 24' shape-rendering='crispEdges'%3E%3Cpath d='M0 24V16H16V8H32V16H48V12H64V4H80V12H96V24Z' fill='%23f3e9d8'/%3E%3C/svg%3E") 0 100% / 96px 24px repeat-x;
}
.hero-sahne { position: absolute; inset: 0; z-index: 0; overflow: hidden; }
.hk { position: absolute; inset: -5% -4% -2%; will-change: transform; }
.hk canvas, .hk-yedek {
  position: absolute; inset: 0; width: 100%; height: 100%; display: block;
  object-fit: cover; object-position: 50% 100%;
  image-rendering: pixelated;
}
.hk-yedek { transition: opacity .5s steps(5); }
.hk-uzak { z-index: 1; }
.hk-bulutlar-arka { z-index: 2; }
.hk-orta { z-index: 3; }
.hk-yakin { z-index: 4; }
.hk-bulutlar-on { z-index: 5; }
.hk-yol { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
#vosvos { image-rendering: pixelated; }

.hk-bulutlar { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.hb { position: absolute; left: 0; top: 0; image-rendering: pixelated; will-change: transform; animation: hbSag linear infinite; }
.hb-1 { top: 7%; height: 16vh; opacity: .9; animation-duration: 110s; animation-delay: -30s; }
.hb-2 { top: 20%; height: 11vh; opacity: .75; animation-name: hbSol; animation-duration: 130s; animation-delay: -80s; }
.hb-3 { top: 30%; height: 8vh; opacity: .6; animation-duration: 160s; animation-delay: -110s; }
.hb-4 { top: 3%; height: 13vh; opacity: .55; animation-name: hbSol; animation-duration: 75s; animation-delay: -12s; }
.hb-5 { top: 15%; height: 9vh; opacity: .45; animation-duration: 90s; animation-delay: -55s; }
.hb-6 { top: 44%; height: 7vh; opacity: .3; animation-name: hbSol; animation-duration: 64s; animation-delay: -34s; }
@keyframes hbSag { from { transform: translateX(-40vw); } to { transform: translateX(110vw); } }
@keyframes hbSol { from { transform: translateX(110vw) scaleX(-1); } to { transform: translateX(-40vw) scaleX(-1); } }

.hero-golge {
  position: absolute; inset: 0; z-index: 6; pointer-events: none;
  background:
    linear-gradient(180deg, rgba(14, 21, 36, .6) 0, rgba(14, 21, 36, 0) 20%),
    linear-gradient(90deg, rgba(14, 21, 36, .82) 0, rgba(14, 21, 36, .5) 32%, rgba(14, 21, 36, 0) 60%);
}

.hero-ic {
  position: relative; z-index: 10;
  display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); align-items: center; gap: 40px;
  padding-top: calc(var(--ust-h) + 26px); padding-bottom: 76px;
}
@media (min-width: 901px) and (max-height: 900px) { .hero-ic { padding-top: calc(var(--ust-h) + 16px); padding-bottom: 40px; } }
.hero-etiket { margin-bottom: 20px; text-shadow: 2px 2px 0 #000; }
.hero-ad {
  display: flex; flex-direction: column; gap: 10px;
  font-family: var(--f-piksel); font-weight: normal;
  font-size: clamp(28px, 5vw, 68px); line-height: 1.12;
  color: var(--krem); text-shadow: 4px 4px 0 rgba(0, 0, 0, .65);
}
.hero-satir { display: block; }
.hero-satir.swagger {
  align-self: flex-start;
  background: linear-gradient(to bottom, #ff6b6b 0 25%, #e03131 25% 50%, #a61e1e 50% 75%, #6b0f0f 75% 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
  text-shadow: none;
  filter: drop-shadow(4px 4px 0 rgba(0, 0, 0, .7));
  animation: swaggerNabiz 1.6s steps(4) infinite alternate;
}
@keyframes swaggerNabiz { to { filter: drop-shadow(4px 4px 0 rgba(0, 0, 0, .7)) drop-shadow(0 0 10px rgba(255, 70, 70, .55)); } }
.hero-daktilo { margin-top: 20px; min-height: 2.2em; font-size: clamp(10px, 1.05vw, 13px); line-height: 1.8; color: var(--turuncu); text-shadow: 2px 2px 0 rgba(0, 0, 0, .85); }
.hero-imlec { color: var(--gold); animation: imlecYanip .7s steps(1) infinite; }
.hero-cta { position: relative; display: inline-block; margin-top: 30px; color: var(--murekkep); text-decoration: none;
  filter: drop-shadow(4px 0 0 var(--murekkep)) drop-shadow(-4px 0 0 var(--murekkep)) drop-shadow(0 4px 0 var(--murekkep)) drop-shadow(0 -4px 0 var(--murekkep)) drop-shadow(8px 8px 0 rgba(0, 0, 0, .45));
  transition: transform .2s steps(2); }
/* "Bana Ulaş": oyun menüsü düğmesi — basamaklı köşe, kabartma; zarf üzerine gelince açılır ve kalp çıkar; arada bir piksel parıltı geçer */
.hc-yuz {
  position: relative; display: flex; align-items: center; gap: 16px; height: 60px; padding: 0 26px 0 20px; overflow: hidden;
  font: 16px/16px var(--f-piksel); letter-spacing: 0; background: var(--gold);
  box-shadow: inset 4px 4px 0 #ffe08a, inset -4px -4px 0 #c8962a, inset 0 -8px 0 #dcaa36;
  clip-path: polygon(0 4px, 4px 4px, 4px 0, calc(100% - 4px) 0, calc(100% - 4px) 4px, 100% 4px, 100% calc(100% - 4px), calc(100% - 4px) calc(100% - 4px), calc(100% - 4px) 100%, 4px 100%, 4px calc(100% - 4px), 0 calc(100% - 4px));
}
.hc-zarf { position: relative; width: 28px; height: 20px; flex: 0 0 28px; }
.hc-zarf svg { position: absolute; left: 0; bottom: 0; display: block; }
.hc-z2 { visibility: hidden; }
.hc-yazi { position: relative; top: 1px; }
.hc-ok { display: block; transition: transform .2s steps(2); }
.hc-ok svg { display: block; }
.hc-parilti { position: absolute; top: -2px; left: 0; width: 36px; height: 64px; pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='36'%20height='64'%20shape-rendering='crispEdges'%3E%3Crect%20x='24'%20y='0'%20width='8'%20height='8'%20fill='rgba%28255%2C255%2C255%2C.55%29'/%3E%3Crect%20x='32'%20y='0'%20width='4'%20height='8'%20fill='rgba%28255%2C255%2C255%2C.25%29'/%3E%3Crect%20x='20'%20y='8'%20width='8'%20height='8'%20fill='rgba%28255%2C255%2C255%2C.55%29'/%3E%3Crect%20x='28'%20y='8'%20width='4'%20height='8'%20fill='rgba%28255%2C255%2C255%2C.25%29'/%3E%3Crect%20x='16'%20y='16'%20width='8'%20height='8'%20fill='rgba%28255%2C255%2C255%2C.55%29'/%3E%3Crect%20x='24'%20y='16'%20width='4'%20height='8'%20fill='rgba%28255%2C255%2C255%2C.25%29'/%3E%3Crect%20x='12'%20y='24'%20width='8'%20height='8'%20fill='rgba%28255%2C255%2C255%2C.55%29'/%3E%3Crect%20x='20'%20y='24'%20width='4'%20height='8'%20fill='rgba%28255%2C255%2C255%2C.25%29'/%3E%3Crect%20x='8'%20y='32'%20width='8'%20height='8'%20fill='rgba%28255%2C255%2C255%2C.55%29'/%3E%3Crect%20x='16'%20y='32'%20width='4'%20height='8'%20fill='rgba%28255%2C255%2C255%2C.25%29'/%3E%3Crect%20x='4'%20y='40'%20width='8'%20height='8'%20fill='rgba%28255%2C255%2C255%2C.55%29'/%3E%3Crect%20x='12'%20y='40'%20width='4'%20height='8'%20fill='rgba%28255%2C255%2C255%2C.25%29'/%3E%3Crect%20x='0'%20y='48'%20width='8'%20height='8'%20fill='rgba%28255%2C255%2C255%2C.55%29'/%3E%3Crect%20x='8'%20y='48'%20width='4'%20height='8'%20fill='rgba%28255%2C255%2C255%2C.25%29'/%3E%3Crect%20x='-4'%20y='56'%20width='8'%20height='8'%20fill='rgba%28255%2C255%2C255%2C.55%29'/%3E%3Crect%20x='4'%20y='56'%20width='4'%20height='8'%20fill='rgba%28255%2C255%2C255%2C.25%29'/%3E%3C/svg%3E") 0 0 / 36px 64px no-repeat; transform: translateX(-40px); animation: hcParla 5s steps(14) infinite 1.6s; }
@keyframes hcParla { 0% { transform: translateX(-40px); } 16%, 100% { transform: translateX(320px); } }
.hc-kalp { position: absolute; left: 27px; top: 4px; z-index: -1; display: block; visibility: hidden; }
.hc-kalp svg { display: block; }
.hero-cta:hover, .hero-cta:focus-visible { transform: translateY(-4px); outline: none; color: var(--murekkep); text-decoration: none !important; }
.hero-cta:hover .hc-z1, .hero-cta:focus-visible .hc-z1 { visibility: hidden; }
.hero-cta:hover .hc-z2, .hero-cta:focus-visible .hc-z2 { visibility: visible; }
.hero-cta:hover .hc-ok, .hero-cta:focus-visible .hc-ok { transform: translateX(4px); }
.hero-cta:hover .hc-kalp, .hero-cta:focus-visible .hc-kalp { visibility: visible; animation: hcKalp .9s steps(1) infinite; }
@keyframes hcKalp { 0% { transform: translateY(-14px); } 25% { transform: translateY(-20px); } 50% { transform: translateY(-26px); } 75% { transform: translateY(-20px); } }
.hero-cta:active { transform: translate(4px, 4px); filter: drop-shadow(4px 0 0 var(--murekkep)) drop-shadow(-4px 0 0 var(--murekkep)) drop-shadow(0 4px 0 var(--murekkep)) drop-shadow(0 -4px 0 var(--murekkep)); }
.hero-cta:active .hc-yuz { box-shadow: inset 4px 4px 0 #c8962a, inset -4px -4px 0 #ffe08a; }
@media (prefers-reduced-motion: reduce) { .hc-parilti { display: none; } .hero-cta:hover .hc-kalp { animation: none; transform: translateY(-20px); } }
.px-ok { display: block; image-rendering: pixelated; }

.hero-kaydir {
  position: absolute; z-index: 10; left: 0; right: 0; bottom: 30px; width: max-content; margin: 0 auto;
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  font-size: 16px; line-height: 16px; letter-spacing: 4px; color: var(--krem); text-decoration: none; text-shadow: 3px 3px 0 #000;
}
.hero-kaydir span { margin-right: -4px; }   /* son harfin harf aralığı ortalamayı kaydırmasın */
.hero-kaydir i { display: block; font-style: normal; color: var(--gold); filter: drop-shadow(3px 3px 0 #000); animation: kaydirZipla 1.2s steps(3) infinite; }
@keyframes kaydirZipla { 50% { transform: translateY(6px); } }

/* ---------- profil kartı (sürüklenebilir sekme) ---------- */
.hero-sag { display: flex; justify-content: center; }
.profil { position: relative; width: 340px; max-width: 100%; z-index: 12; }
.profil.surukleniyor { z-index: 40; }
.profil-kart {
  position: relative; background: var(--gece-2);
  box-shadow: 0 0 0 4px var(--murekkep), 0 0 0 8px var(--wood), 0 0 0 12px var(--murekkep), 14px 16px 0 12px rgba(0, 0, 0, .35);
  animation: kartSuzul 5s ease-in-out infinite;
}
.profil.surukleniyor .profil-kart, .profil.tasindi .profil-kart { animation: none; }
@keyframes kartSuzul { 50% { transform: translateY(-8px); } }
.profil-sekme {
  display: flex; align-items: center; gap: 8px;
  padding: 10px 10px 9px;
  font-size: 8px; color: var(--krem); text-shadow: 2px 2px 0 var(--wood-golge);
  background: linear-gradient(180deg, var(--wood-light) 0 3px, var(--wood) 3px calc(100% - 3px), var(--wood-dark) calc(100% - 3px));
  cursor: grab; touch-action: none; -webkit-user-select: none; user-select: none;
}
.profil.surukleniyor .profil-sekme { cursor: grabbing; }
.profil-sekme-nokta { width: 10px; height: 10px; background: var(--yesil); box-shadow: 0 0 0 2px var(--murekkep); animation: imlecYanip 1.6s steps(1) infinite; }
.profil-sekme-ipucu { margin-left: auto; font-size: 6px; opacity: .85; }
.profil-cerceve {
  position: relative; overflow: hidden;
  aspect-ratio: 1856 / 2292;
  background: #fff;
  border-top: 4px solid var(--murekkep); border-bottom: 4px solid var(--murekkep);
  cursor: none; -webkit-user-select: none; user-select: none;
}
.profil-taban, .profil-siber { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; image-rendering: pixelated; }
.profil-siber { opacity: 0; }
.profil-buyutec {
  position: absolute; left: 0; top: 0; z-index: 3; width: 300px; max-width: none;
  opacity: 0; pointer-events: none; image-rendering: pixelated;
  filter: drop-shadow(4px 6px 0 rgba(0, 0, 0, .4));
}
.profil-ipucu {
  position: absolute; left: 8px; bottom: 8px; z-index: 2;
  padding: 5px 7px; font-size: 6px; color: var(--krem); background: rgba(14, 21, 36, .85);
  transition: opacity .2s steps(2);
}
.profil-cerceve:hover .profil-ipucu, .profil.siber-acik .profil-ipucu { opacity: 0; }
@media (hover: none) { .profil-cerceve { cursor: pointer; } .profil-ipucu::after { content: ' — dokun'; } }
.profil-alt { display: flex; justify-content: space-between; align-items: center; padding: 9px 10px 8px; font-size: 7px; color: var(--gold); }
/* Minecraft kalpleri: 9×8 piksel sprite, tam 2 kat (18×16) */
.profil-can { display: flex; gap: 2px; }
.profil-can i { display: block; width: 18px; height: 16px; background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%209%208'%20shape-rendering='crispEdges'%3E%3Crect%20x='1'%20y='0'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='2'%20y='0'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='6'%20y='0'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='7'%20y='0'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='0'%20y='1'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='1'%20y='1'%20width='1'%20height='1'%20fill='%23ffffff'/%3E%3Crect%20x='2'%20y='1'%20width='1'%20height='1'%20fill='%23ffffff'/%3E%3Crect%20x='3'%20y='1'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='5'%20y='1'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='6'%20y='1'%20width='1'%20height='1'%20fill='%23ff2a2a'/%3E%3Crect%20x='7'%20y='1'%20width='1'%20height='1'%20fill='%23ff2a2a'/%3E%3Crect%20x='8'%20y='1'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='0'%20y='2'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='1'%20y='2'%20width='1'%20height='1'%20fill='%23ffffff'/%3E%3Crect%20x='2'%20y='2'%20width='1'%20height='1'%20fill='%23ff2a2a'/%3E%3Crect%20x='3'%20y='2'%20width='1'%20height='1'%20fill='%23ff2a2a'/%3E%3Crect%20x='4'%20y='2'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='5'%20y='2'%20width='1'%20height='1'%20fill='%23ff2a2a'/%3E%3Crect%20x='6'%20y='2'%20width='1'%20height='1'%20fill='%23ff2a2a'/%3E%3Crect%20x='7'%20y='2'%20width='1'%20height='1'%20fill='%23ff2a2a'/%3E%3Crect%20x='8'%20y='2'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='0'%20y='3'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='1'%20y='3'%20width='1'%20height='1'%20fill='%23ff2a2a'/%3E%3Crect%20x='2'%20y='3'%20width='1'%20height='1'%20fill='%23ff2a2a'/%3E%3Crect%20x='3'%20y='3'%20width='1'%20height='1'%20fill='%23ff2a2a'/%3E%3Crect%20x='4'%20y='3'%20width='1'%20height='1'%20fill='%23ff2a2a'/%3E%3Crect%20x='5'%20y='3'%20width='1'%20height='1'%20fill='%23ff2a2a'/%3E%3Crect%20x='6'%20y='3'%20width='1'%20height='1'%20fill='%23ff2a2a'/%3E%3Crect%20x='7'%20y='3'%20width='1'%20height='1'%20fill='%23b30000'/%3E%3Crect%20x='8'%20y='3'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='1'%20y='4'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='2'%20y='4'%20width='1'%20height='1'%20fill='%23ff2a2a'/%3E%3Crect%20x='3'%20y='4'%20width='1'%20height='1'%20fill='%23ff2a2a'/%3E%3Crect%20x='4'%20y='4'%20width='1'%20height='1'%20fill='%23ff2a2a'/%3E%3Crect%20x='5'%20y='4'%20width='1'%20height='1'%20fill='%23ff2a2a'/%3E%3Crect%20x='6'%20y='4'%20width='1'%20height='1'%20fill='%23b30000'/%3E%3Crect%20x='7'%20y='4'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='2'%20y='5'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='3'%20y='5'%20width='1'%20height='1'%20fill='%23ff2a2a'/%3E%3Crect%20x='4'%20y='5'%20width='1'%20height='1'%20fill='%23ff2a2a'/%3E%3Crect%20x='5'%20y='5'%20width='1'%20height='1'%20fill='%23b30000'/%3E%3Crect%20x='6'%20y='5'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='3'%20y='6'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='4'%20y='6'%20width='1'%20height='1'%20fill='%23b30000'/%3E%3Crect%20x='5'%20y='6'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='4'%20y='7'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3C/svg%3E") 0 0 / 18px 16px no-repeat; image-rendering: pixelated; }
.profil-can i.yarim { background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%209%208'%20shape-rendering='crispEdges'%3E%3Crect%20x='1'%20y='0'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='2'%20y='0'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='6'%20y='0'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='7'%20y='0'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='0'%20y='1'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='1'%20y='1'%20width='1'%20height='1'%20fill='%23ffffff'/%3E%3Crect%20x='2'%20y='1'%20width='1'%20height='1'%20fill='%23ffffff'/%3E%3Crect%20x='3'%20y='1'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='5'%20y='1'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='6'%20y='1'%20width='1'%20height='1'%20fill='%233d3d3d'/%3E%3Crect%20x='7'%20y='1'%20width='1'%20height='1'%20fill='%233d3d3d'/%3E%3Crect%20x='8'%20y='1'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='0'%20y='2'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='1'%20y='2'%20width='1'%20height='1'%20fill='%23ffffff'/%3E%3Crect%20x='2'%20y='2'%20width='1'%20height='1'%20fill='%23ff2a2a'/%3E%3Crect%20x='3'%20y='2'%20width='1'%20height='1'%20fill='%23ff2a2a'/%3E%3Crect%20x='4'%20y='2'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='5'%20y='2'%20width='1'%20height='1'%20fill='%233d3d3d'/%3E%3Crect%20x='6'%20y='2'%20width='1'%20height='1'%20fill='%233d3d3d'/%3E%3Crect%20x='7'%20y='2'%20width='1'%20height='1'%20fill='%233d3d3d'/%3E%3Crect%20x='8'%20y='2'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='0'%20y='3'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='1'%20y='3'%20width='1'%20height='1'%20fill='%23ff2a2a'/%3E%3Crect%20x='2'%20y='3'%20width='1'%20height='1'%20fill='%23ff2a2a'/%3E%3Crect%20x='3'%20y='3'%20width='1'%20height='1'%20fill='%23ff2a2a'/%3E%3Crect%20x='4'%20y='3'%20width='1'%20height='1'%20fill='%23ff2a2a'/%3E%3Crect%20x='5'%20y='3'%20width='1'%20height='1'%20fill='%233d3d3d'/%3E%3Crect%20x='6'%20y='3'%20width='1'%20height='1'%20fill='%233d3d3d'/%3E%3Crect%20x='7'%20y='3'%20width='1'%20height='1'%20fill='%233d3d3d'/%3E%3Crect%20x='8'%20y='3'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='1'%20y='4'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='2'%20y='4'%20width='1'%20height='1'%20fill='%23ff2a2a'/%3E%3Crect%20x='3'%20y='4'%20width='1'%20height='1'%20fill='%23ff2a2a'/%3E%3Crect%20x='4'%20y='4'%20width='1'%20height='1'%20fill='%23ff2a2a'/%3E%3Crect%20x='5'%20y='4'%20width='1'%20height='1'%20fill='%233d3d3d'/%3E%3Crect%20x='6'%20y='4'%20width='1'%20height='1'%20fill='%233d3d3d'/%3E%3Crect%20x='7'%20y='4'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='2'%20y='5'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='3'%20y='5'%20width='1'%20height='1'%20fill='%23ff2a2a'/%3E%3Crect%20x='4'%20y='5'%20width='1'%20height='1'%20fill='%23ff2a2a'/%3E%3Crect%20x='5'%20y='5'%20width='1'%20height='1'%20fill='%233d3d3d'/%3E%3Crect%20x='6'%20y='5'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='3'%20y='6'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='4'%20y='6'%20width='1'%20height='1'%20fill='%23b30000'/%3E%3Crect%20x='5'%20y='6'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3Crect%20x='4'%20y='7'%20width='1'%20height='1'%20fill='%231a0505'/%3E%3C/svg%3E"); }

/* ---------- Eren.exe → Pokémon kartı: sarı çerçeve, gök mavisi yüz, HP yerine Minecraft kalpleri (tıklayınca gizli sayfa),
   holografik parıltılı görsel penceresi, yetenek + iki hamle, zayıflık/direnç, açıklama kutusu. Kart adı satırından sürüklenir. ---------- */
.profil-kart.pk {
  position: relative; z-index: 2; background: none; box-shadow: none;
  filter: drop-shadow(4px 0 0 var(--murekkep)) drop-shadow(-4px 0 0 var(--murekkep)) drop-shadow(0 4px 0 var(--murekkep)) drop-shadow(0 -4px 0 var(--murekkep)) drop-shadow(12px 14px 0 rgba(0, 0, 0, .35));
}
.pk-kenar {
  padding: 10px; background: #f2c63c;
  box-shadow: inset 4px 4px 0 #ffe27a, inset -4px -4px 0 #c99a1f;
  clip-path: polygon(0 8px, 4px 8px, 4px 4px, 8px 4px, 8px 0, calc(100% - 8px) 0, calc(100% - 8px) 4px, calc(100% - 4px) 4px, calc(100% - 4px) 8px, 100% 8px, 100% calc(100% - 8px), calc(100% - 4px) calc(100% - 8px), calc(100% - 4px) calc(100% - 4px), calc(100% - 8px) calc(100% - 4px), calc(100% - 8px) 100%, 8px 100%, 8px calc(100% - 4px), 4px calc(100% - 4px), 4px calc(100% - 8px), 0 calc(100% - 8px));
}
.pk-yuz {
  position: relative; display: flex; flex-direction: column; padding: 6px 8px 8px; color: #0d1724;
  background: repeating-linear-gradient(180deg, #6f97b8 0 8px, #668dad 8px 16px);
  box-shadow: inset 0 0 0 2px #45698a;
}
.pk-ust { display: flex; align-items: center; gap: 6px; height: 22px; font-size: 8px; line-height: 8px; }
.pk-evre { padding: 4px 5px; color: #fff; background: #45698a; box-shadow: inset 0 -2px 0 #2f4d69; }
.pk-lv { color: #17263a; }
.pk-can { margin-left: auto; display: flex; align-items: center; gap: 4px; padding: 2px; color: #c0392b; text-decoration: none !important; cursor: pointer; }
.pk-hp { font-size: 8px; line-height: 8px; }
.pk-can:hover .profil-can i, .pk-can:focus-visible .profil-can i { animation: pkKalp .5s steps(1) infinite; }
.pk-can .profil-can i:nth-child(2) { animation-delay: .1s; } .pk-can .profil-can i:nth-child(3) { animation-delay: .2s; }
.pk-can .profil-can i:nth-child(4) { animation-delay: .3s; } .pk-can .profil-can i:nth-child(5) { animation-delay: .4s; }
@keyframes pkKalp { 0% { transform: translateY(0); } 50% { transform: translateY(-4px); } }
.pk-can:focus-visible { outline: 2px solid var(--murekkep); outline-offset: 1px; }
.pk-ad-satir { display: flex; align-items: center; justify-content: space-between; gap: 8px; height: 32px; cursor: grab; touch-action: none; -webkit-user-select: none; user-select: none; }
.profil.surukleniyor .pk-ad-satir { cursor: grabbing; }
.pk-ad { font-size: 16px; line-height: 16px; letter-spacing: 0; white-space: nowrap; }
.pk-tur svg, .pk-enerji svg { display: block; }
.pk-gorsel { position: relative; padding: 4px; background: #c8a24a; box-shadow: inset 0 0 0 2px #8a6d1d, 0 0 0 2px #fff4c8; }
.pk-gorsel .profil-cerceve { aspect-ratio: 1856 / 2292; border: 0; box-shadow: 0 0 0 2px var(--murekkep); }   /* portre kırpılmadan: ceket de görünür */
.pk-gorsel .profil-taban, .pk-gorsel .profil-siber { object-position: 50% 10%; }
.pk-parilti { position: absolute; inset: 4px; z-index: 4; overflow: hidden; pointer-events: none; }
.pk-parilti::before { content: ''; position: absolute; top: 0; left: 0; width: 80px; height: 240px;
  background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='80'%20height='240'%20shape-rendering='crispEdges'%3E%3Crect%20x='56'%20y='0'%20width='12'%20height='16'%20fill='rgba%28255%2C255%2C255%2C.5%29'/%3E%3Crect%20x='68'%20y='0'%20width='8'%20height='16'%20fill='rgba%28160%2C230%2C255%2C.35%29'/%3E%3Crect%20x='52'%20y='0'%20width='4'%20height='16'%20fill='rgba%28255%2C200%2C240%2C.3%29'/%3E%3Crect%20x='52'%20y='16'%20width='12'%20height='16'%20fill='rgba%28255%2C255%2C255%2C.5%29'/%3E%3Crect%20x='64'%20y='16'%20width='8'%20height='16'%20fill='rgba%28160%2C230%2C255%2C.35%29'/%3E%3Crect%20x='48'%20y='16'%20width='4'%20height='16'%20fill='rgba%28255%2C200%2C240%2C.3%29'/%3E%3Crect%20x='48'%20y='32'%20width='12'%20height='16'%20fill='rgba%28255%2C255%2C255%2C.5%29'/%3E%3Crect%20x='60'%20y='32'%20width='8'%20height='16'%20fill='rgba%28160%2C230%2C255%2C.35%29'/%3E%3Crect%20x='44'%20y='32'%20width='4'%20height='16'%20fill='rgba%28255%2C200%2C240%2C.3%29'/%3E%3Crect%20x='44'%20y='48'%20width='12'%20height='16'%20fill='rgba%28255%2C255%2C255%2C.5%29'/%3E%3Crect%20x='56'%20y='48'%20width='8'%20height='16'%20fill='rgba%28160%2C230%2C255%2C.35%29'/%3E%3Crect%20x='40'%20y='48'%20width='4'%20height='16'%20fill='rgba%28255%2C200%2C240%2C.3%29'/%3E%3Crect%20x='40'%20y='64'%20width='12'%20height='16'%20fill='rgba%28255%2C255%2C255%2C.5%29'/%3E%3Crect%20x='52'%20y='64'%20width='8'%20height='16'%20fill='rgba%28160%2C230%2C255%2C.35%29'/%3E%3Crect%20x='36'%20y='64'%20width='4'%20height='16'%20fill='rgba%28255%2C200%2C240%2C.3%29'/%3E%3Crect%20x='36'%20y='80'%20width='12'%20height='16'%20fill='rgba%28255%2C255%2C255%2C.5%29'/%3E%3Crect%20x='48'%20y='80'%20width='8'%20height='16'%20fill='rgba%28160%2C230%2C255%2C.35%29'/%3E%3Crect%20x='32'%20y='80'%20width='4'%20height='16'%20fill='rgba%28255%2C200%2C240%2C.3%29'/%3E%3Crect%20x='32'%20y='96'%20width='12'%20height='16'%20fill='rgba%28255%2C255%2C255%2C.5%29'/%3E%3Crect%20x='44'%20y='96'%20width='8'%20height='16'%20fill='rgba%28160%2C230%2C255%2C.35%29'/%3E%3Crect%20x='28'%20y='96'%20width='4'%20height='16'%20fill='rgba%28255%2C200%2C240%2C.3%29'/%3E%3Crect%20x='28'%20y='112'%20width='12'%20height='16'%20fill='rgba%28255%2C255%2C255%2C.5%29'/%3E%3Crect%20x='40'%20y='112'%20width='8'%20height='16'%20fill='rgba%28160%2C230%2C255%2C.35%29'/%3E%3Crect%20x='24'%20y='112'%20width='4'%20height='16'%20fill='rgba%28255%2C200%2C240%2C.3%29'/%3E%3Crect%20x='24'%20y='128'%20width='12'%20height='16'%20fill='rgba%28255%2C255%2C255%2C.5%29'/%3E%3Crect%20x='36'%20y='128'%20width='8'%20height='16'%20fill='rgba%28160%2C230%2C255%2C.35%29'/%3E%3Crect%20x='20'%20y='128'%20width='4'%20height='16'%20fill='rgba%28255%2C200%2C240%2C.3%29'/%3E%3Crect%20x='20'%20y='144'%20width='12'%20height='16'%20fill='rgba%28255%2C255%2C255%2C.5%29'/%3E%3Crect%20x='32'%20y='144'%20width='8'%20height='16'%20fill='rgba%28160%2C230%2C255%2C.35%29'/%3E%3Crect%20x='16'%20y='144'%20width='4'%20height='16'%20fill='rgba%28255%2C200%2C240%2C.3%29'/%3E%3Crect%20x='16'%20y='160'%20width='12'%20height='16'%20fill='rgba%28255%2C255%2C255%2C.5%29'/%3E%3Crect%20x='28'%20y='160'%20width='8'%20height='16'%20fill='rgba%28160%2C230%2C255%2C.35%29'/%3E%3Crect%20x='12'%20y='160'%20width='4'%20height='16'%20fill='rgba%28255%2C200%2C240%2C.3%29'/%3E%3Crect%20x='12'%20y='176'%20width='12'%20height='16'%20fill='rgba%28255%2C255%2C255%2C.5%29'/%3E%3Crect%20x='24'%20y='176'%20width='8'%20height='16'%20fill='rgba%28160%2C230%2C255%2C.35%29'/%3E%3Crect%20x='8'%20y='176'%20width='4'%20height='16'%20fill='rgba%28255%2C200%2C240%2C.3%29'/%3E%3Crect%20x='8'%20y='192'%20width='12'%20height='16'%20fill='rgba%28255%2C255%2C255%2C.5%29'/%3E%3Crect%20x='20'%20y='192'%20width='8'%20height='16'%20fill='rgba%28160%2C230%2C255%2C.35%29'/%3E%3Crect%20x='4'%20y='192'%20width='4'%20height='16'%20fill='rgba%28255%2C200%2C240%2C.3%29'/%3E%3Crect%20x='4'%20y='208'%20width='12'%20height='16'%20fill='rgba%28255%2C255%2C255%2C.5%29'/%3E%3Crect%20x='16'%20y='208'%20width='8'%20height='16'%20fill='rgba%28160%2C230%2C255%2C.35%29'/%3E%3Crect%20x='0'%20y='208'%20width='4'%20height='16'%20fill='rgba%28255%2C200%2C240%2C.3%29'/%3E%3Crect%20x='0'%20y='224'%20width='12'%20height='16'%20fill='rgba%28255%2C255%2C255%2C.5%29'/%3E%3Crect%20x='12'%20y='224'%20width='8'%20height='16'%20fill='rgba%28160%2C230%2C255%2C.35%29'/%3E%3Crect%20x='-4'%20y='224'%20width='4'%20height='16'%20fill='rgba%28255%2C200%2C240%2C.3%29'/%3E%3C/svg%3E") 0 0 / 80px 240px no-repeat; transform: translateX(-90px); animation: pkParla 7s steps(20) infinite 2.4s; }
@keyframes pkParla { 0% { transform: translateX(-90px); } 14%, 100% { transform: translateX(330px); } }
.pk-seri { margin: 7px 0 5px; padding: 4px 6px; font-size: 8px; line-height: 8px; text-align: center; white-space: nowrap; overflow: hidden; color: #5d6b80; background: #f4e8b8; box-shadow: inset 0 0 0 2px #d8c27a; }
.pk-hamleler { display: grid; gap: 5px; margin-top: 8px; padding: 0 2px 5px; }
.pk-hamle p { margin: 0; }
.pk-h-bas { display: flex; align-items: center; gap: 6px; }
.pk-h-bas b { font-family: var(--f-govde); font-size: 16px; font-weight: 700; line-height: 18px; }
.pk-enerji { display: inline-flex; gap: 2px; }
.pk-etk { padding: 3px 4px; font-size: 8px; line-height: 8px; color: #fff; background: #c0392b; box-shadow: inset 0 -2px 0 #8f2a20; }
.pk-hasar { margin-left: auto; font-size: 16px; line-height: 16px; }
.pk-h-acik { font-family: var(--f-govde); font-size: 13px; line-height: 16px; color: #0d1724; }
.pk-zayif { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr) minmax(0, 1fr); gap: 4px; padding: 5px 2px 4px; box-shadow: 0 -2px 0 #45698a; }
.pk-zayif .pk-enerji { flex-direction: row; gap: 2px; }
.pk-zayif span { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; font-family: var(--f-govde); font-size: 11px; line-height: 13px; color: #17263a; }
.pk-zayif b { font-size: 12px; line-height: 14px; font-weight: 700; color: var(--murekkep); white-space: nowrap; }
.pk-tat { margin: 3px 0 6px; padding: 5px 7px; font-family: var(--f-govde); font-size: 12px; line-height: 15px; color: #3a4a5c; background: #fbf5dc; box-shadow: inset 0 0 0 2px #c8a24a; }
.pk-alt { display: flex; justify-content: space-between; align-items: center; margin: 0; font-size: 8px; line-height: 8px; color: #17263a; }
.pk-no { display: inline-flex; align-items: center; gap: 4px; }
.pk-no svg { display: block; color: #f2c63c; }
@media (prefers-reduced-motion: reduce) { .pk-parilti::before { animation: none; display: none; } .pk-can:hover .profil-can i { animation: none; } }
/* telefonda kart dar kalmasın (kalpler ve seri satırı sığsın) */
@media (max-width: 600px) { .profil.profil { width: min(330px, calc(100vw - 32px)); } }
/* Hakkımda rulosu kartın arkasından çıkar: kartla aynı genişlikte, kartın altında (z-index; .hakkimda-panel kuralında) durur */
.profil-hakkimda { z-index: 3; }

.profil-hakkimda {
  position: relative; display: block; margin: 26px auto 0;
  padding: 10px 14px 9px;
  font-family: var(--f-piksel); font-size: 8px; color: var(--murekkep);
  background: var(--krem); border: 0; cursor: pointer;
  box-shadow: 0 0 0 3px var(--murekkep), inset -3px -3px 0 var(--krem-2), 5px 5px 0 3px rgba(0, 0, 0, .35);
  transform-origin: 50% -16px;
}
.profil-hakkimda::before, .profil-hakkimda::after { /* karta bağlayan iki kısa zincir */
  content: ''; position: absolute; bottom: calc(100% + 3px); width: 6px; height: 18px;
  background: repeating-linear-gradient(180deg, var(--chain) 0 6px, transparent 6px 8px, #7d838e 8px 12px, transparent 12px 14px);
}
.profil-hakkimda::before { left: 18px; }
.profil-hakkimda::after { right: 18px; }
.profil-hakkimda:hover { animation: tabelaSalla .9s ease-in-out 1; color: var(--wood-dark); }
@keyframes tabelaSalla { 25% { transform: rotate(4deg); } 60% { transform: rotate(-3deg); } 85% { transform: rotate(1deg); } }
.profil-hakkimda[aria-expanded="true"] { background: var(--gold); }

.hakkimda-panel {
  position: absolute; top: 40px; right: calc(100% + 28px); z-index: 1;   /* kartın (z 2) arkasında: rulo kartın altından çıkar */
  width: 340px; padding: 0 14px;
  color: var(--murekkep);
  filter: drop-shadow(8px 8px 0 rgba(0, 0, 0, .35));
}
/* ---------- Hakkımda: piksel parşömen rulo (çubuklar topuzlu; alt çubuk kâğıtla iner/çıkar) ---------- */
.rulo-cubuk {
  position: relative; z-index: 2; display: block; height: 16px; margin: 0 -10px;
  background: #8a4f2a;
  box-shadow: inset 0 4px 0 #b9733f, inset 0 -4px 0 #5a2f16, 0 0 0 3px var(--murekkep);
}
.rulo-cubuk::before, .rulo-cubuk::after { /* topuzlar */
  content: ''; position: absolute; top: -4px; width: 12px; height: 24px;
  background: #f0c040; box-shadow: inset -3px -3px 0 #a87a14, inset 3px 3px 0 #ffe28a, 0 0 0 3px var(--murekkep);
}
.rulo-cubuk::before { left: -16px; }
.rulo-cubuk::after { right: -16px; }
.rulo-kagit {
  position: relative; height: 0; overflow: hidden; overscroll-behavior: contain;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' shape-rendering='crispEdges'%3E%3Cpath fill='%23dcc394' d='M2 4h2v2H2zM10 12h4v2h-4zM12 2h2v2h-2z'/%3E%3C/svg%3E") 0 0 / 16px 16px,
    #f3e3bf;
  box-shadow: inset 6px 0 0 #e2cb9b, inset -6px 0 0 #e2cb9b, 0 0 0 3px var(--murekkep);
}
.rulo-kagit.acik { overflow-y: auto; }
/* alt çubuğa sarılı kâğıt: açıldıkça incelir (yükseklik JS'te, 2 px adımlı) */
.rulo-sarili {
  position: relative; z-index: 1; display: block; height: 20px; margin: 0 -4px;
  background: #f3e3bf;
  box-shadow: inset 0 3px 0 #fff4da, inset 0 -4px 0 #c9ab74, inset 0 -8px 0 #e2cb9b, 0 0 0 3px var(--murekkep);
}
.rulo-ic { padding: 18px 20px 14px; }
.hakkimda-panel.altta { top: auto; right: auto; position: relative; width: 100%; margin-top: 20px; max-height: none; }
.hp-kapat { position: absolute !important; top: 10px; right: 12px; width: 28px !important; height: 28px !important; font-size: 10px !important; }
.hp-baslik { font-size: 9px; color: var(--wood-dark); margin: 0 40px 12px 0; }
.hp-metin p { font-family: var(--f-govde); font-size: 16px; line-height: 1.45; margin: 0 0 10px; }
.hp-dug { display: flex; flex-wrap: wrap; gap: 18px; margin-top: 10px; }

/* ---------- mesaj → kâğıt uçak (origami): kâğıt köşelerinden katlanır, uçak olup uçar ---------- */
.ai-origami { position: fixed; z-index: 9500; left: 0; top: 0; pointer-events: none; image-rendering: pixelated; will-change: transform; filter: drop-shadow(8px 8px 0 rgba(0, 0, 0, .22)); }
/* bal kabı: botlar doldurur, insanlar görmez */
.ai-bal { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.ai-iz { position: fixed; z-index: 9500; width: 6px; height: 6px; background: #fdf8ee; box-shadow: 0 0 0 2px rgba(26, 16, 40, .5); pointer-events: none; }

/* ---------- uçan fotoğraflar ---------- */
.hero-ucanlar { position: absolute; inset: 0; z-index: 9; pointer-events: none; }
.ucan { position: absolute; left: 0; top: 0; pointer-events: auto; cursor: grab; touch-action: none; -webkit-user-select: none; user-select: none; will-change: transform; }
.ucan.suruk { cursor: grabbing; }
.ucan img { display: block; width: 100%; height: auto; image-rendering: pixelated; filter: drop-shadow(0 12px 8px rgba(0, 0, 0, .35)); pointer-events: none; }
.ucan:focus-visible { outline: 3px dashed var(--gold); outline-offset: 6px; }
.ucan-duman { position: absolute; z-index: 8; width: 8px; height: 8px; background: #f3eefa; box-shadow: 2px 2px 0 #9d8dbf; pointer-events: none; }
.ucan-balon {
  position: absolute; z-index: 30; width: 260px; max-width: calc(100vw - 32px);
  padding: 14px 14px 12px;
  font-family: var(--f-govde); font-size: 15px; line-height: 1.4;
  color: var(--murekkep); background: var(--krem);
  box-shadow: 0 0 0 3px var(--murekkep), 6px 6px 0 3px rgba(0, 0, 0, .35);
  pointer-events: auto;
}
.ucan-balon b { display: block; margin-bottom: 6px; font-family: var(--f-piksel); font-size: 8px; font-weight: normal; color: var(--wood-dark); }
.ucan-balon .pdug { margin-top: 12px; }
.ucan-balon-kapat { position: absolute; top: 6px; right: 6px; width: 22px; height: 22px; font-family: var(--f-piksel); font-size: 9px; border: 0; cursor: pointer; background: var(--murekkep); color: var(--krem); }

/* =========================================================
   BÖLÜMLER (ortak)
   ========================================================= */
.bolum { position: relative; padding: clamp(56px, 7vw, 96px) 0; }
.ap-yer, .ap-yer *, .apf-kart, .ad-oge a, .ad-oge a *, .as-duvar .basarim, .as-duvar .basarim *, .ai-kanal a, .ai-kanal a * { text-decoration: none !important; }
.bolum.krem { background: var(--krem); color: var(--murekkep); }
.bolum.krem .vurgu { color: var(--kirmizi); }
.bolum-bas { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 20px 30px; margin-bottom: 44px; }
.bolum-bas .etiket { margin-bottom: 14px; }
.ok-link.koyu { color: var(--wood-dark); }

/* ---------- hakkımda ---------- */
.hk-bolum { overflow: hidden; }
.hk-ifade {
  max-width: 1100px; margin: 20px 0 60px;
  font-family: var(--f-govde); font-weight: 700;
  font-size: clamp(28px, 4.3vw, 58px); line-height: 1.12;
}
.hk-ifade .k { opacity: .14; transition: opacity .2s steps(2); }
.hk-ifade .k.dolu { opacity: 1; }
.hk-ifade .k.vk { color: var(--kirmizi); }
.hk-izgara { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(30px, 6vw, 90px); align-items: start; }
.hk-paragraflar p { font-family: var(--f-govde); font-size: 18px; line-height: 1.55; color: #3a332c; margin-bottom: 14px; }
.hk-dug { display: flex; flex-wrap: wrap; align-items: center; gap: 22px 28px; margin-top: 30px; }
.hk-sayilar { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.hk-sayi {
  padding: 24px 20px 22px; background: #fffaf0;
  box-shadow: 0 0 0 4px var(--murekkep), 8px 8px 0 4px var(--wood);
  transition: transform .2s ease-out;
}
.hk-sayi:nth-child(even) { margin-top: 48px; }
.hk-sayi b { display: block; font-family: var(--f-piksel); font-weight: normal; font-size: clamp(26px, 3.2vw, 42px); line-height: 1; color: var(--murekkep); }
.hk-sayi b small { font-size: .5em; color: var(--kirmizi); margin-left: 4px; }
.hk-sayi span { display: block; margin-top: 14px; font-family: var(--f-govde); font-weight: 600; font-size: 17px; line-height: 1.3; }
.hk-sayi em { display: block; margin-top: 4px; font-style: normal; font-family: var(--f-govde); font-size: 14px; color: #6b6156; }

/* ---------- çark ---------- */
.cark-bolum { position: relative; height: 240vh; background: #17122b; }
/* piksel gökyüzü: yumuşak geçiş yerine sert bantlar (alacakaranlık) */
.cark-yapiskan {
  position: sticky; top: 0; height: 100vh; height: 100svh; overflow: hidden; display: grid; place-items: center; padding-top: var(--ust-h);
  background: linear-gradient(180deg, #110c20 0 14%, #160f29 14% 30%, #1b1431 30% 46%, #21183a 46% 62%, #281d42 62% 78%, #30224a 78% 90%, #3a2850 90% 100%);
}
.cark-yildizlar {
  position: absolute; inset: 0; opacity: .35; pointer-events: none;
  background:
    linear-gradient(#fff6d8, #fff6d8) 12% 18% / 3px 3px no-repeat,
    linear-gradient(#fff6d8, #fff6d8) 82% 12% / 3px 3px no-repeat,
    linear-gradient(#fff6d8, #fff6d8) 70% 78% / 2px 2px no-repeat,
    linear-gradient(#fff6d8, #fff6d8) 22% 82% / 2px 2px no-repeat,
    linear-gradient(#fff6d8, #fff6d8) 46% 8% / 2px 2px no-repeat,
    linear-gradient(#fff6d8, #fff6d8) 92% 56% / 3px 3px no-repeat,
    linear-gradient(#fff6d8, #fff6d8) 6% 54% / 2px 2px no-repeat;
}
.cark-merkez { position: relative; z-index: 3; max-width: min(560px, 84vw); padding: 0 16px; text-align: center; }
.cark-baslik { margin: 16px 0 18px; font-family: var(--f-govde); font-weight: 700; font-size: clamp(24px, 3.2vw, 42px); line-height: 1.15; color: var(--krem); }
.cark-aktif { min-height: 3em; font-family: var(--f-govde); font-size: 17px; line-height: 1.45; color: var(--soluk); }
.cark-aktif b { color: var(--gold); font-weight: 600; }
.cark { position: absolute; left: 50%; top: 50%; width: 0; height: 0; z-index: 2; }
.cark-ic { position: absolute; left: 0; top: 0; }
/* halka: yumuşak kesikli çember yerine piksel noktalar (JS yerleştirir) */
.cark-halka { position: absolute; pointer-events: none; }
.cark-halka i { position: absolute; width: 4px; height: 4px; background: rgba(240, 192, 64, .42); }
.cark-halka i:nth-child(3n) { background: rgba(243, 233, 216, .22); }
.cark-oge {
  position: absolute; left: 0; top: 0; width: 116px; margin: -46px 0 0 -58px;
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  will-change: transform;
}
.cark-kare {
  width: 76px; height: 76px; display: grid; place-items: center;
  font-family: var(--f-piksel); font-size: 16px; color: var(--renk); text-shadow: none;
  background: #f6efe2;
  box-shadow: 0 0 0 4px var(--murekkep), inset -6px -6px 0 #dccfb6, inset 6px 6px 0 #fffaf2, 6px 6px 0 4px rgba(0, 0, 0, .35);
  transition: transform .3s steps(3), box-shadow .3s steps(3);
}
.cark-kare img { max-width: 78%; max-height: 78%; object-fit: contain; image-rendering: auto; }
.cark-ad {
  max-width: 112px; font-family: var(--f-govde); font-weight: 600; font-size: 13px; line-height: 1.15; text-align: center; color: var(--krem); text-shadow: 2px 2px 0 #000;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.cark-tip { display: none; }
/* aktif: büyütme yok (kesirli ölçek pikselleri bulanıklaştırır) — karo yukarı kalkar, altın çerçeve */
.cark-oge.aktif .cark-kare { transform: translateY(-8px); box-shadow: 0 0 0 4px var(--gold), 0 0 0 8px var(--murekkep), inset -6px -6px 0 #dccfb6, inset 6px 6px 0 #fffaf2, 8px 16px 0 6px rgba(0, 0, 0, .35); }
.cark-oge.aktif .cark-ad { color: var(--gold); }
/* logolar düğme: üzerine gelince/odaklanınca aktif gibi kalkar, tıklayınca yanında küçük bilgi penceresi açılır */
button.cark-oge { padding: 0; border: 0; background: none; color: inherit; font: inherit; text-align: center; cursor: pointer; }
button.cark-oge:focus-visible { outline: none; }
.cark-oge.ustunde .cark-kare, .cark-oge:focus-visible .cark-kare, .cark-oge.secili .cark-kare { transform: translateY(-8px); box-shadow: 0 0 0 4px var(--gold), 0 0 0 8px var(--murekkep), inset -6px -6px 0 #dccfb6, inset 6px 6px 0 #fffaf2, 8px 16px 0 6px rgba(0, 0, 0, .35); }
.cark-oge.ustunde .cark-ad, .cark-oge:focus-visible .cark-ad, .cark-oge.secili .cark-ad { color: var(--gold); }
/* çark bilgi penceresi: Apollo dönemi görev kontrol konsolu — krem metal gövde, köşe vidaları, durum lambaları,
   yeşil fosforlu CRT ekran (tarama çizgili), altın halkalı görev arması, amber LED görev saati, konsol düğmesi */
.cark-pencere {
  position: fixed; left: 0; top: 0; z-index: 8500; width: 330px; max-width: calc(100vw - 24px); padding: 12px;   /* WhatsApp düğmesinin (8000) üstünde, üst menünün (9000) altında */
  color: #1d1b17; background: #cfc6ae;
  box-shadow: inset 4px 4px 0 #ece5cf, inset -4px -4px 0 #9b9279, 0 0 0 4px #1d1b17, 12px 12px 0 8px rgba(0, 0, 0, .45);
}
.cark-pencere[hidden] { display: none; }
.cp-vida { position: absolute; width: 4px; height: 4px; background: #6f6857; box-shadow: 1px 1px 0 #ece5cf; }
.cp-vida:nth-child(1) { left: 4px; top: 4px; } .cp-vida:nth-child(2) { right: 4px; top: 4px; }
.cp-vida:nth-child(3) { left: 4px; bottom: 4px; } .cp-vida:nth-child(4) { right: 4px; bottom: 4px; }
.cp-ust {
  display: flex; align-items: center; gap: 8px; padding: 6px 6px 6px 8px;
  font: 8px/8px var(--f-piksel); letter-spacing: 1px; color: #f3e9d8; background: #2b2a27; box-shadow: inset 0 -2px 0 #11100e;
}
.cp-tip { flex: 1; white-space: nowrap; line-height: 14px; }   /* Ö, İ noktaları kırpılmasın */
.cp-lambalar { display: flex; gap: 4px; }
.cp-lambalar i { width: 8px; height: 8px; background: #3a0d0a; box-shadow: inset 2px 2px 0 rgba(255, 255, 255, .25); }
.cp-lambalar i:nth-child(1) { background: #3dff6e; }
.cp-lambalar i:nth-child(2) { background: #ffb000; animation: cpLamba 1.2s steps(1) infinite; }
.cp-lambalar i:nth-child(3) { background: #e8503c; animation: cpLamba 2.6s steps(1) infinite .6s; }
@keyframes cpLamba { 50% { background: #3a2a10; } }
.cp-kapat {
  width: 24px; height: 24px; padding: 0; border: 0; display: grid; place-items: center; cursor: pointer;
  color: #fff; background: #c0392b; box-shadow: inset 2px 2px 0 #e8503c, inset -2px -2px 0 #7a1d13;
}
.cp-kapat:hover, .cp-kapat:focus-visible { background: #e8503c; outline: none; }
.cp-ekran {
  position: relative; overflow: hidden; margin-top: 8px; padding: 14px 14px 12px; color: #8dff9a; background: #08140c;
  box-shadow: inset 0 0 0 4px #1d1b17, inset 0 0 0 6px #3a3a33, inset 0 0 0 10px #0d1f12;
}
.cp-ekran::after { /* CRT tarama çizgileri */
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: repeating-linear-gradient(180deg, rgba(0, 0, 0, 0) 0 2px, rgba(0, 0, 0, .3) 2px 4px);
}
.cp-ekran::before { /* açılışta yukarıdan aşağı geçen parlak tarama çizgisi */
  content: ''; position: absolute; left: 0; right: 0; top: -4px; height: 4px; z-index: 1; pointer-events: none;
  background: #c8ffd0; opacity: 0;
}
.cp-ekran.tara::before { animation: cpTara .5s steps(10) 1; }
@keyframes cpTara { 0% { top: 0; opacity: .7; } 100% { top: 100%; opacity: .7; } }
.cp-govde { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 14px; align-items: start; }
.cp-logo { width: 72px; height: 72px; display: grid; place-items: center; background: #f0c040; }
.cp-logo-ic {
  width: 56px; height: 56px; display: grid; place-items: center;
  font: 16px var(--f-piksel); color: var(--renk); background: #f6efe2;
}
.cp-logo-ic img { max-width: 76%; max-height: 76%; object-fit: contain; }
.cp-ad { margin: 0 0 8px; font: 600 17px/22px var(--f-govde); color: #c8ffd0; }
.cp-satirlar { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font: 14px/18px var(--f-govde); }
.cp-satirlar b { display: block; font-weight: 600; color: #8dff9a; }
.cp-satirlar span { display: block; font-size: 13px; line-height: 18px; color: #4fd068; }
.cp-not { margin: 10px 0 0; font: 13px/19px var(--f-govde); color: #6fdc80; }
.cp-imlec { display: inline-block; width: 7px; height: 13px; margin-left: 4px; vertical-align: -2px; background: #8dff9a; animation: imlecYanip 1s steps(1) infinite; }
.cp-alt { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 10px; }
.cp-sayac {
  padding: 7px 8px 6px; font: 8px/8px var(--f-piksel); letter-spacing: 2px; color: #ffb000; background: #1d1206;
  box-shadow: inset 0 0 0 2px #3a2a10;
}
.cp-git {
  display: flex; align-items: center; gap: 8px; padding: 8px 10px; text-decoration: none;
  font: 8px/8px var(--f-piksel); letter-spacing: 1px; color: #fff; background: #e8503c;
  box-shadow: inset 2px 2px 0 #ff8a70, inset -3px -3px 0 #a3301f, 0 0 0 3px #1d1b17;
}
.cp-git svg { display: block; width: 8px; height: 14px; }
.cp-git:hover, .cp-git:focus-visible { background: #ff6a4c; color: #fff; outline: none; text-decoration: none !important; }
.cp-git:active { box-shadow: inset 3px 3px 0 #a3301f, 0 0 0 3px #1d1b17; }
@media (prefers-reduced-motion: reduce) { .cp-lambalar i, .cp-imlec, .cp-ekran.tara::before { animation: none; } }
/* uzay: alacakaranlık bantlarının üstünde yıldızlar (bir kısmı göz kırpar), piksel gezegen ve ay, arkadan uçan roket */
.cark-uzay { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.cark-uzay i { position: absolute; display: block; }
.cark-uzay i.kirp { animation: yildizKirp 2.6s steps(1) infinite; }
@keyframes yildizKirp { 0%, 68% { opacity: 1; } 69%, 84% { opacity: .2; } 85%, 100% { opacity: 1; } }
.cark-gezegen { position: absolute; right: 6%; top: 15%; opacity: .92; }
.cark-ay { position: absolute; left: 8%; top: 24%; opacity: .85; }
.cark-gezegen svg, .cark-ay svg { display: block; }
.cark-roket { position: absolute; left: 0; top: 0; z-index: 1; pointer-events: none; visibility: hidden; will-change: transform; }
.cark-roket svg { display: block; }
.cark-roket-alev { position: relative; display: block; height: 9px; }
.cark-roket-alev svg { position: absolute; left: 0; top: 0; }
.cark-roket-alev svg:last-child { animation: alevKirp .18s steps(1) infinite; }
@keyframes alevKirp { 50% { visibility: hidden; } }
.cark-kayan, .cark-uydu { position: absolute; left: 0; top: 0; z-index: 0; pointer-events: none; will-change: transform; }
.cark-kayan svg, .cark-uydu svg { display: block; }
.cark-uydu i { position: absolute; right: 9px; top: 9px; width: 3px; height: 3px; background: #ff4b3e; animation: imlecYanip 1.4s steps(1) infinite; }
.cark-duman { position: absolute; left: 0; top: 0; z-index: 1; width: 8px; height: 8px; background: #ece6f4; box-shadow: 2px 2px 0 #8d84a8; pointer-events: none; }
@media (max-width: 700px) {
  .cark-gezegen { top: 9%; right: 4%; }
  .cark-ay { top: 12%; left: 5%; }
}

/* ---------- projeler: kartuşlar (Projeler sayfasındaki kartuşun aynısı; tıklayınca o kartuş konsolda açılır) ---------- */
.ana-projeler { background: var(--gece-2); }
.ap-izgara { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 44px 24px; }
@media (max-width: 1040px) { .ap-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ap-yer { display: flex; flex-direction: column; align-items: center; gap: 16px; min-width: 0; color: var(--text); }
.ap-yer:focus-visible { outline: none; }
/* mürekkep çerçeve + gölge kabın drop-shadow'undan gelir → kartuşun basamaklı köşeleri bozulmaz */
.ap-kartus-kap { display: block; width: 100%; max-width: 272px; filter: drop-shadow(4px 0 0 var(--murekkep)) drop-shadow(-4px 0 0 var(--murekkep)) drop-shadow(0 4px 0 var(--murekkep)) drop-shadow(0 -4px 0 var(--murekkep)) drop-shadow(8px 8px 0 rgba(0, 0, 0, .35)); }
.ap-yer:focus-visible .ap-kartus-kap { filter: drop-shadow(4px 0 0 var(--gold)) drop-shadow(-4px 0 0 var(--gold)) drop-shadow(0 4px 0 var(--gold)) drop-shadow(0 -4px 0 var(--gold)) drop-shadow(8px 8px 0 rgba(0, 0, 0, .35)); }
.ap-yer .kartus { position: relative; display: flex; flex-direction: column; width: 100%; height: 220px; padding: 0; border: 0; cursor: pointer; text-align: left; font-family: var(--f-piksel); color: #111; background: #b9bcc6; clip-path: polygon(0 4px, 4px 4px, 4px 0, calc(100% - 18px) 0, calc(100% - 18px) 6px, calc(100% - 12px) 6px, calc(100% - 12px) 12px, calc(100% - 6px) 12px, calc(100% - 6px) 18px, 100% 18px, 100% calc(100% - 4px), calc(100% - 4px) calc(100% - 4px), calc(100% - 4px) 100%, 4px 100%, 4px calc(100% - 4px), 0px calc(100% - 4px)); box-shadow: inset -5px -5px 0 #8d909b, inset 5px 5px 0 #e4e7ee; transition: transform .15s steps(3); }
.ap-yer .kartus-sirt { flex: 0 0 26px; margin: 12px 14px 0; background: repeating-linear-gradient(90deg, #a3a6b0 0 6px, #cdd0d8 6px 12px); box-shadow: inset 0 0 0 2px #8d909b; }
.ap-yer .kartus-etiket { position: relative; flex: 1; min-height: 0; overflow: hidden; display: flex; flex-direction: column; margin: 10px 14px 8px; padding: 0; background: #f3e9d8; box-shadow: 0 0 0 3px var(--murekkep), 0 0 0 6px var(--renk); }
.ap-yer .ke-ust { flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 6px; padding: 4px 6px; background: var(--murekkep); }
.ap-yer .ke-marka { font-size: 8px; line-height: 1; color: var(--gold); letter-spacing: 0; }
.ap-yer .ke-renk { width: 8px; height: 8px; background: var(--renk); box-shadow: 0 0 0 2px #f3e9d8; }
.ap-yer .ke-sahne { position: relative; flex: 1; min-height: 56px; display: grid; place-items: center; image-rendering: pixelated; box-shadow: inset 0 -3px 0 var(--murekkep); }
.ap-yer .ke-logo { display: grid; place-items: center; width: 52px; height: 52px; background: #f6efe2; box-shadow: 0 0 0 3px var(--murekkep), inset -3px -3px 0 #dccfb6, 4px 4px 0 3px rgba(0, 0, 0, .35); }
.ap-yer .ke-logo img { display: block; max-width: 44px; max-height: 44px; object-fit: contain; }
.ap-yer .ke-ad { flex: 0 0 auto; padding: 6px 6px 2px; font-size: 8px; line-height: 1.5; color: var(--murekkep); }
.ap-yer .ke-alt { flex: 0 0 auto; padding: 0 6px 6px; font-size: 8px; line-height: 1.5; color: #6b5a48; }
.ap-yer .kartus-dis { flex: 0 0 12px; display: flex; justify-content: space-around; margin: 0 24px 10px; }
.ap-yer .kartus-dis i { width: 8px; background: #d4b04a; box-shadow: inset 0 0 0 2px #8a6d1d; }
.ap-yer .tema-kutuphane .ke-sahne { background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='16'%20shape-rendering='crispEdges'%3E%3Crect%20width='24'%20height='16'%20fill='%233b2414'/%3E%3Crect%20x='0'%20y='2'%20width='3'%20height='12'%20fill='%23c0392b'/%3E%3Crect%20x='0'%20y='4'%20width='3'%20height='1'%20fill='rgba%28255,255,255,.4%29'/%3E%3Crect%20x='0'%20y='2'%20width='1'%20height='12'%20fill='rgba%280,0,0,.25%29'/%3E%3Crect%20x='3'%20y='4'%20width='2'%20height='10'%20fill='%232f6fe0'/%3E%3Crect%20x='3'%20y='6'%20width='2'%20height='1'%20fill='rgba%28255,255,255,.4%29'/%3E%3Crect%20x='3'%20y='4'%20width='1'%20height='10'%20fill='rgba%280,0,0,.25%29'/%3E%3Crect%20x='5'%20y='1'%20width='3'%20height='13'%20fill='%231f8f4e'/%3E%3Crect%20x='5'%20y='3'%20width='3'%20height='1'%20fill='rgba%28255,255,255,.4%29'/%3E%3Crect%20x='5'%20y='1'%20width='1'%20height='13'%20fill='rgba%280,0,0,.25%29'/%3E%3Crect%20x='8'%20y='5'%20width='2'%20height='9'%20fill='%23f0c040'/%3E%3Crect%20x='8'%20y='7'%20width='2'%20height='1'%20fill='rgba%28255,255,255,.4%29'/%3E%3Crect%20x='8'%20y='5'%20width='1'%20height='9'%20fill='rgba%280,0,0,.25%29'/%3E%3Crect%20x='10'%20y='2'%20width='3'%20height='12'%20fill='%237b3fbf'/%3E%3Crect%20x='10'%20y='4'%20width='3'%20height='1'%20fill='rgba%28255,255,255,.4%29'/%3E%3Crect%20x='10'%20y='2'%20width='1'%20height='12'%20fill='rgba%280,0,0,.25%29'/%3E%3Crect%20x='13'%20y='3'%20width='2'%20height='11'%20fill='%230f7f86'/%3E%3Crect%20x='13'%20y='5'%20width='2'%20height='1'%20fill='rgba%28255,255,255,.4%29'/%3E%3Crect%20x='13'%20y='3'%20width='1'%20height='11'%20fill='rgba%280,0,0,.25%29'/%3E%3Crect%20x='15'%20y='1'%20width='3'%20height='13'%20fill='%23e8985a'/%3E%3Crect%20x='15'%20y='3'%20width='3'%20height='1'%20fill='rgba%28255,255,255,.4%29'/%3E%3Crect%20x='15'%20y='1'%20width='1'%20height='13'%20fill='rgba%280,0,0,.25%29'/%3E%3Crect%20x='18'%20y='4'%20width='2'%20height='10'%20fill='%23c2185b'/%3E%3Crect%20x='18'%20y='6'%20width='2'%20height='1'%20fill='rgba%28255,255,255,.4%29'/%3E%3Crect%20x='18'%20y='4'%20width='1'%20height='10'%20fill='rgba%280,0,0,.25%29'/%3E%3Crect%20x='20'%20y='2'%20width='3'%20height='12'%20fill='%232f6fe0'/%3E%3Crect%20x='20'%20y='4'%20width='3'%20height='1'%20fill='rgba%28255,255,255,.4%29'/%3E%3Crect%20x='20'%20y='2'%20width='1'%20height='12'%20fill='rgba%280,0,0,.25%29'/%3E%3Crect%20x='23'%20y='6'%20width='1'%20height='8'%20fill='%23f3e9d8'/%3E%3Crect%20x='23'%20y='8'%20width='1'%20height='1'%20fill='rgba%28255,255,255,.4%29'/%3E%3Crect%20x='23'%20y='6'%20width='1'%20height='8'%20fill='rgba%280,0,0,.25%29'/%3E%3Crect%20x='0'%20y='14'%20width='24'%20height='2'%20fill='%237a4a2a'/%3E%3Crect%20x='0'%20y='14'%20width='24'%20height='1'%20fill='%23a06a3a'/%3E%3C/svg%3E") 0 100% / 48px 32px repeat, #3b2414; }
.ap-yer .tema-dukkan .ke-sahne { background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='8'%20height='10'%20shape-rendering='crispEdges'%3E%3Crect%20x='0'%20y='0'%20width='4'%20height='8'%20fill='%23d64541'/%3E%3Crect%20x='4'%20y='0'%20width='4'%20height='8'%20fill='%23f6efe2'/%3E%3Crect%20x='1'%20y='8'%20width='2'%20height='1'%20fill='%23d64541'/%3E%3Crect%20x='5'%20y='8'%20width='2'%20height='1'%20fill='%23f6efe2'/%3E%3Crect%20x='0'%20y='8'%20width='1'%20height='1'%20fill='%23d64541'/%3E%3Crect%20x='4'%20y='8'%20width='1'%20height='1'%20fill='%23f6efe2'/%3E%3Crect%20x='0'%20y='0'%20width='8'%20height='1'%20fill='%239c2a2a'/%3E%3C/svg%3E") 0 0 / 16px 20px repeat-x, url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='16'%20height='8'%20shape-rendering='crispEdges'%3E%3Crect%20width='16'%20height='8'%20fill='%23f0d9a8'/%3E%3Crect%20x='0'%20y='3'%20width='16'%20height='1'%20fill='%23d8bd86'/%3E%3Crect%20x='0'%20y='7'%20width='16'%20height='1'%20fill='%23d8bd86'/%3E%3Crect%20x='0'%20y='0'%20width='1'%20height='3'%20fill='%23d8bd86'/%3E%3Crect%20x='8'%20y='4'%20width='1'%20height='3'%20fill='%23d8bd86'/%3E%3C/svg%3E") 0 0 / 32px 16px repeat, #f0d9a8; }
.ap-yer .tema-oyun .ke-sahne { background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='16'%20height='16'%20shape-rendering='crispEdges'%3E%3Crect%20width='16'%20height='16'%20fill='%2316213d'/%3E%3Crect%20x='2'%20y='3'%20width='1'%20height='1'%20fill='%23f3e9d8'/%3E%3Crect%20x='11'%20y='1'%20width='1'%20height='1'%20fill='%23f0c040'/%3E%3Crect%20x='7'%20y='10'%20width='1'%20height='1'%20fill='%23f3e9d8'/%3E%3Crect%20x='13'%20y='12'%20width='1'%20height='1'%20fill='%238fd3ff'/%3E%3Crect%20x='4'%20y='13'%20width='1'%20height='1'%20fill='%23f0c040'/%3E%3Crect%20x='9'%20y='4'%20width='3'%20height='1'%20fill='%23ffffff'/%3E%3Crect%20x='10'%20y='3'%20width='1'%20height='3'%20fill='%23ffffff'/%3E%3C/svg%3E") 0 0 / 32px 32px repeat, #16213d; }
.ap-yer .tema-sanat .ke-sahne { background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20shape-rendering='crispEdges'%3E%3Crect%20width='24'%20height='24'%20fill='%23f6efe2'/%3E%3Crect%20x='3'%20y='4'%20width='3'%20height='3'%20fill='%23d64541'/%3E%3Crect%20x='6'%20y='5'%20width='1'%20height='1'%20fill='%23d64541'/%3E%3Crect%20x='2'%20y='7'%20width='1'%20height='1'%20fill='%23d64541'/%3E%3Crect%20x='14'%20y='2'%20width='2'%20height='2'%20fill='%232f6fe0'/%3E%3Crect%20x='16'%20y='3'%20width='1'%20height='1'%20fill='%232f6fe0'/%3E%3Crect%20x='8'%20y='14'%20width='3'%20height='2'%20fill='%23f0c040'/%3E%3Crect%20x='10'%20y='16'%20width='1'%20height='1'%20fill='%23f0c040'/%3E%3Crect%20x='18'%20y='16'%20width='3'%20height='3'%20fill='%231f8f4e'/%3E%3Crect%20x='17'%20y='19'%20width='1'%20height='1'%20fill='%231f8f4e'/%3E%3Crect%20x='2'%20y='19'%20width='2'%20height='2'%20fill='%237b3fbf'/%3E%3Crect%20x='20'%20y='8'%20width='2'%20height='2'%20fill='%23e8985a'/%3E%3Crect%20x='22'%20y='10'%20width='1'%20height='1'%20fill='%23e8985a'/%3E%3C/svg%3E") 0 0 / 48px 48px repeat, #f6efe2; }
.ap-yer .tema-espor .ke-sahne { background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='20'%20height='16'%20shape-rendering='crispEdges'%3E%3Crect%20width='20'%20height='16'%20fill='%231b1530'/%3E%3Crect%20x='2'%20y='1'%20width='1'%20height='1'%20fill='%231f9d6b'/%3E%3Crect%20x='3'%20y='2'%20width='1'%20height='1'%20fill='%231f9d6b'/%3E%3Crect%20x='4'%20y='3'%20width='1'%20height='1'%20fill='%231f9d6b'/%3E%3Crect%20x='3'%20y='4'%20width='1'%20height='1'%20fill='%231f9d6b'/%3E%3Crect%20x='2'%20y='5'%20width='1'%20height='1'%20fill='%231f9d6b'/%3E%3Crect%20x='5'%20y='1'%20width='1'%20height='1'%20fill='%231f9d6b'/%3E%3Crect%20x='6'%20y='2'%20width='1'%20height='1'%20fill='%231f9d6b'/%3E%3Crect%20x='7'%20y='3'%20width='1'%20height='1'%20fill='%231f9d6b'/%3E%3Crect%20x='6'%20y='4'%20width='1'%20height='1'%20fill='%231f9d6b'/%3E%3Crect%20x='5'%20y='5'%20width='1'%20height='1'%20fill='%231f9d6b'/%3E%3Crect%20x='12'%20y='9'%20width='1'%20height='1'%20fill='%23d64541'/%3E%3Crect%20x='13'%20y='10'%20width='1'%20height='1'%20fill='%23d64541'/%3E%3Crect%20x='14'%20y='11'%20width='1'%20height='1'%20fill='%23d64541'/%3E%3Crect%20x='13'%20y='12'%20width='1'%20height='1'%20fill='%23d64541'/%3E%3Crect%20x='12'%20y='13'%20width='1'%20height='1'%20fill='%23d64541'/%3E%3Crect%20x='15'%20y='9'%20width='1'%20height='1'%20fill='%23d64541'/%3E%3Crect%20x='16'%20y='10'%20width='1'%20height='1'%20fill='%23d64541'/%3E%3Crect%20x='17'%20y='11'%20width='1'%20height='1'%20fill='%23d64541'/%3E%3Crect%20x='16'%20y='12'%20width='1'%20height='1'%20fill='%23d64541'/%3E%3Crect%20x='15'%20y='13'%20width='1'%20height='1'%20fill='%23d64541'/%3E%3Crect%20x='15'%20y='2'%20width='1'%20height='1'%20fill='%233a2f5c'/%3E%3Crect%20x='6'%20y='11'%20width='1'%20height='1'%20fill='%233a2f5c'/%3E%3Crect%20x='0'%20y='15'%20width='20'%20height='1'%20fill='%232a2148'/%3E%3C/svg%3E") 0 0 / 40px 32px repeat, #1b1530; }
.ap-yer:hover .kartus, .ap-yer:focus-visible .kartus { transform: translateY(-10px); }
.ap-yer .kartus, .ap-yer img { -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; }
.ap-yer:hover .ke-logo { animation: ikonZipla .5s steps(4) 1; }
.ap-not { max-width: 272px; font-family: var(--f-govde); font-size: 15px; line-height: 1.4; text-align: center; color: var(--soluk); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.ap-git { font-size: 8px; line-height: 1.5; text-align: center; color: var(--gold); }
.ap-yer:hover .ap-git, .ap-yer:focus-visible .ap-git { color: var(--krem); }

/* ---------- portföy ---------- */
.ana-portfoy { background: var(--gece); }
.apf-izgara { display: grid; grid-template-columns: 1.35fr 1fr 1fr; gap: 26px; }
.apf-kart {
  position: relative; display: block; overflow: hidden; aspect-ratio: 16 / 10;
  box-shadow: 0 0 0 4px var(--murekkep), 0 0 0 8px var(--wood), 0 0 0 12px var(--murekkep), 10px 10px 0 12px rgba(0, 0, 0, .3);
  margin: 12px;
}
.apf-kart img { width: 100%; height: 100%; object-fit: cover; display: block; image-rendering: pixelated; }
/* üzerine gelince yakınlaştırma yok (kesirli ölçek piksel kapağı bulanıklaştırır): ahşap çerçeve altına döner */
.apf-kart:hover, .apf-kart:focus-visible { box-shadow: 0 0 0 4px var(--murekkep), 0 0 0 8px var(--gold), 0 0 0 12px var(--murekkep), 10px 10px 0 12px rgba(0, 0, 0, .3); }
.apf-etiket { position: absolute; left: 12px; bottom: 12px; padding: 7px 9px 6px; font-size: 8px; color: var(--gold); background: var(--murekkep); box-shadow: 3px 3px 0 rgba(0, 0, 0, .4); }
.apf-sayi { position: absolute; right: 12px; top: 12px; padding: 5px 7px; font-size: 6px; color: var(--murekkep); background: var(--krem); }

/* ---------- deneyim pisti ---------- */
.ana-deneyim { background: linear-gradient(180deg, var(--gece-2), #1d1838); }
.ad-pist { position: relative; height: 200px; margin-bottom: 36px; }
.ad-pist-serit {
  position: absolute; left: 0; right: 0; bottom: 34px; height: 30px;
  background: #3a3f4b; box-shadow: 0 0 0 3px var(--murekkep), inset 0 4px 0 #4d5363;
}
.ad-pist-serit::after { content: ''; position: absolute; left: 0; right: 0; top: 13px; height: 4px; background: repeating-linear-gradient(90deg, #f3e9d8 0 26px, transparent 26px 48px); }
.ad-yillar { position: absolute; left: 0; right: 0; bottom: 0; height: 24px; }
.ad-yillar span { position: absolute; bottom: 0; transform: translateX(-50%); font-size: 8px; color: var(--soluk); }
.ad-yillar span::before { content: ''; position: absolute; left: 50%; bottom: 22px; width: 4px; height: 12px; margin-left: -2px; background: var(--gold); }
/* yerdeyken ana teker pistin üst yüzeyinde (görselin alt %33'ü saydam); dönüş ana teker etrafında */
.ad-ucak { position: absolute; left: -20px; bottom: 0; width: 136px; image-rendering: pixelated; will-change: transform; transform-origin: 71% 67%; z-index: 2; }   /* 96 px uçak + her yanda 20 px döndürme payı, tam 1× */
.ad-golge { position: absolute; left: 0; bottom: 56px; width: 104px; height: 6px; background: rgba(0, 0, 0, .5); pointer-events: none; will-change: transform, opacity; z-index: 1; }
.ad-duman { position: absolute; bottom: 58px; width: 8px; height: 8px; background: #ece6f4; box-shadow: 2px 2px 0 #8d84a8; pointer-events: none; z-index: 3; }
.ad-liste { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.ad-oge a {
  display: flex; flex-direction: column; gap: 8px; height: 100%;
  padding: 20px 18px; color: var(--text); text-decoration: none;
  background: var(--gece-3);
  box-shadow: 0 0 0 4px var(--murekkep), 7px 7px 0 4px rgba(0, 0, 0, .3);
  transition: transform .15s steps(3);
}
.ad-oge a:hover, .ad-oge a:focus-visible { transform: translateY(-5px); outline: none; }
.ad-tarih { font-size: 7px; color: var(--turuncu); }
.ad-kurum { font-size: 10px; line-height: 1.5; color: var(--krem); }
.ad-rol { font-family: var(--f-govde); font-size: 16px; color: var(--soluk); }

/* ---------- başarım rafı (anasayfa): duvar stilleri css/duvar.css'te ---------- */
.ana-sertifika { background: var(--gece); }

/* ---------- iletişim ---------- */
.ai-izgara { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .9fr); gap: clamp(30px, 6vw, 80px); align-items: start; }
.ai-sol .dev-baslik { margin: 18px 0 18px; }
.ai-vurgu { color: var(--kirmizi); }
.ai-sol .okuma { color: #4a4139; max-width: 520px; }
.ai-kanallar { list-style: none; margin: 30px 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.ai-kanal a {
  display: flex; align-items: center; gap: 12px; height: 100%;
  padding: 14px; color: var(--murekkep); text-decoration: none; background: #fffaf0;
  box-shadow: 0 0 0 3px var(--murekkep), 5px 5px 0 3px var(--wood);
  transition: transform .12s steps(2), box-shadow .12s steps(2);
}
.ai-kanal a:hover, .ai-kanal a:focus-visible { transform: translate(-2px, -2px); box-shadow: 0 0 0 3px var(--murekkep), 8px 8px 0 3px var(--wood); outline: none; }
.ai-kanal-ikon { flex: 0 0 34px; display: grid; place-items: center; }
.ai-kanal-ikon .nes-icon { margin: 0 !important; transform: scale(2); transform-origin: center; } /* tam 2× → 32 px, piksel ikonlarla aynı */
.ai-kanal b { display: block; font-size: 8px; font-weight: normal; margin-bottom: 4px; }
.ai-kanal span span { display: block; font-family: var(--f-govde); font-size: 14px; color: #5a5047; overflow-wrap: anywhere; }
/* form bir defter yaprağı: krem kâğıt, 32 px'lik mavi satırlar, kırmızı marj; yazılar mürekkep renginde satırın üstünde.
   Gönderince bu yaprak (yazılarla) tuvale birebir kopyalanır ve katlanıp uçar — js/anasayfa.js kagitDoku() */
.ai-form { display: flex; flex-direction: column; align-items: flex-start; gap: 26px; }
/* gölge dış kapta: maske (yırtık kenar) gölgeyi kesmesin, gölge deliklerin içine de düşsün */
.ai-kagit-kap { align-self: stretch; filter: drop-shadow(8px 8px 0 rgba(0, 0, 0, .22)); }
.ai-kagit {
  --cizgi-bas: 16px; --marj: 44px;
  position: relative; display: flex; flex-direction: column;
  padding: 16px 24px 32px calc(var(--marj) + 16px); color: #121a40;
  background:
    url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='16'%20height='32'%20shape-rendering='crispEdges'%20fill='%23c9b387'%3E%3Crect%20x='4'%20y='0'%20width='2'%20height='2'/%3E%3Crect%20x='2'%20y='2'%20width='2'%20height='2'/%3E%3Crect%20x='2'%20y='4'%20width='2'%20height='2'/%3E%3Crect%20x='4'%20y='6'%20width='2'%20height='2'/%3E%3Crect%20x='6'%20y='8'%20width='2'%20height='2'/%3E%3Crect%20x='8'%20y='10'%20width='2'%20height='2'/%3E%3Crect%20x='6'%20y='12'%20width='2'%20height='2'/%3E%3Crect%20x='4'%20y='14'%20width='2'%20height='2'/%3E%3Crect%20x='2'%20y='16'%20width='2'%20height='2'/%3E%3Crect%20x='6'%20y='16'%20width='2'%20height='2'/%3E%3Crect%20x='8'%20y='16'%20width='2'%20height='2'/%3E%3Crect%20x='2'%20y='18'%20width='2'%20height='2'/%3E%3Crect%20x='4'%20y='18'%20width='2'%20height='2'/%3E%3Crect%20x='10'%20y='18'%20width='2'%20height='2'/%3E%3Crect%20x='2'%20y='20'%20width='2'%20height='2'/%3E%3Crect%20x='12'%20y='20'%20width='2'%20height='2'/%3E%3Crect%20x='2'%20y='22'%20width='2'%20height='2'/%3E%3Crect%20x='12'%20y='22'%20width='2'%20height='2'/%3E%3Crect%20x='2'%20y='24'%20width='2'%20height='2'/%3E%3Crect%20x='4'%20y='24'%20width='2'%20height='2'/%3E%3Crect%20x='10'%20y='24'%20width='2'%20height='2'/%3E%3Crect%20x='2'%20y='26'%20width='2'%20height='2'/%3E%3Crect%20x='6'%20y='26'%20width='2'%20height='2'/%3E%3Crect%20x='8'%20y='26'%20width='2'%20height='2'/%3E%3Crect%20x='4'%20y='28'%20width='2'%20height='2'/%3E%3Crect%20x='2'%20y='30'%20width='2'%20height='2'/%3E%3C/svg%3E") 0 0 / 16px 32px repeat-y,
    linear-gradient(90deg, transparent var(--marj), #eaa59c var(--marj), #eaa59c calc(var(--marj) + 2px), transparent calc(var(--marj) + 2px)),
    repeating-linear-gradient(180deg, transparent 0 30px, #cfdcec 30px 32px) 0 var(--cizgi-bas) / 100% 32px,
    #fdf8ee;
  box-shadow: inset 0 2px 0 #d8c9a8, inset -2px 0 0 #d8c9a8, inset 0 -2px 0 #d8c9a8;
  /* spiralli defterden koparılmış sol kenar: her satırda bir delik, aralarında yırtık dişler (16×32 px karo, 2 px hücre) */
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='16'%20height='32'%20shape-rendering='crispEdges'%3E%3Crect%20x='4'%20y='0'%20width='12'%20height='2'/%3E%3Crect%20x='2'%20y='2'%20width='14'%20height='2'/%3E%3Crect%20x='2'%20y='4'%20width='14'%20height='2'/%3E%3Crect%20x='4'%20y='6'%20width='12'%20height='2'/%3E%3Crect%20x='6'%20y='8'%20width='10'%20height='2'/%3E%3Crect%20x='8'%20y='10'%20width='8'%20height='2'/%3E%3Crect%20x='6'%20y='12'%20width='10'%20height='2'/%3E%3Crect%20x='4'%20y='14'%20width='12'%20height='2'/%3E%3Crect%20x='2'%20y='16'%20width='14'%20height='2'/%3E%3Crect%20x='2'%20y='18'%20width='4'%20height='2'/%3E%3Crect%20x='10'%20y='18'%20width='6'%20height='2'/%3E%3Crect%20x='2'%20y='20'%20width='2'%20height='2'/%3E%3Crect%20x='12'%20y='20'%20width='4'%20height='2'/%3E%3Crect%20x='2'%20y='22'%20width='2'%20height='2'/%3E%3Crect%20x='12'%20y='22'%20width='4'%20height='2'/%3E%3Crect%20x='2'%20y='24'%20width='4'%20height='2'/%3E%3Crect%20x='10'%20y='24'%20width='6'%20height='2'/%3E%3Crect%20x='2'%20y='26'%20width='14'%20height='2'/%3E%3Crect%20x='4'%20y='28'%20width='12'%20height='2'/%3E%3Crect%20x='2'%20y='30'%20width='14'%20height='2'/%3E%3C/svg%3E") 0 0 / 16px 32px repeat-y, linear-gradient(#000, #000) 16px 0 / calc(100% - 16px) 100% no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='16'%20height='32'%20shape-rendering='crispEdges'%3E%3Crect%20x='4'%20y='0'%20width='12'%20height='2'/%3E%3Crect%20x='2'%20y='2'%20width='14'%20height='2'/%3E%3Crect%20x='2'%20y='4'%20width='14'%20height='2'/%3E%3Crect%20x='4'%20y='6'%20width='12'%20height='2'/%3E%3Crect%20x='6'%20y='8'%20width='10'%20height='2'/%3E%3Crect%20x='8'%20y='10'%20width='8'%20height='2'/%3E%3Crect%20x='6'%20y='12'%20width='10'%20height='2'/%3E%3Crect%20x='4'%20y='14'%20width='12'%20height='2'/%3E%3Crect%20x='2'%20y='16'%20width='14'%20height='2'/%3E%3Crect%20x='2'%20y='18'%20width='4'%20height='2'/%3E%3Crect%20x='10'%20y='18'%20width='6'%20height='2'/%3E%3Crect%20x='2'%20y='20'%20width='2'%20height='2'/%3E%3Crect%20x='12'%20y='20'%20width='4'%20height='2'/%3E%3Crect%20x='2'%20y='22'%20width='2'%20height='2'/%3E%3Crect%20x='12'%20y='22'%20width='4'%20height='2'/%3E%3Crect%20x='2'%20y='24'%20width='4'%20height='2'/%3E%3Crect%20x='10'%20y='24'%20width='6'%20height='2'/%3E%3Crect%20x='2'%20y='26'%20width='14'%20height='2'/%3E%3Crect%20x='4'%20y='28'%20width='12'%20height='2'/%3E%3Crect%20x='2'%20y='30'%20width='14'%20height='2'/%3E%3C/svg%3E") 0 0 / 16px 32px repeat-y, linear-gradient(#000, #000) 16px 0 / calc(100% - 16px) 100% no-repeat;
}
.ai-form-bas { display: flex; align-items: flex-end; gap: 10px; height: 32px; padding-bottom: 8px; font-size: 8px; line-height: 8px; color: #9c2418; }
.ai-form-zarf svg { display: block; }
.ai-kime { height: 32px; margin: 0; font-family: var(--f-govde); font-size: 15px; line-height: 32px; color: #4a3c2a; letter-spacing: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ai-kime b { font-weight: 600; color: #121a40; }
.ai-form label { display: flex; flex-direction: column; margin: 0; }
.ai-form label > span { display: flex; align-items: flex-end; height: 32px; padding-bottom: 8px; font-size: 8px; line-height: 8px; color: #4f3f28; }
.ai-form input, .ai-form textarea {
  display: block; width: 100%; height: 32px; padding: 0 6px; margin: 0;
  font-family: var(--f-govde); font-size: 17px; line-height: 32px; color: #121a40;
  background: transparent; border: 0; border-radius: 0; outline: none; box-shadow: none;
}
.ai-form textarea { height: 128px; resize: none; overflow-y: auto; }
.ai-form input::placeholder, .ai-form textarea::placeholder { color: #85765c; opacity: 1; }
.ai-form input:focus, .ai-form textarea:focus { background: rgba(240, 192, 64, .16); }
.ai-form .hata { background: rgba(214, 69, 65, .12); box-shadow: inset 0 -3px 0 var(--kirmizi); animation: hataSalla .3s steps(3); }
.ai-form.gonderiliyor .ai-kagit { visibility: hidden; }
.ai-form.gonderiliyor .pdug { opacity: .55; pointer-events: none; }
@media (max-width: 600px) { .ai-kagit { --marj: 28px; padding-right: 14px; } }
@keyframes hataSalla { 33% { transform: translateX(-5px); } 66% { transform: translateX(5px); } }
.ai-form .pdug { align-self: flex-start; }
.ai-not { font-family: var(--f-govde); font-size: 14px; color: var(--soluk); }

/* =========================================================
   DUYARLI
   ========================================================= */
@media (max-width: 1100px) {
}
@media (max-width: 900px) {
  .hero { height: auto; min-height: 100vh; min-height: 100svh; align-items: flex-start; }
  .hero-ic { grid-template-columns: minmax(0, 1fr); gap: 34px; text-align: center; padding-top: calc(var(--ust-h) + 40px); padding-bottom: 110px; }
  .hero-sol { display: flex; flex-direction: column; align-items: center; }
  .hero-satir.swagger { align-self: center; }
  .hero-golge { background: linear-gradient(180deg, rgba(14, 21, 36, .78) 0, rgba(14, 21, 36, .55) 45%, rgba(14, 21, 36, .25) 100%); }
  .profil { width: 320px; }
  .hakkimda-panel { position: relative; top: auto; right: auto; width: 100%; margin-top: 22px; max-height: none; text-align: left; }
  .hk-izgara, .ai-izgara { grid-template-columns: minmax(0, 1fr); }
  .apf-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .apf-izgara > :first-child { grid-column: 1 / -1; }
  .ad-liste { grid-template-columns: minmax(0, 1fr); }
  .hero-kaydir { bottom: 40px; }
}
@media (max-width: 600px) {
  .hero-etiket { font-size: 7px; letter-spacing: 1px; gap: 8px; }
  .hero-etiket::before { width: 8px; height: 8px; flex-basis: 8px; }
  .wp-yuzen { width: 46px; height: 46px; left: 12px; bottom: 12px; }
  .hero-ad { font-size: clamp(26px, 8.4vw, 40px); }
  .profil { width: min(330px, calc(100vw - 32px)); }
  .hk-sayilar { gap: 18px; }
  .hk-sayi { padding: 18px 14px; }
  .hk-sayi:nth-child(even) { margin-top: 26px; }
  .hk-sayi span { font-size: 15px; }
  .apf-izgara { grid-template-columns: minmax(0, 1fr); }
  .apf-kart { margin: 12px 12px 18px; }
  .ai-kanallar { grid-template-columns: minmax(0, 1fr); }
  .cark-oge { width: 104px; margin: -40px 0 0 -52px; gap: 8px; }
  .cark-kare { width: 64px; height: 64px; font-size: 16px; }
  .cark-ad { font-size: 12px; max-width: 100px; }
  .ad-pist { height: 160px; }
  .ad-ucak { width: 136px; bottom: 10px; }
  .ad-golge { width: 78px; }
}
@media (max-width: 760px) {
  .ap-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px 16px; }
  .ap-yer:last-child:nth-child(odd) { grid-column: 1 / -1; }
}
@media (max-width: 520px) {
  .ap-kartus-kap { max-width: 172px; }
  .ap-yer .kartus { height: 228px; }
  .ap-yer .kartus-sirt { margin: 10px 12px 0; flex-basis: 20px; }
  .ap-yer .kartus-etiket { margin: 10px 10px 8px; }
  .ap-yer .ke-logo { width: 44px; height: 44px; }
  .ap-yer .ke-logo img { max-width: 36px; max-height: 36px; }
  .ap-yer .ke-sahne { min-height: 52px; }
  .ap-not { font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .hb { animation: none; }
  .hk-ifade .k { opacity: 1; }
}