@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url("/fonts/inter-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url("/fonts/inter-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Tek tema: görsellerin gece mavisi. Her ürün kendi rengini taşır; yüzeyler sıvı cam. */
:root {
  --gece: #04060D;
  --gece-2: #080C18;
  --yazi: #F4F6FB;
  --yazi-2: rgba(226, 232, 245, 0.72);
  --soluk: rgba(226, 232, 245, 0.46);
  --cizgi: rgba(255, 255, 255, 0.08);
  --turkuaz: #2DD4BF;
  --altin: #F5B544;
  --mor: #8B7CFF;
  --yumusak: cubic-bezier(0.22, 1, 0.36, 1);
  --kap: 74rem;
  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; overflow-x: clip; }
body {
  margin: 0;
  background: var(--gece);
  color: var(--yazi);
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  font-optical-sizing: auto;
  font-feature-settings: "cv11", "ss03";
  font-size: 1.0625rem;
  line-height: 1.6;
  letter-spacing: -0.011em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: clip;
}
/* İnce film greni: koyu yüzeylere doku verir */
body::after {
  content: ""; position: fixed; inset: 0; z-index: 100; pointer-events: none; opacity: .06;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .55 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}
img, video, canvas { display: block; max-width: 100%; }
a { color: inherit; }
:focus-visible { outline: 2px solid var(--yazi); outline-offset: 3px; border-radius: 10px; }
::selection { background: rgba(139, 124, 255, 0.45); }

.atla {
  position: absolute; left: 1rem; top: -3rem; z-index: 200;
  background: var(--yazi); color: var(--gece);
  padding: .5rem .75rem; border-radius: 10px; text-decoration: none;
}
.atla:focus { top: 1rem; }
.kap { width: 100%; max-width: var(--kap); margin: 0 auto; padding: 0 1.5rem; }

/* ——— Sıvı cam ——— arkasını bulanıklaştırıp doyurur, tepede parlak kenar, kıyıda ışık çizgisi,
   imleci izleyen parlama (--mx/--my, hareket.js). */
.cam {
  position: relative;
  isolation: isolate;
  background:
    linear-gradient(160deg, rgba(255, 255, 255, 0.13) 0%, rgba(255, 255, 255, 0.05) 38%, rgba(255, 255, 255, 0.025) 100%);
  -webkit-backdrop-filter: blur(24px) saturate(185%) brightness(1.06);
  backdrop-filter: blur(24px) saturate(185%) brightness(1.06);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.34),
    inset 0 -1px 0 rgba(255, 255, 255, 0.05),
    inset 0 0 22px rgba(255, 255, 255, 0.035),
    0 24px 60px -24px rgba(0, 0, 0, 0.75),
    0 2px 8px rgba(0, 0, 0, 0.28);
}
.cam::before {
  content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px; pointer-events: none; z-index: 1;
  background: linear-gradient(140deg, rgba(255, 255, 255, 0.55), rgba(255, 255, 255, 0.1) 26%, rgba(255, 255, 255, 0) 55%, rgba(255, 255, 255, 0.08) 78%, rgba(255, 255, 255, 0.3));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
}
.cam::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; z-index: -1;
  background: radial-gradient(520px circle at var(--mx, 22%) var(--my, -10%), rgba(255, 255, 255, 0.13), transparent 42%);
  transition: opacity .4s var(--yumusak);
}

/* Üst menü: ortada yüzen cam hap */
.ust {
  position: fixed; top: 1rem; left: 50%; z-index: 50;
  transform: translateX(-50%);
  width: min(calc(100% - 2rem), 58rem);
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding: .55rem .6rem .55rem 1.25rem; border-radius: 999px;
  transition: width .5s var(--yumusak), top .5s var(--yumusak);
}
.kaydi .ust { top: .6rem; width: min(calc(100% - 2rem), 48rem); }
.marka { font-weight: 650; font-size: 1.125rem; letter-spacing: -0.03em; text-decoration: none; }
.marka span { color: var(--soluk); font-weight: 500; }
.ust-menu { display: flex; align-items: center; gap: .25rem; font-size: .9375rem; }
.ust-menu a { text-decoration: none; color: var(--yazi-2); padding: .5rem .85rem; border-radius: 999px; transition: color .3s, background .3s; }
.ust-menu a:hover { color: var(--yazi); background: rgba(255, 255, 255, 0.06); }
.ust-menu .ust-dugme { color: var(--gece); background: var(--yazi); font-weight: 600; padding: .55rem 1.05rem; }
.ust-menu .ust-dugme:hover { background: #fff; color: var(--gece); }

/* Açılış: sağda video sahnesi, solda başlık, üstünde parçacıklar */
.giris { position: relative; min-height: min(100svh, 64rem); display: flex; align-items: center; overflow: hidden; isolation: isolate; }
.giris-sahne {
  position: absolute; top: 0; bottom: 0; right: -4%; width: 72%; z-index: -2;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 34%, #000 100%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 34%, #000 100%);
  will-change: transform, opacity;
}
.giris-poster img, .giris-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 55%; }
.giris-video { opacity: 1; transition: opacity 1.2s var(--yumusak); }
.hareket .giris-video { opacity: 0; }
.hareket .giris-video.hazir { opacity: 1; }
.giris::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 30%; z-index: -1; pointer-events: none;
  background: linear-gradient(0deg, var(--gece), rgba(4, 6, 13, 0));
}
.parcaciklar { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -1; pointer-events: none; }
.giris-icerik { width: 100%; max-width: calc(var(--kap) + 3rem); margin: 0 auto; padding: 9rem 1.5rem 6rem; }
.rozet {
  display: inline-flex; align-items: center; gap: .6rem;
  margin: 0 0 2rem; padding: .45rem 1rem .45rem .8rem; border-radius: 999px;
  font-size: .875rem; font-weight: 500; color: var(--yazi-2);
}
.rozet-nokta { width: .5rem; height: .5rem; border-radius: 50%; background: var(--turkuaz); box-shadow: 0 0 14px 2px rgba(45, 212, 191, 0.7); }
.giris h1 {
  margin: 0 0 1.75rem;
  font-size: clamp(3.4rem, 1.4rem + 7.4vw, 8rem);
  line-height: .96; font-weight: 600; letter-spacing: -0.055em;
  background: linear-gradient(180deg, #FFFFFF 0%, #FFFFFF 45%, #AAB3C8 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  padding: .18em 0 .14em; margin-top: -.18em; margin-bottom: calc(1.75rem - .14em);
}
.giris-metin { margin: 0 0 2.5rem; max-width: 30rem; font-size: clamp(1.125rem, 1rem + .45vw, 1.3125rem); line-height: 1.55; color: var(--yazi-2); letter-spacing: -0.015em; }
.dugmeler { display: flex; flex-wrap: wrap; align-items: center; gap: .85rem; }
.dugme {
  display: inline-flex; align-items: center; justify-content: center; text-decoration: none;
  background: var(--yazi); color: var(--gece);
  font-weight: 600; font-size: 1rem; letter-spacing: -0.01em;
  padding: 1rem 1.6rem; border-radius: 999px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 12px 40px -12px rgba(139, 124, 255, 0.65), 0 0 0 1px rgba(255, 255, 255, 0.35);
  transition: box-shadow .4s var(--yumusak), background .3s;
  will-change: transform;
}
.dugme:hover { background: #fff; box-shadow: inset 0 1px 0 #fff, 0 16px 50px -10px rgba(45, 212, 191, 0.6), 0 0 0 1px rgba(255, 255, 255, 0.6); }
.dugme-cam {
  display: inline-flex; align-items: center; text-decoration: none;
  padding: 1rem 1.5rem; border-radius: 999px; font-weight: 500; color: var(--yazi);
}

/* Kayan bant: aralarında akan bilgiler */
.bant { padding: 1.25rem 0; overflow: hidden; border-top: 1px solid var(--cizgi); border-bottom: 1px solid var(--cizgi); }
.bant-serit { display: flex; width: max-content; }
.bant-liste { display: flex; gap: 2.75rem; margin: 0; padding: 0 1.375rem; list-style: none; white-space: nowrap; font-size: 1rem; color: var(--yazi-2); font-weight: 500; }
.bant-liste li { display: inline-flex; align-items: center; gap: .7rem; }
.bant-liste li::before { content: ""; width: .45rem; height: .45rem; border-radius: 50%; background: currentColor; }
.b-t::before { color: var(--turkuaz); box-shadow: 0 0 10px var(--turkuaz); }
.b-a::before { color: var(--altin); box-shadow: 0 0 10px var(--altin); }
.b-m::before { color: var(--mor); box-shadow: 0 0 10px var(--mor); }
.hareket .bant-serit { animation: bant 48s linear infinite; }
.bant:hover .bant-serit { animation-play-state: paused; }
@keyframes bant { to { transform: translate3d(-50%, 0, 0); } }
html:not(.hareket) .bant-liste[aria-hidden] { display: none; }
html:not(.hareket) .bant-serit { width: auto; flex-wrap: wrap; }
html:not(.hareket) .bant-liste { flex-wrap: wrap; white-space: normal; row-gap: .75rem; }

/* Ortak bölüm başlıkları */
.bolum { position: relative; padding: 8rem 0; isolation: isolate; }
.bolum-baslik {
  margin: 0 0 1rem;
  font-size: clamp(2.25rem, 1.2rem + 3.6vw, 4.5rem);
  line-height: 1; font-weight: 600; letter-spacing: -0.048em;
  max-width: 16ch;
  background: linear-gradient(180deg, #FFFFFF 30%, #B3BBCF 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  padding: .14em 0 .14em; margin-top: -.14em; margin-bottom: calc(1rem - .14em);
}
.bolum-alt { margin: 0 0 3.5rem; max-width: 34rem; color: var(--yazi-2); font-size: 1.1875rem; line-height: 1.55; letter-spacing: -0.015em; }

/* Camın arkasındaki ışık küreleri */
.kure { position: absolute; z-index: -1; border-radius: 50%; filter: blur(80px); opacity: .5; pointer-events: none; }
.kure-t { background: var(--turkuaz); }
.kure-a { background: var(--altin); }
.kure-m { background: var(--mor); }
.urunler .kure-t { width: 34rem; height: 20rem; left: -8rem; top: 30%; opacity: .22; }
.akis .kure-m { width: 36rem; height: 24rem; right: -10rem; top: 18%; opacity: .28; }
.akis .kure-a { width: 26rem; height: 16rem; left: 10%; top: 55%; opacity: .16; }
.guven .kure-t { width: 30rem; height: 16rem; left: -6rem; top: 22%; opacity: .2; }
.guven .kure-m { width: 34rem; height: 18rem; right: -8rem; top: 28%; opacity: .24; }

/* Ürünler: görsel tam kart, yazı sıvı cam panelde */
.kartlar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
.kart { --renk: var(--turkuaz); position: relative; border-radius: 2rem; overflow: hidden; aspect-ratio: 4 / 5.4; background: var(--gece-2); box-shadow: 0 0 0 1px var(--cizgi); }
.kart-altyapi { --renk: var(--turkuaz); }
.kart-karmatik { --renk: var(--altin); }
.kart-yanit { --renk: var(--mor); }
.kart picture { position: absolute; left: 0; right: 0; top: 0; bottom: 30%; overflow: hidden; }
.kart img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 78%; transform: scale(1.08); transition: filter .6s var(--yumusak); }
.kart picture::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 40%; background: linear-gradient(0deg, var(--gece-2), rgba(8, 12, 24, 0)); }
.kart:hover img { filter: brightness(1.12) saturate(1.1); }
.kart-yazi { position: absolute; left: .75rem; right: .75rem; bottom: .75rem; padding: 1.35rem 1.4rem 1.4rem; border-radius: 1.5rem; display: flex; flex-direction: column; }
.kart-yazi .kart-baglanti { align-self: flex-start; margin-top: auto; padding-top: .75rem; }
@media (min-width: 52.01rem) { .kart-yazi { min-height: 13.5rem; } }
.kart .cam { background: linear-gradient(160deg, rgba(255, 255, 255, 0.12) 0%, rgba(255, 255, 255, 0.04) 40%, rgba(255, 255, 255, 0.02) 100%), rgba(8, 12, 24, 0.42); -webkit-backdrop-filter: blur(26px) saturate(150%); backdrop-filter: blur(26px) saturate(150%); }
.kart-ust { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin: 0 0 .5rem; }
.kart-slogan { color: var(--renk); font-weight: 600; font-size: .9375rem; letter-spacing: -0.01em; }
.kart h3 { margin: 0 0 .5rem; font-size: 1.75rem; font-weight: 600; letter-spacing: -0.04em; line-height: 1.1; }
.kart p { margin: 0; color: var(--yazi-2); font-size: .96875rem; line-height: 1.5; }
.kart-baglanti { display: inline-block; color: var(--yazi); font-weight: 600; font-size: .9375rem; text-decoration: none; border-bottom: 1px solid color-mix(in srgb, var(--renk) 70%, transparent); padding-bottom: 1px; }
.etiket { font-size: .75rem; font-weight: 600; padding: .2rem .6rem; border-radius: 999px; white-space: nowrap; letter-spacing: 0; }
.etiket-canli { color: var(--renk); background: color-mix(in srgb, var(--renk) 16%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--renk) 30%, transparent); }
.etiket-canli::before { content: ""; display: inline-block; width: .4rem; height: .4rem; margin-right: .4rem; border-radius: 50%; background: currentColor; vertical-align: .1em; box-shadow: 0 0 8px currentColor; }
.etiket-yakinda { color: var(--yazi-2); background: rgba(255, 255, 255, 0.08); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12); }

/* Akış: her çift bir cam panel; kablo kaydırdıkça dolar, üstünde iki yöne akan ışık */
.hatlar { display: grid; gap: 1rem; }
.hat { --a: var(--turkuaz); --b: var(--altin); padding: 1.75rem 2rem; border-radius: 1.75rem; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 1.5rem 3rem; align-items: center; }
.hat-ay { --a: var(--turkuaz); --b: var(--mor); }
.hat-ky { --a: var(--altin); --b: var(--mor); }
.hat-uclar { display: flex; align-items: center; gap: .75rem; }
.dugum { flex: none; font-weight: 600; font-size: .9375rem; letter-spacing: -0.02em; padding: .5rem .95rem; border-radius: 999px; background: rgba(255, 255, 255, 0.06); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22), inset 0 0 0 1px rgba(255, 255, 255, 0.08); }
.dugum-altyapi { color: var(--turkuaz); text-shadow: 0 0 18px rgba(45, 212, 191, 0.6); }
.dugum-karmatik { color: var(--altin); text-shadow: 0 0 18px rgba(245, 181, 68, 0.6); }
.dugum-yanit { color: var(--mor); text-shadow: 0 0 18px rgba(139, 124, 255, 0.7); }
.kablo { position: relative; flex: 1; height: 2px; border-radius: 2px; background: rgba(255, 255, 255, 0.08); }
.kablo-dolu { position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(90deg, var(--a), var(--b)); box-shadow: 0 0 12px color-mix(in srgb, var(--a) 60%, transparent); transform-origin: left center; }
.hareket .kablo-dolu { transform: scaleX(var(--ilerleme, 0)); }
.akan { position: absolute; top: 50%; width: 6px; height: 6px; margin-top: -3px; border-radius: 50%; background: #fff; box-shadow: 0 0 10px 3px rgba(255, 255, 255, 0.75); opacity: 0; }
.hareket .akan { opacity: calc(var(--ilerleme, 0) * 1); }
.hareket .akan-ileri { animation: akan-ileri 2.6s var(--yumusak) infinite; }
.hareket .akan-geri { animation: akan-geri 2.6s var(--yumusak) 1.3s infinite; }
@keyframes akan-ileri { from { left: 0; } to { left: calc(100% - 6px); } }
@keyframes akan-geri { from { left: calc(100% - 6px); } to { left: 0; } }
.hat-yonler { margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 1.75rem; }
.hat-yonler dt { font-weight: 600; letter-spacing: -0.02em; margin-bottom: .3rem; }
.hat-yonler dd { margin: 0; color: var(--yazi-2); font-size: .96875rem; line-height: 1.55; }

/* Bağla */
.bagla-izgara { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 4rem; align-items: center; }
.bagla-gorsel { display: block; position: relative; border-radius: 2rem; overflow: hidden; box-shadow: 0 0 0 1px var(--cizgi), 0 40px 80px -40px rgba(139, 124, 255, 0.35); aspect-ratio: 16 / 10; }
.bagla-gorsel img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.08); }
.adimlar { position: relative; list-style: none; counter-reset: adim; margin: 2rem 0; padding: 0; }
.adimlar::before, .adimlar::after { content: ""; position: absolute; left: 1.1rem; top: 1.2rem; bottom: 2.4rem; width: 1px; }
.adimlar::before { background: rgba(255, 255, 255, 0.1); }
.adimlar::after { background: linear-gradient(180deg, var(--turkuaz), var(--mor)); transform-origin: top; transform: scaleY(1); box-shadow: 0 0 8px rgba(139, 124, 255, 0.6); }
.hareket .adimlar::after { transform: scaleY(var(--ilerleme, 0)); }
.adimlar li { counter-increment: adim; position: relative; padding: 0 0 1.5rem 3.5rem; color: var(--yazi-2); line-height: 1.55; }
.adimlar li::before {
  content: counter(adim); position: absolute; left: 0; top: -.15rem; z-index: 1;
  width: 2.25rem; height: 2.25rem; border-radius: 50%; display: grid; place-items: center;
  font-weight: 600; font-size: .9375rem; color: var(--yazi);
  background: rgba(20, 26, 44, 0.9);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35), inset 0 0 0 1px rgba(255, 255, 255, 0.14), 0 0 20px -4px rgba(139, 124, 255, 0.6);
}
.adimlar strong { color: var(--yazi); font-weight: 600; }
.kod {
  display: inline-flex; flex-wrap: wrap; align-items: center; gap: .85rem;
  margin: 0; padding: .8rem 1.1rem; border-radius: 1rem;
  font-family: ui-monospace, "SF Mono", Menlo, monospace; font-size: .8125rem; letter-spacing: .02em; color: var(--yazi); word-break: break-all;
}
.kod span { color: var(--turkuaz); font-weight: 600; font-family: "Inter", sans-serif; font-feature-settings: "tnum"; }

/* Güven */
.ilkeler { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1rem; }
.ilkeler li { padding: 1.6rem 1.35rem 1.5rem; border-radius: 1.5rem; }
.ilkeler svg { width: 1.6rem; height: 1.6rem; fill: none; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; margin-bottom: 1.25rem; stroke: var(--turkuaz); filter: drop-shadow(0 0 6px currentColor); color: var(--turkuaz); }
.ilkeler li:nth-child(2) svg { stroke: var(--altin); color: var(--altin); }
.ilkeler li:nth-child(3) svg { stroke: var(--mor); color: var(--mor); }
.ilkeler li:nth-child(5) svg { stroke: var(--altin); color: var(--altin); }
.ilkeler h3 { margin: 0 0 .45rem; font-size: 1.0625rem; font-weight: 600; letter-spacing: -0.025em; line-height: 1.25; }
.ilkeler p { margin: 0; color: var(--yazi-2); font-size: .9375rem; line-height: 1.5; }
.kanit { margin: 3.5rem 0 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: .5rem 1.5rem; color: var(--yazi-2); max-width: 48rem; font-size: 1.0625rem; }
.kanit strong {
  font-size: clamp(3rem, 2rem + 3.6vw, 5rem); font-weight: 600; letter-spacing: -0.06em; line-height: 1; font-feature-settings: "tnum";
  background: linear-gradient(90deg, var(--turkuaz), var(--mor) 55%, var(--altin));
  -webkit-background-clip: text; background-clip: text; color: transparent;
}

/* İletişim: ışınların buluştuğu sahne, önünde büyük cam panel */
.iletisim { position: relative; overflow: hidden; isolation: isolate; padding: 10rem 0 9rem; }
.iletisim-arka { position: absolute; inset: 0; z-index: -1; }
.iletisim-arka img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 58%; }
.iletisim-arka::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, var(--gece) 0%, rgba(4, 6, 13, 0.15) 30%, rgba(4, 6, 13, 0.3) 70%, var(--gece) 100%); }
.iletisim-panel { max-width: 44rem; margin: 0 auto; padding: 3.5rem 2.5rem 3rem; border-radius: 2.25rem; text-align: center; }
.iletisim h2 {
  margin: 0 auto .85rem; font-size: clamp(2.25rem, 1.3rem + 3.4vw, 4rem); line-height: 1; font-weight: 600; letter-spacing: -0.05em; max-width: 14ch;
  background: linear-gradient(180deg, #FFFFFF 30%, #B3BBCF 100%); -webkit-background-clip: text; background-clip: text; color: transparent; padding: .14em 0 .14em;
}
.iletisim-panel > p { margin: 0 auto 2.25rem; color: var(--yazi-2); font-size: 1.125rem; max-width: 26rem; }
.dugme-buyuk { font-size: 1.0625rem; padding: 1.1rem 2rem; }
.iletisim-panel > .eposta { margin: 1.5rem auto 0; font-size: .9375rem; color: var(--soluk); }
.eposta a { color: var(--yazi); text-underline-offset: 4px; text-decoration-color: rgba(255, 255, 255, 0.3); }

/* Alt bilgi */
.alt { padding: 0 0 2.5rem; color: var(--soluk); font-size: .875rem; }
.alt-ic { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .75rem 1.5rem; padding-top: 1.75rem; border-top: 1px solid var(--cizgi); }
.alt p { margin: 0; }
.alt-baglantilar { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem 1.75rem; }
.alt-baglantilar a { text-decoration: none; transition: color .3s; }
.alt-baglantilar a:hover, .alt-baglantilar a[aria-current] { color: var(--yazi); }

/* ——— Metin sayfası (/gizlilik): sade, hareketsiz, okunur. Betik yüklemez; tek dekor sabit bir ışık. ——— */
.metin { position: relative; isolation: isolate; padding: 8.5rem 0 5rem; }
.metin::before {
  content: ""; position: absolute; z-index: -1; left: 50%; top: -8rem; transform: translateX(-50%);
  width: min(64rem, 100%); height: 30rem; pointer-events: none;
  background: radial-gradient(closest-side, rgba(139, 124, 255, 0.2), rgba(45, 212, 191, 0.06) 60%, transparent);
}
.metin-kap { max-width: 46rem; margin: 0 auto; padding: 0 1.5rem; }
.metin-tarih { margin: 0 0 1rem; font-size: .875rem; color: var(--soluk); }
.metin h1 {
  margin: -.14em 0 calc(1.25rem - .14em); padding: .14em 0;
  font-size: clamp(2.1rem, 1.3rem + 2.8vw, 3.5rem); line-height: 1.05; font-weight: 600; letter-spacing: -0.045em;
  background: linear-gradient(180deg, #FFFFFF 30%, #B3BBCF 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.metin-giris { margin: 0 0 2.5rem; font-size: 1.125rem; line-height: 1.6; color: var(--yazi-2); }
.metin h2 { margin: 3.5rem 0 1rem; font-size: clamp(1.5rem, 1.25rem + .9vw, 1.875rem); line-height: 1.2; font-weight: 600; letter-spacing: -0.035em; }
.metin h3 { margin: 2.25rem 0 .6rem; font-size: 1.125rem; line-height: 1.3; font-weight: 600; letter-spacing: -0.02em; }
.metin section { scroll-margin-top: 6rem; }
.metin p, .metin li, .tablo td { color: rgba(226, 232, 245, 0.86); }
.metin p { margin: 0 0 1rem; }
.metin ul, .metin ol { margin: 0 0 1.25rem; padding-left: 1.25rem; }
.metin li { margin: 0 0 .5rem; padding-left: .25rem; }
.metin li::marker { color: var(--soluk); }
.metin strong { color: var(--yazi); font-weight: 600; }
.metin a { color: var(--yazi); text-decoration: underline; text-decoration-color: rgba(139, 124, 255, 0.65); text-underline-offset: 3px; overflow-wrap: anywhere; }
.metin a:hover { text-decoration-color: var(--yazi); }
.metin code { font-family: ui-monospace, "SF Mono", Menlo, monospace; font-size: .875em; padding: .1em .35em; border-radius: .35rem; background: rgba(255, 255, 255, 0.07); overflow-wrap: anywhere; }
.metin-not { color: var(--soluk); font-size: .9375rem; }

.kisaca { margin: 0 0 2.5rem; padding: 1.5rem 1.75rem .75rem; border-radius: 1.5rem; }
.metin .kisaca h2 { margin: 0 0 .75rem; font-size: 1.125rem; letter-spacing: -0.02em; }
.kisaca li { color: var(--yazi); }

.icindekiler { margin: 0; padding: 1.25rem 0; border-top: 1px solid var(--cizgi); border-bottom: 1px solid var(--cizgi); }
.metin .icindekiler h2 { margin: 0 0 .6rem; font-size: .8125rem; font-weight: 600; letter-spacing: 0; color: var(--soluk); }
.metin .icindekiler ol { margin: 0; columns: 2; column-gap: 2rem; font-size: .9375rem; }
.metin .icindekiler li { margin: 0 0 .35rem; break-inside: avoid; }
.metin .icindekiler a { color: var(--yazi-2); text-decoration: none; }
.metin .icindekiler a:hover { color: var(--yazi); }

.tablo { width: 100%; margin: 0 0 1.25rem; border-collapse: collapse; font-size: .9375rem; line-height: 1.5; }
.tablo th, .tablo td { padding: .85rem 1rem .85rem 0; text-align: left; vertical-align: top; border-bottom: 1px solid var(--cizgi); }
.tablo th:last-child, .tablo td:last-child { padding-right: 0; }
.tablo thead th { font-size: .8125rem; font-weight: 600; color: var(--soluk); border-bottom-color: rgba(255, 255, 255, 0.16); }
.tablo td:first-child { width: 36%; }

@media (max-width: 40rem) {
  .metin { padding: 7rem 0 4rem; }
  .metin-kap { padding: 0 1.25rem; }
  .kisaca { padding: 1.25rem 1.25rem .5rem; }
  .metin .icindekiler ol { columns: 1; }
  /* Tablo satırları karta döner; sütun adı hücrenin üstünde yazar (data-etiket). */
  .tablo thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .tablo, .tablo tbody, .tablo tr, .tablo td { display: block; width: 100%; }
  .tablo tr { padding: 1rem 0; border-bottom: 1px solid var(--cizgi); }
  .tablo td, .tablo td:first-child { width: 100%; padding: 0; border: 0; }
  .tablo td[data-etiket]::before { content: attr(data-etiket); display: block; margin: .6rem 0 .1rem; font-size: .75rem; font-weight: 600; color: var(--soluk); }
}

/* ——— Hareket (yalnız <html class="hareket"> varken; hareket azaltmada hepsi görünür kalır) ——— */
.hareket [data-belir] { opacity: 0; transform: translate3d(0, 22px, 0); filter: blur(6px); transition: opacity .9s var(--yumusak), transform .9s var(--yumusak), filter .9s var(--yumusak); }
.hareket [data-belir].gorundu { opacity: 1; transform: none; filter: none; }
.hareket .kelime { display: inline-block; overflow: hidden; vertical-align: top; padding: .32em .03em .16em; margin: -.32em -.03em -.16em; }
.hareket [data-kelime] { background: none; color: var(--yazi); }
.hareket .kelime > span {
  display: inline-block; transform: translate3d(0, 108%, 0); transition: transform 1.15s var(--yumusak);
  padding: .3em .03em .22em; margin: -.3em -.03em -.22em;
  background: linear-gradient(180deg, #FFFFFF 0%, #FFFFFF 40%, #AAB3C8 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.hareket.basladi .kelime > span { transform: none; }

/* Dar ekran */
@media (max-width: 64rem) {
  .ilkeler { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hat { grid-template-columns: 1fr; }
  .bagla-izgara { grid-template-columns: 1fr; gap: 2.5rem; }
  .bolum { padding: 6rem 0; }
}
@media (max-width: 52rem) {
  .kartlar { grid-template-columns: 1fr; max-width: 28rem; margin-left: auto; margin-right: auto; }
  .ust-menu a:not(.ust-dugme) { display: none; }
}
@media (max-width: 40rem) {
  .kap { padding: 0 1.25rem; }
  .giris { min-height: 0; flex-direction: column; align-items: stretch; }
  .giris-sahne { position: relative; top: auto; bottom: auto; right: auto; width: 100%; height: 78vw; min-height: 17rem; margin-top: 4.5rem; -webkit-mask-image: linear-gradient(0deg, transparent 0%, #000 30%); mask-image: linear-gradient(0deg, transparent 0%, #000 30%); }
  .giris-icerik { padding: 0 1.25rem 4rem; margin-top: -3rem; position: relative; }
  .ust { padding-left: 1rem; }
  .hat { padding: 1.5rem 1.25rem; }
  .hat-yonler { grid-template-columns: 1fr; gap: 1.25rem; }
  .ilkeler { grid-template-columns: 1fr; }
  .iletisim { padding: 6rem 0 5rem; }
  .iletisim-panel { padding: 2.5rem 1.5rem 2.25rem; }
}

@media (prefers-reduced-motion: reduce) {
  .giris-video { display: none; }
  .kart img, .dugme, .ust { transition: none; }
}