/* =========================================================================
   İç sayfalar: Hakkında, Arsenal, Operatörler, New Beginner, 404
   ========================================================================= */
.p-head { position: relative; padding-top: 56px; padding-bottom: 24px; }
.p-title { margin: 12px 0 0; font-family: var(--f-disp); font-weight: 900; font-size: clamp(60px, 8vw, 128px); line-height: .86; perspective: 800px; }
.p-title > span { display: block; }
.p-title-in { display: block; animation: rd-drop .9s 1.05s var(--ease) both; }
.no-pt .p-title-in { animation-delay: .1s; }

/* =========================== HAKKINDA =========================== */
.ab-hero { position: relative; min-height: 780px; overflow: hidden; }
.ab-flag { position: absolute; left: 50%; top: 40px; width: 1200px; height: 780px; margin-left: -520px; perspective: 1500px; pointer-events: none; }
.ab-flag-in { position: absolute; inset: 0; transform-style: preserve-3d; transform: rotateY(-14deg) rotateX(6deg); }
.ab-pole { position: absolute; left: -16px; top: -30px; width: 12px; height: 900px; background: linear-gradient(90deg, #6e6648, var(--gold), #6e6648); }
.ab-pole::before { content: ''; position: absolute; left: -6px; top: -16px; width: 24px; height: 24px; border-radius: 50%; background: var(--gold); }
.ab-flag canvas { position: absolute; left: 0; top: 0; width: 1200px; height: 780px; }
.ab-shade { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, var(--bg) 0%, rgba(18, 19, 12, .92) 30%, rgba(18, 19, 12, .25) 62%, rgba(18, 19, 12, .55) 100%), linear-gradient(0deg, var(--bg) 0%, rgba(18, 19, 12, 0) 30%); }
.ab-hero-in { position: relative; padding-top: 150px; padding-bottom: 80px; }
.ab-hero .p-title { font-size: clamp(72px, 10vw, 160px); line-height: .84; }
.ab-lead { max-width: 520px; margin: 28px 0 0; font-size: 19px; line-height: 1.6; color: var(--label); }
.ab-stats { display: flex; flex-wrap: wrap; gap: 28px 40px; margin-top: 44px; }
.ab-stats b { display: block; font-family: var(--f-disp); font-weight: 900; font-size: 54px; color: var(--gold); line-height: 1; }
.ab-stats span { font-family: var(--f-mono); font-size: 11px; letter-spacing: 2px; color: var(--sand); }

.story { display: flex; flex-wrap: wrap; gap: 60px; align-items: center; }
.story-txt { flex: 1 1 460px; min-width: 0; }
.story-txt p { margin: 18px 0 0; font-size: 17px; line-height: 1.7; color: var(--muted); max-width: 600px; white-space: pre-line; }
.dossier { position: relative; flex: 0 1 460px; height: 420px; perspective: 1200px; min-width: 0; }
.doss { position: absolute; left: 40px; top: 40px; width: 360px; max-width: calc(100% - 40px); height: 320px; padding: 26px; border: 1px solid var(--gold); transition: transform .5s var(--ease); }
.doss:hover { transform: translate3d(0, -26px, 80px) rotate(0deg) !important; z-index: 3; }
.doss-top { display: flex; justify-content: space-between; font-family: var(--f-mono); font-size: 11px; letter-spacing: 2px; }
.doss h3 { margin: 18px 0 0; font-family: var(--f-disp); font-weight: 900; font-size: 38px; line-height: .95; }
.doss p { margin: 12px 0 0; font-size: 15px; line-height: 1.55; opacity: .85; }
.doss.d1 { background: var(--olive); transform: rotate(-8deg) translate3d(-30px, 26px, -60px); }
.doss.d2 { background: var(--olive-2); transform: rotate(4deg) translate3d(10px, 10px, -30px); }
.doss.d3 { background: var(--gold); color: var(--bg); transform: rotate(-2deg) rotateY(-12deg); }

.tline { position: relative; margin-top: 60px; }
.tline-bar { position: absolute; left: 0; right: 0; top: 11px; height: 2px; background: var(--gold); transform-origin: 0 50%; transform: scaleX(0); transition: transform 1.4s var(--ease); }
.tline.in .tline-bar { transform: scaleX(1); }
.tline-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 28px; }
.tl { position: relative; padding-top: 44px; }
.tl::before { content: ''; position: absolute; left: 0; top: 0; width: 24px; height: 24px; border-radius: 50%; background: var(--bg); border: 3px solid var(--gold); animation: tl-node 2.4s ease-in-out infinite; }
.tl:nth-child(2)::before { animation-delay: .4s; } .tl:nth-child(3)::before { animation-delay: .8s; } .tl:nth-child(4)::before { animation-delay: 1.2s; }
@keyframes tl-node { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.35); } }
.tl b { display: block; font-family: var(--f-disp); font-weight: 900; font-size: 40px; color: var(--gold); line-height: 1; }
.tl h3 { margin: 8px 0 0; font-family: var(--f-disp); font-weight: 800; font-size: 24px; letter-spacing: 1px; }
.tl p { margin: 8px 0 0; font-size: 15px; line-height: 1.55; color: var(--muted); }

.ring-wrap { position: relative; height: 400px; margin-top: 30px; perspective: 1500px; overflow: hidden; }
.ring { position: absolute; left: 50%; top: 90px; width: 0; height: 0; transform-style: preserve-3d; animation: ring-spin 40s linear infinite; }
.ring-wrap:hover .ring { animation-play-state: paused; }
@keyframes ring-spin { from { transform: rotateX(-8deg) rotateY(0); } to { transform: rotateX(-8deg) rotateY(-360deg); } }
.ring-card { position: absolute; left: calc(var(--cw) / -2); top: 0; width: var(--cw); height: calc(var(--cw) * .66); border: 1px solid rgba(217, 192, 138, .45); background: var(--olive-2) center / cover no-repeat; display: flex; flex-direction: column; justify-content: space-between; padding: 12px; overflow: hidden; }
.ring-card span { position: relative; font-family: var(--f-mono); font-size: 10px; letter-spacing: 2px; color: var(--gold); }
.ring-card b { position: relative; font-family: var(--f-disp); font-weight: 800; font-size: 18px; letter-spacing: 1px; }
.ring-card::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(18, 19, 12, .8), rgba(18, 19, 12, 0) 60%); }
.ring-card > * { z-index: 1; }

.gal-chips { display: flex; flex-wrap: wrap; gap: 10px; }
.gal-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); grid-auto-rows: 200px; gap: 16px; margin-top: 26px; }
.tile { position: relative; padding: 0; border: 1px solid rgba(217, 192, 138, .22); background: var(--olive-2) center / cover no-repeat; color: var(--bone); cursor: zoom-in; overflow: hidden; text-align: left; animation: tile-in .7s var(--ease) both; transition: transform .4s var(--ease), border-color .3s; }
.tile:hover { transform: translateY(-8px) rotateX(6deg); border-color: var(--gold); }
.tile.tall { grid-row: span 2; }
.tile::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(18, 19, 12, .85), rgba(18, 19, 12, 0) 55%); }
.tile-n { position: absolute; z-index: 1; left: 14px; top: 14px; font-family: var(--f-mono); font-size: 10px; letter-spacing: 2px; color: var(--sand); }
.tile-cap { position: absolute; z-index: 1; left: 14px; right: 14px; bottom: 14px; display: flex; justify-content: space-between; align-items: flex-end; gap: 10px; }
.tile-cap b { font-family: var(--f-disp); font-weight: 800; font-size: 22px; letter-spacing: 1px; line-height: 1.05; }
.tile-cap i { flex: 0 0 auto; font-style: normal; padding: 3px 8px; background: var(--gold); color: var(--bg); font-family: var(--f-mono); font-size: 10px; }
.tile.has-img .tile-n { display: none; }
@keyframes tile-in { from { transform: perspective(900px) rotateY(80deg) translateZ(-60px); opacity: 0; } to { transform: none; opacity: 1; } }
.ph-flagbg { background-image: url(../img/flag.webp); }

.lb { position: fixed; inset: 0; z-index: 150; display: flex; align-items: center; justify-content: center; padding: 24px; background: rgba(10, 11, 7, .94); }
.lb-box { width: min(980px, 100%); animation: lb-in .55s var(--ease) both; }
@keyframes lb-in { from { transform: perspective(1400px) rotateX(-60deg) scale(.6); opacity: 0; } to { transform: none; opacity: 1; } }
.lb-img { position: relative; aspect-ratio: 16 / 10; background: var(--olive-2) center / contain no-repeat; border: 2px solid var(--gold); display: flex; align-items: center; justify-content: center; font-family: var(--f-mono); font-size: 13px; letter-spacing: 3px; color: var(--gold); }
.lb-meta { display: flex; justify-content: space-between; gap: 12px; margin-top: 14px; }
.lb-meta b { font-family: var(--f-disp); font-weight: 800; font-size: 26px; }
.lb-meta span { font-family: var(--f-mono); font-size: 12px; color: var(--sand); }
.lb-btn { position: absolute; width: 52px; height: 52px; border: 1px solid var(--gold); background: rgba(18, 19, 12, .7); color: var(--gold); font-size: 20px; }
.lb-btn:hover { background: var(--gold); color: var(--bg); }
.lb-close { right: 20px; top: 20px; }
.lb-prev { left: 20px; top: 50%; margin-top: -26px; }
.lb-next { right: 20px; top: 50%; margin-top: -26px; }

/* =========================== ARSENAL =========================== */
.ars-tabs { display: flex; gap: 6px; flex-wrap: wrap; }
.ars-tab { min-height: 52px; padding: 0 24px; border: 1px solid var(--line-2); background: transparent; color: var(--bone); font-family: var(--f-disp); font-weight: 800; font-size: 19px; letter-spacing: 2px; transition: background .2s, color .2s, transform .2s; }
.ars-tab:hover { transform: translateY(-3px); }
.ars-tab[aria-selected='true'] { background: var(--gold); color: var(--bg); border-color: var(--gold); }
.lab { display: flex; gap: 24px; margin-top: 32px; }
.lab-stage { position: relative; flex: 1 1 700px; min-width: 0; height: 680px; background: var(--bg-4); border: 1px solid var(--line); overflow: hidden; perspective: 1600px; cursor: grab; touch-action: none; user-select: none; -webkit-user-select: none; }
.lab-stage.dragging { cursor: grabbing; }
.lab-floor { position: absolute; left: 0; right: 0; bottom: 0; height: 300px; perspective: 500px; perspective-origin: 50% 0; overflow: hidden; }
.lab-floor::after { content: ''; position: absolute; inset: 0; background: linear-gradient(var(--bg-4), rgba(23, 24, 16, 0) 55%); }
.lab-floor .hf-plane { position: absolute; left: -60%; right: -60%; top: 0; height: 800px; transform-origin: 50% 0; transform: rotateX(70deg); overflow: hidden; }
.lab-floor .hf-grid { position: absolute; left: 0; right: 0; top: -60px; bottom: 0; background-image: linear-gradient(rgba(217, 192, 138, .16) 1px, transparent 1px), linear-gradient(90deg, rgba(217, 192, 138, .16) 1px, transparent 1px); background-size: 60px 60px; animation: rd-floor 2s linear infinite; }
.lab-sweep { position: absolute; left: 50%; top: 46%; width: 560px; height: 560px; margin: -280px 0 0 -280px; border-radius: 50%; background: conic-gradient(rgba(217, 192, 138, .14), rgba(217, 192, 138, 0) 20%); animation: rd-spin 5s linear infinite; pointer-events: none; }
.lab-pulse { position: absolute; left: 50%; top: 46%; width: 320px; height: 320px; margin: -160px 0 0 -160px; border-radius: 50%; border: 1px solid rgba(217, 192, 138, .5); animation: rd-pulse 2.8s ease-out infinite; pointer-events: none; }
.lab-shadow { position: absolute; left: 50%; bottom: 110px; width: 380px; height: 40px; margin-left: -190px; border-radius: 50%; background: radial-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, 0) 70%); pointer-events: none; }
.lab-hint { position: absolute; left: 24px; top: 22px; font-family: var(--f-mono); font-size: 11px; letter-spacing: 2px; line-height: 1.8; color: var(--sand); pointer-events: none; }
.model { position: absolute; left: 50%; top: 46%; width: 0; height: 0; transform-style: preserve-3d; }
.model-swap { position: absolute; left: 0; top: 0; width: 0; height: 0; transform-style: preserve-3d; animation: model-swap 1.1s var(--ease) both; }
.model-spin { position: absolute; left: 0; top: 0; width: 0; height: 0; transform-style: preserve-3d; }
.model-spin.auto { animation: model-y 12s linear infinite; }
@keyframes model-y { from { transform: rotateY(0); } to { transform: rotateY(360deg); } }
@keyframes model-swap { 0% { transform: translateY(-300px) rotateY(540deg) scale(.3); } 70% { transform: translateY(12px) rotateY(-10deg) scale(1.04); } 100% { transform: none; } }
.coin { position: absolute; left: -170px; top: -170px; width: 340px; height: 340px; transform-style: preserve-3d; }
.coin-seg { position: absolute; left: 50%; top: 50%; width: 28px; height: 34px; margin: -17px 0 0 -14px; }
.coin-face { position: absolute; inset: 0; border-radius: 50%; overflow: hidden; background: url(../img/logo.webp) center / cover; box-shadow: inset 0 0 0 6px var(--mat, var(--gold)); backface-visibility: hidden; }
.coin-face.front { transform: translateZ(17px); }
.coin-face.back { transform: rotateY(180deg) translateZ(17px); }
.shine { position: absolute; top: 0; bottom: 0; left: 0; width: 70px; background: rgba(255, 248, 225, .22); animation: rd-shine 3.2s ease-in-out infinite; }
.tag3d { position: absolute; left: -170px; top: -100px; width: 340px; height: 200px; transform-style: preserve-3d; }
.tag-side { position: absolute; left: 50%; top: 50%; }
.tag-face { position: absolute; inset: 0; border-radius: 28px; background: var(--mat, #c9bb8a); backface-visibility: hidden; overflow: hidden; }
.tag-face.front { transform: translateZ(8px); padding: 22px 26px 22px 70px; display: flex; flex-direction: column; justify-content: center; gap: 5px; color: var(--bg); }
.tag-face.front::before { content: ''; position: absolute; left: 24px; top: 50%; width: 24px; height: 24px; margin-top: -12px; border-radius: 50%; background: var(--bg); }
.tag-face.back { transform: rotateY(180deg) translateZ(8px); display: flex; align-items: center; justify-content: center; }
.tag-face.back img { width: 150px; height: 150px; border-radius: 50%; }
.tg-unit { font-family: var(--f-mono); font-size: 11px; letter-spacing: 2px; }
.tg-call { font-family: var(--f-disp); font-weight: 900; font-size: 34px; letter-spacing: 1px; line-height: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tg-line { font-family: var(--f-mono); font-size: 14px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lab-side { flex: 0 0 320px; display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.panel { padding: 22px; background: var(--bg-2); border: 1px solid var(--line); }
.panel-k { font-family: var(--f-mono); font-size: 11px; letter-spacing: 3px; color: var(--sand); }
.panel-t { margin-top: 10px; font-family: var(--f-disp); font-weight: 900; font-size: 32px; line-height: 1; color: var(--gold); }
.panel p { margin: 10px 0 0; font-size: 15px; line-height: 1.55; color: var(--muted); }
.mats { display: flex; gap: 8px; margin-top: 12px; }
.mat { flex: 1 1 0; min-height: 52px; border: 2px solid transparent; color: var(--bg); font-family: var(--f-mono); font-size: 10px; letter-spacing: 1px; }
.mat[aria-pressed='true'] { border-color: var(--bone); }
.toggle-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 44px; font-size: 15px; cursor: pointer; }
.toggle-row input { width: 22px; height: 22px; accent-color: var(--gold); }
input[type=range] { width: 100%; accent-color: var(--gold); }
.stack { display: flex; flex-direction: column; gap: 12px; margin-top: 14px; }

/* =========================== OPERATÖRLER =========================== */
.ops-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 40px; }
.ops-head-txt { flex: 1 1 520px; min-width: 0; }
.ops-radar { position: relative; flex: 0 0 320px; height: 320px; perspective: 900px; }
.ops-radar-in { position: absolute; inset: 0; transform: rotateX(55deg) rotateZ(-10deg); transform-style: preserve-3d; }
.ops-radar-in > i { position: absolute; border-radius: 50%; border: 1px solid rgba(217, 192, 138, .3); }
.ops-radar-in > i:nth-child(1) { inset: 0; border-color: rgba(217, 192, 138, .5); background: rgba(67, 71, 49, .35); }
.ops-radar-in > i:nth-child(2) { inset: 60px; } .ops-radar-in > i:nth-child(3) { inset: 120px; }
.ops-radar-in > b { position: absolute; inset: 0; border-radius: 50%; background: conic-gradient(rgba(217, 192, 138, .45), rgba(217, 192, 138, 0) 22%); animation: rd-spin 4s linear infinite; }
.blip { position: absolute; width: 10px; height: 10px; margin: -5px; transform: translateZ(14px); }
.blip::before, .blip::after { content: ''; position: absolute; inset: 0; border-radius: 50%; }
.blip::before { background: var(--gold); }
.blip::after { border: 1px solid var(--gold); animation: blip 2s ease-out infinite; }
@keyframes blip { 0% { transform: scale(.6); opacity: 1; } 100% { transform: scale(2.4); opacity: 0; } }
.ops-chips { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 40px; }
.ops-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 26px; margin-top: 36px; }
.oc-wrap { height: 460px; perspective: 1200px; animation: deal .9s var(--ease) both; }
@keyframes deal { from { transform: perspective(1000px) translate3d(0, -120px, -300px) rotateX(70deg) rotateZ(-8deg); opacity: 0; } to { transform: none; opacity: 1; } }
.oc { position: relative; display: block; width: 100%; height: 100%; padding: 0; border: 0; background: none; color: inherit; text-align: left; transform-style: preserve-3d; transition: transform .8s var(--ease); }
.oc-wrap:hover .oc { transform: translateY(-8px); }
.oc.flipped, .oc-wrap:hover .oc.flipped { transform: rotateY(180deg); }
.oc-face { position: absolute; inset: 0; backface-visibility: hidden; -webkit-backface-visibility: hidden; }
/* Firefox: ön yüzdeki konumlu öğeler (GEN rozeti, tarama çizgisi) arka yüzde ayna gibi görünmesin */
.oc-front, .oc-front * { backface-visibility: hidden; -webkit-backface-visibility: hidden; }
.oc-front { transition: visibility 0s .4s; }
.oc.flipped .oc-front { visibility: hidden; }
.oc-back { visibility: hidden; transition: visibility 0s .4s; }
.oc.flipped .oc-back { visibility: visible; }
.oc-front { display: flex; flex-direction: column; background: var(--bg-2); border: 1px solid rgba(217, 192, 138, .22); }
.oc-ph { position: relative; flex: 1 1 auto; display: flex; align-items: flex-end; justify-content: center; background: var(--olive-2); overflow: hidden; }
.oc-ph img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.oc-ph svg { width: 210px; height: 270px; }
.oc-scan { position: absolute; left: 0; right: 0; top: 0; height: 2px; background: rgba(217, 192, 138, .5); box-shadow: 0 0 12px var(--gold); animation: oc-scan 2.6s linear infinite; }
@keyframes oc-scan { from { transform: translateY(-10px); } to { transform: translateY(360px); } }
.oc-body { display: block; padding: 18px 20px 20px; }
.oc-call { display: block; font-family: var(--f-disp); font-weight: 800; font-size: 30px; line-height: 1; overflow-wrap: anywhere; }
.oc-meta { display: flex; justify-content: space-between; margin-top: 8px; font-family: var(--f-mono); font-size: 12px; letter-spacing: 1px; }
.oc-meta span:first-child { color: var(--gold); }
.oc-meta span:last-child { color: var(--sand); }
.oc-back { display: flex; flex-direction: column; gap: 12px; padding: 22px; background: var(--olive); border: 2px solid var(--gold); transform: rotateY(180deg); overflow: hidden; }
.oc-back-top { display: flex; justify-content: space-between; align-items: center; font-family: var(--f-mono); font-size: 11px; letter-spacing: 3px; }
.oc-back-top img { width: 40px; height: 40px; border-radius: 50%; }
.oc-back .oc-call { color: var(--gold); font-size: 34px; font-weight: 900; }
.oc-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; font-family: var(--f-mono); font-size: 12px; line-height: 1.5; }
.oc-facts .f { display: block; overflow-wrap: anywhere; }
.oc-facts em { display: block; font-style: normal; color: var(--label); }
.oc-bio { font-size: 13px; line-height: 1.45; color: var(--label); }
.oc-stats { display: flex; flex-direction: column; gap: 7px; margin-top: auto; }
.oc-stat { display: block; font-family: var(--f-mono); font-size: 11px; letter-spacing: 1px; }
.oc-st-row { display: flex; justify-content: space-between; }
.oc-bar { display: block; height: 4px; margin-top: 4px; background: rgba(18, 19, 12, .5); }
.oc-bar i { display: block; height: 4px; background: var(--gold); transform-origin: 0 50%; transform: scaleX(0); transition: transform .9s .2s var(--ease); }
.oc.flipped .oc-bar i { transform: scaleX(var(--v)); }
.ops-empty { padding: 40px 0; color: var(--muted); }

/* =========================== NEW BEGINNER =========================== */
.nb-page { position: relative; }
.nb-bg { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.nb-bg .hero-floor { position: absolute; left: 0; right: 0; bottom: 0; height: 480px; perspective: 600px; perspective-origin: 50% 0; overflow: hidden; }
.nb-bg .hero-floor::after { content: ''; position: absolute; inset: 0; background: linear-gradient(var(--bg), rgba(18, 19, 12, 0) 50%); }
.nb-bg .hf-plane { position: absolute; left: -50%; right: -50%; top: 0; height: 1000px; transform-origin: 50% 0; transform: rotateX(72deg); overflow: hidden; }
.nb-bg .hf-grid { position: absolute; left: 0; right: 0; top: -70px; bottom: 0; background-image: linear-gradient(rgba(217, 192, 138, .14) 1px, transparent 1px), linear-gradient(90deg, rgba(217, 192, 138, .14) 1px, transparent 1px); background-size: 70px 70px; animation: rd-floor 1.6s linear infinite; }
.nb-cube { position: absolute; right: -120px; top: 160px; width: 520px; height: 520px; perspective: 1400px; opacity: .22; }
.nb-cube .cube { left: 110px; top: 110px; width: 300px; height: 300px; animation-duration: 24s; }
.nb-cube .cube i { border-width: 2px; border-color: var(--gold); }
.nb-cube .cube i:nth-child(1) { transform: translateZ(150px); } .nb-cube .cube i:nth-child(2) { transform: rotateY(180deg) translateZ(150px); }
.nb-cube .cube i:nth-child(3) { transform: rotateY(90deg) translateZ(150px); } .nb-cube .cube i:nth-child(4) { transform: rotateY(-90deg) translateZ(150px); }
.nb-cube .cube i:nth-child(5) { transform: rotateX(90deg) translateZ(150px); border-color: var(--sand); } .nb-cube .cube i:nth-child(6) { transform: rotateX(-90deg) translateZ(150px); border-color: var(--sand); }
.nb-bg .hero-bbs { position: absolute; inset: 0; }
.nb-bg .hero-bbs i { position: absolute; top: 100%; border-radius: 50%; animation: rd-bb linear infinite; }
.nb-wrap { position: relative; display: flex; flex-wrap: wrap; gap: 48px; padding-top: 50px; padding-bottom: 80px; }
.nb-left { flex: 1 1 340px; min-width: 0; }
.nb-right { flex: 2 1 640px; min-width: 0; display: flex; flex-direction: column; align-items: stretch; }
.nb-left .lead { margin-top: 22px; }
.dogtag-stage { margin-top: 40px; height: 230px; perspective: 1000px; }
.dogtag { position: relative; width: 320px; max-width: 100%; height: 190px; transform-style: preserve-3d; animation: dt-sway 7s ease-in-out infinite; }
.dogtag::before { content: ''; position: absolute; left: 30px; top: -30px; width: 2px; height: 40px; background: repeating-linear-gradient(var(--sand) 0 4px, transparent 4px 7px); }
@keyframes dt-sway { 0%, 100% { transform: rotateY(-24deg) rotateX(8deg); } 50% { transform: rotateY(24deg) rotateX(-6deg); } }
.dt-l { position: absolute; inset: 0; border-radius: 24px; }
.dt-l.l1 { background: #8a8160; transform: translateZ(-6px); }
.dt-l.l2 { background: #b8aa7a; transform: translateZ(-3px); }
.dt-face { position: absolute; inset: 0; border-radius: 24px; background: #c9bb8a; padding: 20px 22px 20px 62px; display: flex; flex-direction: column; justify-content: center; gap: 4px; color: var(--bg); overflow: hidden; }
.dt-face::before { content: ''; position: absolute; left: 22px; top: 50%; width: 20px; height: 20px; margin-top: -10px; border-radius: 50%; background: var(--bg); }
.dt-face .tg-call { font-size: 28px; }
.dt-face .tg-line { font-size: 13px; }
.dt-note { font-family: var(--f-mono); font-size: 11px; letter-spacing: 2px; color: var(--sand); }
.steps { list-style: none; margin: 30px 0 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.steps li { display: flex; align-items: center; gap: 16px; padding: 12px 0; border-bottom: 1px solid rgba(217, 192, 138, .14); }
.st-dia { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border: 1px solid rgba(217, 192, 138, .3); font-family: var(--f-mono); font-size: 13px; transform: rotate(45deg); transition: transform .8s var(--ease), background .4s, color .4s, border-color .4s; }
.st-dia span { transform: rotate(-45deg); }
.st-lbl { font-family: var(--f-disp); font-weight: 800; font-size: 22px; letter-spacing: 2px; color: var(--sand); transition: color .4s; }
.steps li.past .st-dia { background: var(--olive); border-color: var(--gold); transform: rotate(405deg); }
.steps li.past .st-lbl { color: var(--bone); }
.steps li.cur .st-dia { background: var(--gold); color: var(--bg); border-color: var(--gold); transform: rotate(225deg); animation: st-ping 1.6s ease-out infinite; }
.steps li.cur .st-lbl { color: var(--gold); }
@keyframes st-ping { 0%, 100% { box-shadow: 0 0 0 0 rgba(217, 192, 138, .6); } 50% { box-shadow: 0 0 0 10px rgba(217, 192, 138, 0); } }
.secure { display: flex; align-items: center; gap: 10px; margin-top: 26px; font-family: var(--f-mono); font-size: 11px; letter-spacing: 1px; color: var(--sand); }
.prog { display: flex; justify-content: space-between; font-family: var(--f-mono); font-size: 11px; letter-spacing: 2px; color: var(--sand); }
.prog b { color: var(--gold); font-weight: 400; }
.prog-bar { height: 4px; margin-top: 6px; background: var(--olive-2); }
.prog-bar i { display: block; height: 4px; background: var(--gold); box-shadow: 0 0 14px var(--gold); transform-origin: 0 50%; transition: transform .9s var(--ease); }
.faces { position: relative; margin-top: 22px; perspective: 1800px; }
.face { padding: 34px; background: var(--bg-2); border: 1px solid rgba(217, 192, 138, .35); transform-origin: 50% 50% -200px; }
.face.last { background: var(--olive); border: 2px solid var(--gold); }
.face.in-next { animation: face-in-next .55s var(--ease) both; }
.face.in-prev { animation: face-in-prev .55s var(--ease) both; }
.face.out-next { animation: face-out-next .35s ease-in both; }
.face.out-prev { animation: face-out-prev .35s ease-in both; }
@keyframes face-in-next { from { transform: rotateY(-90deg); opacity: .2; } to { transform: none; opacity: 1; } }
@keyframes face-in-prev { from { transform: rotateY(90deg); opacity: .2; } to { transform: none; opacity: 1; } }
@keyframes face-out-next { to { transform: rotateY(90deg); opacity: .2; } }
@keyframes face-out-prev { to { transform: rotateY(-90deg); opacity: .2; } }
.face.shake { animation: shake .5s ease; }
@keyframes shake { 0%, 100% { transform: translateX(0); } 20% { transform: translateX(-14px); } 40% { transform: translateX(12px); } 60% { transform: translateX(-8px); } 80% { transform: translateX(5px); } }
.face-k { font-family: var(--f-mono); font-size: 12px; letter-spacing: 3px; color: var(--gold); }
.face.last .face-k { color: var(--bone); }
.qs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 18px; }
.qs > .wide { grid-column: 1 / -1; }
.qs > * { animation: q-in .6s var(--ease) both; }
@keyframes q-in { from { transform: translateY(26px) rotateX(-60deg); opacity: 0; } to { transform: none; opacity: 1; } }
fieldset.field { margin: 0; padding: 0; border: 0; }
fieldset.field legend { margin-bottom: 10px; padding: 0; }
.opts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.req { color: var(--gold); }
.face-err { margin-top: 16px; padding: 10px 14px; border: 1px solid var(--gold); background: rgba(217, 192, 138, .1); font-size: 14px; }
.final-h { margin: 14px 0 0; font-family: var(--f-disp); font-weight: 900; font-size: 52px; line-height: .95; overflow-wrap: anywhere; }
.consents { display: flex; flex-direction: column; gap: 10px; margin-top: 18px; }
.consents .opt { border-color: rgba(228, 225, 215, .4); }
.consents a { color: var(--gold); }
.minor-note { margin-top: 14px; padding: 14px; background: rgba(18, 19, 12, .45); font-size: 14px; line-height: 1.5; }
.submit { width: 100%; margin-top: 18px; min-height: 60px; font-size: 22px; letter-spacing: 3px; clip-path: none; }
.nav-btns { display: flex; gap: 14px; margin-top: 18px; }
.nav-btns > * { flex: 1 1 0; max-width: 200px; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.done { position: relative; margin-top: 20px; padding: 60px 40px; text-align: center; background: var(--bg-2); border: 2px solid var(--gold); overflow: hidden; }
.done-tag-stage { height: 240px; perspective: 1000px; display: flex; justify-content: center; }
.done .dogtag { animation: tag-drop 1.3s var(--ease) both; }
@keyframes tag-drop { 0% { transform: translateY(-400px) rotateY(540deg) scale(.3); } 70% { transform: translateY(16px) rotateY(-10deg) scale(1.05); } 100% { transform: none; } }
.stamp { position: absolute; right: -24px; top: -18px; padding: 6px 12px; border: 3px solid var(--bg); color: var(--bg); background: var(--gold); font-family: var(--f-disp); font-weight: 900; font-size: 20px; letter-spacing: 2px; transform: translateZ(20px) rotate(-14deg); animation: stamp .5s 1.1s cubic-bezier(.2, .9, .3, 1.4) both; }
@keyframes stamp { 0% { transform: scale(3) rotate(-14deg); opacity: 0; } 60% { transform: scale(.92) rotate(-14deg); opacity: 1; } 100% { transform: scale(1) rotate(-14deg); opacity: 1; } }
.burst { position: absolute; left: 50%; top: 190px; width: 0; height: 0; }
.burst > div { position: absolute; left: 0; top: 0; }
.burst > div i { display: block; width: 10px; height: 10px; margin: -5px 0 0 -5px; border-radius: 50%; animation: burst 1.4s .9s cubic-bezier(.2, .8, .3, 1) both; }
@keyframes burst { from { transform: translateY(0) scale(1); opacity: 1; } to { transform: translateY(-260px) scale(.2); opacity: 0; } }
.done-h { font-family: var(--f-disp); font-weight: 900; font-size: 56px; line-height: .95; }
.done p { max-width: 440px; margin: 18px auto 0; font-size: 16px; line-height: 1.6; color: var(--muted); }
.closed { margin-top: 20px; padding: 48px 34px; background: var(--bg-2); border: 1px solid var(--line-2); }
.closed h2 { margin: 0; font-family: var(--f-disp); font-weight: 900; font-size: 48px; line-height: .95; }

.modal { position: fixed; inset: 0; z-index: 150; display: flex; align-items: center; justify-content: center; padding: 20px; background: rgba(10, 11, 7, .9); }
.modal-box { position: relative; width: min(680px, 100%); max-height: 86vh; overflow: auto; padding: 32px; background: var(--bg-2); border: 1px solid var(--gold); animation: lb-in .45s var(--ease) both; }
.modal-box h2 { margin: 0 0 14px; font-family: var(--f-disp); font-weight: 900; font-size: 34px; }
.modal-box .kvkk { white-space: pre-line; font-size: 15px; line-height: 1.65; color: var(--label); }
.modal-x { position: absolute; right: 12px; top: 12px; width: 44px; height: 44px; border: 1px solid var(--line-2); background: transparent; color: var(--gold); font-size: 18px; }

/* =========================== 404 =========================== */
.nf { min-height: 70vh; display: flex; align-items: center; }
.nf-code { font-family: var(--f-disp); font-weight: 900; font-size: clamp(120px, 26vw, 300px); line-height: .8; color: transparent; -webkit-text-stroke: 2px var(--gold); }

/* =========================== responsive =========================== */
@media (max-width: 1000px) {
  .lab { flex-direction: column; }
  .lab-side { flex: 1 1 auto; }
  .lab-stage { flex: 0 0 auto; height: 520px; }
  .ab-flag { margin-left: -360px; }
}
@media (max-width: 700px) {
  .p-head { padding-top: 32px; }
  .ab-hero { min-height: 0; }
  .ab-flag { left: 50%; top: 24px; margin-left: -292px; transform: scale(.5); transform-origin: 0 0; }
  .ab-shade { background: linear-gradient(180deg, rgba(18, 19, 12, 0) 0%, rgba(18, 19, 12, .15) 26%, rgba(18, 19, 12, .92) 52%, var(--bg) 70%); }
  .ab-hero-in { padding-top: 300px; padding-bottom: 56px; }
  .tline-bar { left: 11px; right: auto; top: 0; bottom: 0; width: 2px; height: auto; transform-origin: 50% 0; transform: scaleY(0); }
  .tline.in .tline-bar { transform: scaleY(1); }
  .tline-grid { gap: 30px; }
  .tl { padding: 0 0 0 48px; }
  .tl b { font-size: 34px; }
  .ab-lead { font-size: 17px; }
  .ab-stats b { font-size: 42px; }
  .story { gap: 40px; }
  .dossier { flex-basis: 100%; height: 380px; }
  .doss { left: 20px; top: 30px; width: auto; right: 20px; max-width: none; height: 300px; }
  .ring-wrap { height: 280px; }
  .ring { top: 60px; }
  .gal-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 150px; gap: 10px; }
  .tile-cap b { font-size: 16px; }
  .tile-cap { flex-direction: column; align-items: flex-start; gap: 6px; }
  .tile:hover { transform: none; }
  .lb-prev, .lb-next { top: auto; bottom: 20px; margin-top: 0; }
  .lb-prev { left: 20px; } .lb-next { right: 20px; }
  .lb-box { margin-bottom: 70px; }
  .lab-stage { height: 420px; }
  .lab-sweep { width: 380px; height: 380px; margin: -190px 0 0 -190px; }
  .lab-pulse { width: 220px; height: 220px; margin: -110px 0 0 -110px; }
  .lab-shadow { width: 240px; margin-left: -120px; bottom: 70px; }
  .model { transform: scale(.66); }
  .ops-radar { flex-basis: 220px; height: 220px; margin: 0 auto; }
  .ops-radar-in > i:nth-child(2) { inset: 40px; } .ops-radar-in > i:nth-child(3) { inset: 80px; }
  .ops-chips { margin-top: 24px; }
  .ops-chips .chip { padding: 0 12px; font-size: 11px; letter-spacing: 1px; }
  .ops-grid { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .oc-wrap { height: 470px; }
  .nb-wrap { gap: 32px; padding-top: 30px; }
  .dogtag-stage { margin-top: 26px; height: 210px; }
  .dogtag { width: 290px; height: 172px; }
  .steps { display: none; }
  .face { padding: 22px 18px; }
  .qs { grid-template-columns: minmax(0, 1fr); }
  .opts { grid-template-columns: minmax(0, 1fr); }
  .final-h { font-size: 40px; }
  .nav-btns > * { max-width: none; }
  .done { padding: 40px 20px; }
  .done-h { font-size: 44px; }
  .closed { padding: 32px 20px; }
  .nb-cube { display: none; }
  .modal-box { padding: 24px 18px; }
}

/* ===================== Onay kutuları: aydınlatma / açık rıza ayrımı ===================== */
.consent-sep { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 14px; margin-top: 22px; padding-top: 16px; border-top: 1px dashed var(--line-2); }
.consent-sep b { font-family: var(--f-disp); font-weight: 800; font-size: 18px; letter-spacing: 2px; color: var(--gold); }
.consent-sep span { font-family: var(--f-mono); font-size: 11px; letter-spacing: 1px; color: var(--sand); }
.consent-note { margin: 14px 0 0; font-size: 13px; line-height: 1.5; color: var(--muted); }
.consent-note a { color: var(--gold); }
.consents .req { color: var(--gold); }

/* ===================== SSS (Hakkında) ===================== */
.faq-sec { overflow: hidden; border-top: 1px solid var(--line); }
.faq-bg { position: absolute; inset: 0; pointer-events: none; perspective: 900px; }
.faq-ring { position: absolute; right: -160px; top: 50%; width: 520px; height: 520px; margin-top: -260px; transform-style: preserve-3d; animation: faq-spin 26s linear infinite; opacity: .5; }
.faq-ring i { position: absolute; inset: 0; border: 1px solid var(--line-2); border-radius: 50%; }
.faq-ring i:nth-child(2) { transform: rotateX(68deg); border-style: dashed; }
.faq-ring i:nth-child(3) { transform: rotateY(68deg); border-color: rgba(217, 192, 138, .12); }
@keyframes faq-spin { to { transform: rotateX(18deg) rotateY(360deg); } }
.faq-wrap { position: relative; display: grid; grid-template-columns: minmax(260px, 1fr) 2fr; gap: 56px; align-items: start; }
.faq-head { position: sticky; top: 110px; }
.faq-list { display: flex; flex-direction: column; gap: 10px; }
.faq { background: linear-gradient(90deg, rgba(42, 44, 29, .55), rgba(18, 19, 12, .3)); border: 1px solid var(--line); transition: border-color .3s, background .3s, transform .35s var(--ease); }
.faq:hover { border-color: var(--line-2); transform: translateX(4px); }
.faq[open] { border-color: rgba(217, 192, 138, .5); background: linear-gradient(90deg, rgba(67, 71, 49, .55), rgba(18, 19, 12, .35)); }
.faq summary { list-style: none; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 16px; padding: 18px 20px; cursor: pointer; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.faq-n { font-family: var(--f-mono); font-size: 12px; color: var(--gold); letter-spacing: 1px; }
.faq-q { font-family: var(--f-disp); font-weight: 700; font-size: clamp(18px, 2vw, 22px); letter-spacing: .5px; color: var(--bone); }
.faq summary i { position: relative; width: 16px; height: 16px; }
.faq summary i::before, .faq summary i::after { content: ''; position: absolute; left: 0; top: 7px; width: 16px; height: 2px; background: var(--gold); transition: transform .35s var(--ease); }
.faq summary i::after { transform: rotate(90deg); }
.faq[open] summary i::after { transform: rotate(0); }
.faq-a { padding: 0 20px 20px 56px; }
.faq-a p { margin: 0; font-size: 15.5px; line-height: 1.7; color: var(--label); max-width: 720px; }
.faq[open] .faq-a { animation: faq-open .45s var(--ease) both; }
@keyframes faq-open { from { opacity: 0; transform: translateY(-8px); } }

/* ===================== New Beginner · ilk oyundan önce ===================== */
.nbt-sec { border-top: 1px solid var(--line); }
.nbt-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 36px; perspective: 1000px; }
.nbt { position: relative; overflow: hidden; padding: 24px 22px 26px; background: linear-gradient(160deg, rgba(67, 71, 49, .5), rgba(18, 19, 12, .6)); border: 1px solid var(--line); transition: transform .5s var(--ease), border-color .3s; transform-style: preserve-3d; }
.nbt:hover { transform: rotateX(6deg) rotateY(-6deg) translateY(-4px); border-color: rgba(217, 192, 138, .5); }
.nbt-top { display: flex; justify-content: space-between; align-items: center; color: var(--gold); }
.nbt-n { font-family: var(--f-mono); font-size: 12px; letter-spacing: 2px; color: var(--sand); }
.nbt h3 { margin: 22px 0 10px; font-family: var(--f-disp); font-weight: 800; font-size: 24px; letter-spacing: 1px; }
.nbt p { margin: 0; font-size: 14.5px; line-height: 1.6; color: var(--muted); }
.nbt-scan { position: absolute; left: 0; right: 0; top: -40%; height: 40%; background: linear-gradient(180deg, transparent, rgba(217, 192, 138, .08), transparent); animation: nbt-scan 5s linear infinite; pointer-events: none; }
.nbt:nth-child(2) .nbt-scan { animation-delay: -1.2s; } .nbt:nth-child(3) .nbt-scan { animation-delay: -2.5s; } .nbt:nth-child(4) .nbt-scan { animation-delay: -3.7s; }
@keyframes nbt-scan { to { top: 110%; } }

/* ===================== KVKK sayfası ===================== */
.kv-head { position: relative; padding-bottom: 40px; }
.kv-shield { position: absolute; right: var(--pad); top: 40px; width: 220px; height: 220px; perspective: 800px; pointer-events: none; }
.kv-shield-in { position: relative; width: 100%; height: 100%; display: grid; place-items: center; transform-style: preserve-3d; animation: kv-float 7s ease-in-out infinite; }
.kv-shield img { width: 160px; height: 160px; filter: drop-shadow(0 18px 30px rgba(0, 0, 0, .6)); }
.kv-shield i { position: absolute; inset: 0; border: 1px solid var(--line-2); border-radius: 50%; animation: kv-orbit 12s linear infinite; }
.kv-shield i:last-child { inset: 18px; border-style: dashed; animation-duration: 18s; animation-direction: reverse; }
@keyframes kv-float { 50% { transform: translateY(-10px) rotateY(16deg); } }
@keyframes kv-orbit { from { transform: rotateX(70deg) rotateZ(0); } to { transform: rotateX(70deg) rotateZ(360deg); } }
.kv-meta { display: flex; flex-wrap: wrap; gap: 10px 24px; margin-top: 22px; font-family: var(--f-mono); font-size: 11px; letter-spacing: 2px; color: var(--sand); }
.kv-meta b { color: var(--bone); font-weight: 500; }
.kv-toc { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 26px; max-width: 900px; }
.kv-toc a { padding: 8px 12px; border: 1px solid var(--line); font-family: var(--f-mono); font-size: 11px; letter-spacing: 1px; color: var(--label); text-decoration: none; transition: border-color .25s, color .25s, background .25s; }
.kv-toc a:hover { border-color: var(--gold); color: var(--gold); background: rgba(217, 192, 138, .06); }
.kv-body { display: flex; flex-direction: column; gap: 14px; padding-bottom: 96px; max-width: 1040px; margin-left: auto; margin-right: auto; }
.kv-sec { scroll-margin-top: 100px; padding: 28px clamp(18px, 3vw, 34px); background: linear-gradient(180deg, rgba(27, 28, 19, .85), rgba(18, 19, 12, .6)); border: 1px solid var(--line); border-left: 3px solid var(--olive); }
.kv-sec:target { border-left-color: var(--gold); }
.kv-sec h2 { display: flex; align-items: baseline; gap: 14px; margin: 0 0 14px; font-family: var(--f-disp); font-weight: 800; font-size: clamp(22px, 2.6vw, 30px); letter-spacing: 1px; }
.kv-sec h2 span { font-family: var(--f-mono); font-size: 12px; font-weight: 500; color: var(--gold); letter-spacing: 1px; }
.kv-sec p { margin: 0 0 12px; font-size: 15.5px; line-height: 1.7; color: var(--label); }
.kv-sec p:last-child { margin-bottom: 0; }
.kv-sec b { color: var(--bone); font-weight: 600; }
.kv-dl { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; margin: 16px 0 0; background: var(--line); border: 1px solid var(--line); }
.kv-dl div { padding: 14px 16px; background: var(--bg-3); }
.kv-dl dt { font-family: var(--f-mono); font-size: 10px; letter-spacing: 2px; color: var(--sand); text-transform: uppercase; }
.kv-dl dd { margin: 6px 0 0; font-size: 15px; color: var(--bone); overflow-wrap: anywhere; }
.kv-table { margin: 14px 0; border: 1px solid var(--line); font-size: 14.5px; }
.kv-tr { display: grid; grid-template-columns: 1fr 2fr 1.2fr; border-top: 1px solid var(--line); }
.kv-tr:first-child { border-top: 0; }
.kv-2 .kv-tr { grid-template-columns: 1.4fr 1fr; }
.kv-tr span { padding: 12px 14px; line-height: 1.55; color: var(--label); }
.kv-tr span + span { border-left: 1px solid var(--line); }
.kv-th span { font-family: var(--f-mono); font-size: 10.5px; letter-spacing: 2px; color: var(--gold); text-transform: uppercase; background: rgba(67, 71, 49, .35); }
.kv-tr:not(.kv-th):hover span { background: rgba(217, 192, 138, .04); }
.kv-note { padding: 12px 14px; border-left: 2px solid var(--gold); background: rgba(217, 192, 138, .06); font-size: 14px !important; }
.kv-list { margin: 10px 0 14px; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 10px; }
.kv-list li { position: relative; padding-left: 22px; font-size: 15px; line-height: 1.65; color: var(--label); }
.kv-list li::before { content: ''; position: absolute; left: 0; top: .62em; width: 8px; height: 8px; background: var(--gold); transform: rotate(45deg); }
.kv-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px 24px; }
.kv-rights { margin: 12px 0 0; padding: 0; list-style: none; counter-reset: r; display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
.kv-rights li { counter-increment: r; display: flex; gap: 12px; padding: 12px 14px; border: 1px solid var(--line); font-size: 14.5px; line-height: 1.5; color: var(--label); }
.kv-rights li::before { content: counter(r, lower-alpha) ')'; font-family: var(--f-mono); color: var(--gold); }
.kv-steps { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 16px; }
.kv-steps div { padding: 16px; border: 1px solid var(--line-2); background: rgba(67, 71, 49, .25); }
.kv-steps b { display: block; font-family: var(--f-disp); font-weight: 900; font-size: 30px; color: var(--gold) !important; letter-spacing: 1px; }
.kv-steps span { display: block; margin-top: 6px; font-size: 14px; line-height: 1.55; color: var(--label); }
.kv-box { margin-top: 12px; padding: 16px 18px; border: 1px dashed var(--line-2); }
.kv-box p { margin: 8px 0 0; font-style: italic; }

@media (max-width: 1080px) {
  .faq-wrap { grid-template-columns: 1fr; gap: 28px; }
  .faq-head { position: static; }
  .nbt-grid { grid-template-columns: repeat(2, 1fr); }
  .kv-shield { width: 150px; height: 150px; top: 30px; opacity: .55; }
  .kv-shield img { width: 110px; height: 110px; }
}
@media (max-width: 700px) {
  .faq summary { gap: 12px; padding: 16px 14px; }
  .faq-a { padding: 0 14px 18px 14px; }
  .faq-ring { width: 340px; height: 340px; margin-top: -170px; right: -200px; }
  .nbt-grid { grid-template-columns: 1fr; }
  .kv-shield { display: none; }
  .kv-dl, .kv-rights, .kv-steps, .kv-grid { grid-template-columns: 1fr; }
  .kv-tr, .kv-2 .kv-tr { grid-template-columns: 1fr; }
  .kv-tr span + span { border-left: 0; padding-top: 0; }
  .kv-th { display: none; }
  .kv-tr span:first-child { font-weight: 600; color: var(--bone); }
}
@media (prefers-reduced-motion: reduce) {
  .faq-ring, .nbt-scan, .kv-shield-in, .kv-shield i { animation: none; }
}

/* ===================================================================== Operatörler · kart görünümü */
.ops-bar { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px 24px; }
.ops-bar .ops-chips { flex: 1 1 520px; }
.ops-view { display: flex; gap: 6px; }
.pc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 34px 20px; margin-top: 40px; perspective: 1400px; }
.pc-item { display: flex; flex-direction: column; align-items: center; gap: 14px; animation: rd-rise .6s var(--ease) both; }
.pc-link { font-family: var(--f-mono); font-size: 11px; letter-spacing: 2px; color: var(--sand); text-decoration: none; }
.pc-link:hover { color: var(--gold); }
.oc-ovr { position: absolute; left: 12px; bottom: 12px; z-index: 2; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 58px; height: 64px; clip-path: polygon(50% 0, 100% 18%, 100% 82%, 50% 100%, 0 82%, 0 18%); background: var(--t-bronz, #a88a5c); color: #12130c; }
.oc-ovr b { font-family: var(--f-disp); font-weight: 900; font-size: 26px; line-height: .9; }
.oc-ovr i { font-style: normal; font-family: var(--f-disp); font-weight: 800; font-size: 12px; letter-spacing: 1px; }
.oc-ovr.t-gumus { background: #cfccc0; } .oc-ovr.t-altin { background: var(--gold); } .oc-ovr.t-elit { background: #12130c; color: #f0d999; box-shadow: inset 0 0 0 2px #f0d999; }
.oc-badges { display: flex; flex-wrap: wrap; gap: 4px; }
.oc-badges i { padding: 2px 6px; border: 1px solid var(--line-2); font-style: normal; font-family: var(--f-mono); font-size: 9px; letter-spacing: 1px; color: var(--gold); }

/* ===================================================================== Sponsor sayfası */
.sp-hero { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 30px; align-items: center; min-height: 560px; }
.sp-btns { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.sp-emblem { position: relative; height: 440px; perspective: 1100px; transform-style: preserve-3d; }
.sp-orbit { position: absolute; inset: 0; transform-style: preserve-3d; animation: sp-tilt 14s ease-in-out infinite; }
.sp-orbit i { position: absolute; left: 50%; top: 50%; border: 1px solid var(--line-2); border-radius: 50%; transform: translate(-50%, -50%) rotateX(70deg); }
.sp-orbit i:nth-child(1) { width: 420px; height: 420px; animation: sp-ring 16s linear infinite; border-style: dashed; }
.sp-orbit i:nth-child(2) { width: 320px; height: 320px; animation: sp-ring 11s linear infinite reverse; border-color: rgba(217, 192, 138, .5); }
.sp-orbit i:nth-child(3) { width: 520px; height: 520px; opacity: .4; animation: sp-ring 24s linear infinite; }
@keyframes sp-ring { from { transform: translate(-50%, -50%) rotateX(70deg) rotateZ(0); } to { transform: translate(-50%, -50%) rotateX(70deg) rotateZ(360deg); } }
@keyframes sp-tilt { 50% { transform: rotateY(14deg) rotateX(-6deg); } }
.sp-coin { position: absolute; top: 50%; width: 170px; height: 170px; margin-top: -85px; border-radius: 50%; display: flex; align-items: center; justify-content: center; overflow: hidden; box-shadow: 0 0 0 3px #12130c, 0 0 0 4px var(--gold), 0 30px 60px rgba(0, 0, 0, .6); animation: sp-coin 7s ease-in-out infinite; }
.sp-coin img { width: 100%; height: 100%; object-fit: cover; }
.sp-coin-rd { left: 6%; }
.sp-coin-sp { right: 6%; background: radial-gradient(circle at 35% 30%, #f2dea6, #d9c08a 45%, #8a6e38); animation-delay: -3.5s; }
.sp-coin-sp span { font-family: var(--f-disp); font-weight: 900; font-size: 64px; letter-spacing: -1px; color: #12130c; text-shadow: 0 1px 0 rgba(255, 255, 255, .4); }
.sp-coin-sp img { object-fit: contain; padding: 18px; background: #e4e1d7; }
@keyframes sp-coin { 0%, 100% { transform: translateY(0) rotateY(0); } 50% { transform: translateY(-14px) rotateY(22deg); } }
.sp-x { position: absolute; left: 50%; top: 50%; z-index: 2; transform: translate(-50%, -50%); font-family: var(--f-disp); font-weight: 900; font-size: 60px; color: var(--gold); text-shadow: 0 0 24px rgba(217, 192, 138, .6); animation: sp-x 2.4s ease-in-out infinite; }
@keyframes sp-x { 50% { transform: translate(-50%, -50%) scale(1.18) rotate(90deg); } }
.sp-beam { position: absolute; left: 22%; right: 22%; top: 50%; height: 2px; background: linear-gradient(90deg, transparent, var(--gold), transparent); box-shadow: 0 0 14px var(--gold); animation: sp-beam 2.4s ease-in-out infinite; }
@keyframes sp-beam { 50% { opacity: .35; transform: scaleX(.7); } }
.sp-about { border-top: 1px solid var(--line); }
.sp-about-in { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: 50px; align-items: center; }
.sp-text { margin: 22px 0 0; font-size: 17px; line-height: 1.75; color: var(--label); max-width: 640px; }
.sp-stats { display: flex; flex-direction: column; gap: 1px; background: var(--line); border: 1px solid var(--line); }
.sp-stats div { padding: 22px 24px; background: linear-gradient(90deg, rgba(67, 71, 49, .4), var(--bg-2)); }
.sp-stats b { display: block; font-family: var(--f-disp); font-weight: 900; font-size: 54px; line-height: 1; color: var(--gold); }
.sp-stats span { font-family: var(--f-mono); font-size: 11px; letter-spacing: 3px; color: var(--sand); }
.sp-cats-sec { border-top: 1px solid var(--line); }
.sp-cats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 36px; perspective: 1200px; }
.sp-cat { position: relative; display: flex; flex-direction: column; gap: 14px; min-height: 200px; padding: 24px; overflow: hidden; background: linear-gradient(160deg, rgba(67, 71, 49, .45), rgba(18, 19, 12, .7)); border: 1px solid var(--line); color: var(--bone); text-decoration: none; transition: transform .5s var(--ease), border-color .3s; }
.sp-cat:hover { transform: rotateX(6deg) rotateY(-6deg) translateY(-6px); border-color: var(--gold); color: var(--bone); }
.sp-cat svg { color: var(--gold); }
.sp-cat-n { font-family: var(--f-mono); font-size: 11px; letter-spacing: 2px; color: var(--sand); }
.sp-cat b { font-family: var(--f-disp); font-weight: 800; font-size: 26px; line-height: 1.05; letter-spacing: .5px; }
.sp-cat-go { margin-top: auto; font-family: var(--f-disp); font-weight: 800; font-size: 14px; letter-spacing: 2px; color: var(--gold); }
.sp-cat-shine { position: absolute; top: 0; bottom: 0; left: 0; width: 30%; background: linear-gradient(90deg, transparent, rgba(217, 192, 138, .14), transparent); transform: translateX(-150%) skewX(-20deg); }
.sp-cat:hover .sp-cat-shine { animation: rd-shine 1.1s var(--ease); }
.sp-cv-sec { border-top: 1px solid var(--line); }
.sp-cv { position: relative; margin: 40px 0 0; padding: 0; list-style: none; max-width: 900px; }
.sp-cv::before { content: ''; position: absolute; left: 118px; top: 8px; bottom: 8px; width: 2px; background: linear-gradient(var(--gold), var(--olive) 70%, transparent); }
.sp-cv li { display: grid; grid-template-columns: 100px 40px minmax(0, 1fr); align-items: start; padding: 0 0 30px; }
.sp-cv-d { text-align: right; font-family: var(--f-mono); font-size: 11px; letter-spacing: 1px; color: var(--sand); }
.sp-cv-d b { display: block; font-family: var(--f-disp); font-weight: 900; font-size: 38px; line-height: .9; color: var(--bone); }
.sp-cv-dot { position: relative; width: 16px; height: 16px; margin: 10px 0 0 11px; background: var(--gold); transform: rotate(45deg); box-shadow: 0 0 0 4px var(--bg), 0 0 18px rgba(217, 192, 138, .5); }
.sp-cv li.up .sp-cv-dot { background: var(--bg); border: 2px solid var(--gold); animation: rd-blink 1.6s steps(1) infinite; }
.sp-cv h3 { margin: 4px 0 6px; font-family: var(--f-disp); font-weight: 900; font-size: 28px; line-height: 1.05; }
.sp-cv p { margin: 0; font-size: 15px; color: var(--muted); }
.sp-cv-f { font-family: var(--f-mono); font-size: 11px; letter-spacing: 2px; color: var(--gold); }
.sp-cta { position: relative; overflow: hidden; padding: 70px 0 90px; background: radial-gradient(70% 120% at 100% 0, rgba(217, 192, 138, .14), transparent 60%), var(--bg-2); border-top: 1px solid var(--line-2); }
.sp-cta-in { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px; }
.sp-cta h2 { margin: 8px 0 8px; font-family: var(--f-disp); font-weight: 900; font-size: clamp(36px, 5vw, 64px); line-height: .95; }
.sp-cta p { margin: 0; max-width: 520px; color: var(--muted); }

/* ===================================================================== Blog */
.bl-head { position: relative; padding-bottom: 30px; }
.bl-deco { position: absolute; right: var(--pad); top: 60px; display: flex; gap: 14px; pointer-events: none; }
.bl-deco span { width: 90px; height: 120px; border: 1px solid var(--line-2); background: linear-gradient(160deg, rgba(67, 71, 49, .5), transparent); transform: perspective(600px) rotateY(-25deg); animation: bl-float 6s ease-in-out infinite; }
.bl-deco span:nth-child(2) { animation-delay: -2s; transform: perspective(600px) rotateY(-25deg) translateY(30px); }
.bl-deco span:nth-child(3) { animation-delay: -4s; }
@keyframes bl-float { 50% { transform: perspective(600px) rotateY(-10deg) translateY(-14px); } }
.bl-tags { margin-top: 26px; }
.bl-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 16px; padding-bottom: 90px; }
.bl-card { position: relative; display: flex; flex-direction: column; gap: 12px; min-height: 280px; padding: 26px; overflow: hidden; background: linear-gradient(170deg, var(--bg-2), var(--bg-3)); border: 1px solid var(--line); color: var(--bone); text-decoration: none; transition: transform .45s var(--ease), border-color .3s; }
.bl-card::before { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 3px; background: linear-gradient(90deg, var(--gold), transparent); transform-origin: left; transform: scaleX(.25); transition: transform .5s var(--ease); }
.bl-card:hover { transform: translateY(-6px); border-color: var(--line-2); color: var(--bone); }
.bl-card:hover::before { transform: scaleX(1); }
.bl-card-n { font-family: var(--f-mono); font-size: 11px; letter-spacing: 2px; color: var(--sand); }
.bl-card h2 { margin: 0; font-family: var(--f-disp); font-weight: 900; font-size: 30px; line-height: 1.02; }
.bl-card p { margin: 0; font-size: 15px; line-height: 1.6; color: var(--muted); }
.bl-card-f { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; margin-top: auto; font-family: var(--f-mono); font-size: 11px; color: var(--gold); }
.bl-card-f i { margin-left: 6px; padding: 2px 6px; border: 1px solid var(--line-2); font-style: normal; color: var(--sand); }
.bl-card-go { font-family: var(--f-disp); font-weight: 800; letter-spacing: 2px; color: var(--gold); }
.bl-empty { padding: 60px 0 100px; }
.bl-post { max-width: 780px; margin: 0 auto; padding: 50px 0 100px; }
.bl-back { font-family: var(--f-mono); font-size: 12px; letter-spacing: 2px; color: var(--sand); text-decoration: none; }
.bl-back:hover { color: var(--gold); }
.bl-ph { margin-top: 30px; padding-bottom: 28px; border-bottom: 1px solid var(--line); animation: rd-rise .6s var(--ease) both; }
.bl-ph h1 { margin: 12px 0 14px; font-family: var(--f-disp); font-weight: 900; font-size: clamp(40px, 6vw, 72px); line-height: .95; overflow-wrap: anywhere; }
.bl-meta { display: flex; align-items: center; gap: 12px; margin-top: 22px; }
.bl-av { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 50%; background: var(--olive); font-family: var(--f-disp); font-weight: 900; color: var(--gold); }
.bl-meta b { display: block; font-family: var(--f-disp); font-weight: 800; font-size: 18px; }
.bl-meta i { font-style: normal; font-family: var(--f-mono); font-size: 11px; color: var(--sand); }
.bl-body { margin-top: 30px; font-size: 18px; line-height: 1.8; color: var(--label); }
.bl-body p { margin: 0 0 22px; overflow-wrap: anywhere; }
.bl-body p:first-child::first-letter { float: left; margin: 6px 10px 0 0; font-family: var(--f-disp); font-weight: 900; font-size: 74px; line-height: .8; color: var(--gold); }
.bl-sign { display: flex; align-items: center; gap: 14px; margin-top: 30px; padding: 18px; border: 1px solid var(--line); font-size: 14px; color: var(--muted); }
.bl-sign img { border-radius: 50%; }
.bl-pf .bl-grid { margin-top: 16px; padding-bottom: 0; }

@media (max-width: 1080px) {
  .sp-hero { grid-template-columns: 1fr; min-height: 0; }
  .sp-emblem { height: 320px; }
  .sp-orbit i:nth-child(1) { width: 320px; height: 320px; } .sp-orbit i:nth-child(3) { width: 400px; height: 400px; }
  .sp-coin { width: 130px; height: 130px; margin-top: -65px; }
  .sp-coin-sp span { font-size: 48px; }
  .sp-about-in { grid-template-columns: 1fr; gap: 30px; }
  .sp-cats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bl-deco { display: none; }
}
@media (max-width: 640px) {
  .sp-emblem { height: 250px; }
  .sp-coin { width: 104px; height: 104px; margin-top: -52px; }
  .sp-coin-rd { left: 2%; } .sp-coin-sp { right: 2%; }
  .sp-coin-sp span { font-size: 38px; }
  .sp-orbit i:nth-child(1) { width: 250px; height: 250px; } .sp-orbit i:nth-child(2) { width: 200px; height: 200px; } .sp-orbit i:nth-child(3) { width: 300px; height: 300px; }
  .sp-x { font-size: 42px; }
  .sp-cats { grid-template-columns: 1fr; }
  .sp-cat { min-height: 0; }
  .sp-cv::before { left: 78px; }
  .sp-cv li { grid-template-columns: 64px 30px minmax(0, 1fr); }
  .sp-cv-dot { margin-left: 7px; }
  .sp-cv-d b { font-size: 30px; }
  .sp-cv h3 { font-size: 22px; }
  .pc-grid { grid-template-columns: 1fr; }
  .bl-grid { grid-template-columns: 1fr; }
  .bl-body { font-size: 17px; }
  .ops-view { width: 100%; }
  .ops-view .chip { flex: 1 1 0; }
}
@media (prefers-reduced-motion: reduce) {
  .sp-orbit, .sp-orbit i, .sp-coin, .sp-x, .sp-beam, .bl-deco span, .sp-cv li.up .sp-cv-dot { animation: none !important; }
}
.sp-hero .lead { margin-top: 22px; max-width: 520px; }