/* =========================================================
   Saha Metal — ana sayfa (erimiş metal açılışı)
   ========================================================= */

/* Plus Jakarta Sans (değişken kalınlık), yerel; Türkçe için latin + latin-ext */
@font-face {
  font-family: "Jakarta";
  src: url("../fonts/jakarta-latin-ext.woff2") format("woff2");
  font-weight: 200 800;
  font-display: swap;
  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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Jakarta";
  src: url("../fonts/jakarta-latin.woff2") format("woff2");
  font-weight: 200 800;
  font-display: swap;
  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;
}

:root {
  --black: #000;
  --white: #fff;
  --red: #e1262c;
  --molten: #ffb27a;
  --muted: rgba(255, 255, 255, .55);
  --font: "Jakarta", system-ui, -apple-system, "Segoe UI", sans-serif;
  --gutter: clamp(20px, 3vw, 44px);
  --ease: cubic-bezier(.16, 1, .3, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
html { background: #000; }
body {
  margin: 0;
  font-family: var(--font);
  color: var(--white);
  background: var(--black);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
body.menu-open { overflow: hidden; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
h1, h2, h3, h4, p, figure { margin: 0; }
ul, ol { list-style: none; margin: 0; padding: 0; }

/* ---------- Açılış (preloader) ----------
   Logo alttan dalgalı erimiş metal yüzeyiyle dolar; dolum seviyesi gerçek yüklemedir.
   Dalga şekli (clip-path) main.js'te her karede hesaplanır. */
body.is-loading { overflow: hidden; }
.loader { position: fixed; inset: 0; z-index: 100; }
.loader__half {
  position: absolute;
  left: 0; right: 0;
  height: 50.2%;
  background: #000;
  transition: transform .62s cubic-bezier(.76, 0, .24, 1);
}
.loader__half--top { top: 0; }
.loader__half--bottom { bottom: 0; }
.loader__center {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 34px;
  transition: opacity .25s, transform .6s var(--ease);
}
.loader__logo { position: relative; width: min(400px, 68vw); visibility: hidden; }
.loader--css .loader__logo { visibility: visible; }
.loader__img { display: block; width: 100%; height: auto; }
.loader__img--ghost { opacity: .08; }
.loader__img--base, .loader__img--hot { position: absolute; inset: 0; clip-path: inset(100% 0 0 0); }
.loader__img--hot {
  filter: sepia(1) saturate(9) hue-rotate(-28deg) brightness(1.1) drop-shadow(0 0 6px #ff5a1f) drop-shadow(0 0 16px rgba(255, 60, 0, .75));
}
.loader__note { font-size: 11px; font-weight: 600; letter-spacing: .38em; text-transform: uppercase; color: rgba(255, 255, 255, .42); }
.loader__slit {
  position: absolute;
  left: 0; right: 0; top: 50%;
  z-index: 1;
  height: 2px;
  margin-top: -1px;
  background: linear-gradient(90deg, transparent, #ff7a2e 18%, #fff 50%, #ff7a2e 82%, transparent);
  box-shadow: 0 0 18px 3px rgba(255, 90, 20, .75), 0 0 60px 12px rgba(255, 50, 0, .3);
  transform: scaleX(0);
  opacity: 0;
}
.loader.is-cikis .loader__center { opacity: 0; transform: scale(1.06); }
.loader.is-cikis .loader__slit { animation: yarik .6s var(--ease) forwards; }
@keyframes yarik {
  0% { transform: scaleX(0); opacity: 1; }
  40% { transform: scaleX(1); opacity: 1; }
  100% { transform: scaleX(1) scaleY(.4); opacity: 0; }
}
.loader.is-acik .loader__half--top { transform: translateY(-100%); }
.loader.is-acik .loader__half--bottom { transform: translateY(100%); }
.loader.is-bitti { display: none; }
/* WebGL varsa açılış, gerçek döküm efektidir: tuval perdenin üstüne çıkar,
   CSS dolum logosu gizlenir, alt yazı alta iner */
.loader--gl .loader__logo { visibility: hidden; }
.loader--gl .loader__note { position: absolute; left: 0; right: 0; bottom: 11vh; text-align: center; }
.hero__canvas.is-ustte { position: fixed; z-index: 101; }

/* ---------- Menü çubuğu ---------- */
.header {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 50;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 26px var(--gutter);
  pointer-events: none;
}
.header > * { pointer-events: auto; }
.header__logo, .nav__list > li, .header__tools > * { opacity: 0; transform: translateY(-14px); transition: opacity .9s var(--ease), transform 1s var(--ease); }
.is-ready .header__logo, .is-ready .nav__list > li, .is-ready .header__tools > * { opacity: 1; transform: none; }
.nav__list > li:nth-child(1) { transition-delay: .08s; }
.nav__list > li:nth-child(2) { transition-delay: .13s; }
.nav__list > li:nth-child(3) { transition-delay: .18s; }
.nav__list > li:nth-child(4) { transition-delay: .23s; }
.nav__list > li:nth-child(5) { transition-delay: .28s; }
.nav__list > li:nth-child(6) { transition-delay: .33s; }
.header__tools > * { transition-delay: .38s; }
/* Menü: hero'da üstten aşağı sönen lacivert filtre + beyaz logo ve yazılar;
   kaydırınca beyaz buzlu cam bar, renkli logo, koyu yazılar. */
.header::before {
  content: "";
  position: absolute;
  left: 0; right: 0; top: 0;
  height: 100%;
  z-index: -1;
  pointer-events: none;
  opacity: 0;
  transition: background .5s, height .5s var(--ease), top .5s var(--ease), box-shadow .5s;
}
.header { transition: padding .6s var(--ease), top .6s var(--ease), color .4s; color: #fff; text-shadow: 0 1px 10px rgba(8, 8, 40, .45); }
.header .nav__link { color: #fff; }
.header .nav__link:hover, .header .nav__link.is-active { color: #fff; }
.header.is-scrolled { padding-top: 14px; padding-bottom: 14px; color: #12132b; text-shadow: none; }
.header.is-scrolled::before { opacity: 1; top: 0; height: 100%; background: rgba(255, 255, 255, .9); -webkit-backdrop-filter: blur(18px) saturate(1.4); backdrop-filter: blur(18px) saturate(1.4); box-shadow: 0 1px 0 rgba(10, 10, 30, .08), 0 10px 30px -18px rgba(8, 10, 40, .35); }
.header.is-scrolled .nav__link { color: rgba(18, 19, 43, .78); }
.header.is-scrolled .nav__link:hover, .header.is-scrolled .nav__link.is-active { color: #12132b; }
.header.is-scrolled .dil button svg { box-shadow: 0 0 0 1px rgba(18, 19, 43, .15), 0 2px 8px rgba(0, 0, 0, .12); }
.menu-open .header { color: #fff; }
.menu-open .header::before { opacity: 0; }
.header__logo { position: relative; width: clamp(150px, 13vw, 210px); }
.header__logo .logo-renkli { position: absolute; left: 0; top: 0; opacity: 0; clip-path: inset(100% 0 0 0); transition: opacity .4s, clip-path .9s cubic-bezier(.65, 0, .35, 1); }
.header__logo .logo-beyaz { transition: opacity .4s; }
/* fareyle üzerine gelince logo alttan yukarı kendi renkleriyle dolar */
@media (hover: hover) { .header__logo:hover .logo-renkli { opacity: 1; clip-path: inset(0 0 0 0); } }
.header.is-scrolled .header__logo .logo-renkli { opacity: 1; clip-path: inset(0 0 0 0); }
.header.is-scrolled .header__logo .logo-beyaz { opacity: 0; }

.header__logo img { width: 100%; height: auto; }
.header__tools { display: flex; align-items: center; gap: 30px; }
.dil { display: inline-flex; align-items: center; gap: 10px; }
.dil button { position: relative; display: block; padding: 6px 2px; opacity: .8; transition: opacity .3s, transform .4s var(--ease); }
.dil button svg { display: block; width: 26px; height: 17px; border-radius: 3px; box-shadow: 0 0 0 1px rgba(255, 255, 255, .35), 0 2px 8px rgba(0, 0, 0, .3); }
.dil button:hover { opacity: 1; transform: translateY(-1px); }
.dil button.is-active { opacity: 1; }
.dil button.is-active::after { content: ""; position: absolute; left: 2px; right: 2px; bottom: -2px; height: 2px; border-radius: 2px; background: var(--red); }

.burger { position: relative; width: 36px; height: 24px; }
.burger span {
  position: absolute;
  left: 0; right: 0;
  height: 2px;
  background: currentColor;
  transition: transform .6s var(--ease), opacity .3s, top .6s var(--ease);
}
.burger span:nth-child(1) { top: 3px; }
.burger span:nth-child(2) { top: 11px; }
.burger span:nth-child(3) { top: 19px; }
.burger:hover span:nth-child(2) { transform: scaleX(.6); transform-origin: right; }
.menu-open .burger span:nth-child(1) { top: 11px; transform: rotate(45deg); }
.menu-open .burger span:nth-child(2) { opacity: 0; }
.menu-open .burger span:nth-child(3) { top: 11px; transform: rotate(-45deg); }

/* ---------- Şeffaf yatay menü (masaüstü) ---------- */
.nav { position: absolute; left: 50%; transform: translateX(-50%); }
.nav__list { display: flex; align-items: center; gap: clamp(18px, 2.4vw, 44px); margin: 0; padding: 0; list-style: none; }
.nav__link { white-space: nowrap; }
@media (max-width: 1280px) { .nav__list { gap: 18px; } .header__logo { width: 150px; } }
.nav__list > li { position: relative; }
.nav__link {
  position: relative;
  display: inline-flex;
  align-items: center;
  padding: 14px 0;
  font-size: 19px;
  font-weight: 700;
  color: rgba(255, 255, 255, .82);
  transition: color .3s;
}
.nav__link::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 6px;
  height: 2px;
  border-radius: 2px;
  background: var(--red);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform .5s var(--ease);
}
.nav__link:hover, .nav__link.is-active { color: var(--white); }
.nav__link:hover::after, .nav__link.is-active::after { transform: scaleX(1); transform-origin: left; }
.has-drop > .nav__link { padding-right: 15px; }
.has-drop > .nav__link::before {
  content: "";
  position: absolute;
  right: 0; top: 50%;
  width: 6px; height: 6px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: translateY(-70%) rotate(45deg);
}
.drop {
  position: absolute;
  top: 100%;
  left: -22px;
  min-width: 240px;
  padding: 14px 22px 16px;
  display: flex;
  flex-direction: column;
  background: rgba(10, 10, 14, .55);
  -webkit-backdrop-filter: blur(18px) saturate(1.3);
  backdrop-filter: blur(18px) saturate(1.3);
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 16px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: opacity .4s, transform .5s var(--ease), visibility .4s;
}
.has-drop:hover .drop, .has-drop:focus-within .drop { opacity: 1; visibility: visible; transform: none; }
.drop a { padding: 8px 0; font-size: 14px; font-weight: 500; color: rgba(255, 255, 255, .72); transition: color .3s, padding .4s var(--ease); }
.drop a:hover { color: var(--white); padding-left: 6px; }
.drop__label { margin: 8px 0 2px; font-size: 11px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--red); }
.drop__label:first-child { margin-top: 2px; }

/* ---------- Tam ekran menü ---------- */
.menu {
  position: fixed;
  inset: 0;
  z-index: 40;
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  align-items: center;
  gap: 60px;
  padding: 140px calc(var(--gutter) + 4vw) 60px;
  background: #050505;
  visibility: hidden;
  clip-path: circle(0 at calc(100% - var(--gutter) - 18px) 50px);
  transition: clip-path .9s var(--ease), visibility 0s .9s;
}
.menu-open .menu { visibility: visible; clip-path: circle(150% at calc(100% - var(--gutter) - 18px) 50px); transition: clip-path 1.1s var(--ease); }
.menu__nav { display: flex; flex-direction: column; }
.menu__link {
  display: block;
  overflow: hidden;
  font-size: clamp(34px, 5vw, 68px);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -.02em;
}
.menu__link span {
  display: inline-block;
  transform: translateY(105%);
  transition: transform .9s var(--ease), color .3s;
}
.menu-open .menu__link span { transform: none; }
.menu-open .menu__link:nth-child(2) span { transition-delay: .05s; }
.menu-open .menu__link:nth-child(3) span { transition-delay: .1s; }
.menu-open .menu__link:nth-child(4) span { transition-delay: .15s; }
.menu-open .menu__link:nth-child(5) span { transition-delay: .2s; }
.menu-open .menu__link:nth-child(6) span { transition-delay: .25s; }
.menu__link:hover span { color: var(--molten); }

.menu__side {
  display: flex;
  flex-direction: column;
  gap: 44px;
  opacity: 0;
  transform: translateY(20px);
  transition: opacity .6s, transform .8s var(--ease);
}
.menu-open .menu__side { opacity: 1; transform: none; transition-delay: .35s; }
.menu__block { display: flex; flex-direction: column; gap: 8px; font-size: 16px; color: var(--muted); }
.menu__block a { width: fit-content; transition: color .3s; }
.menu__block a:hover { color: var(--white); }
.menu__block p { line-height: 1.6; margin-top: 6px; }
.menu__label { font-size: 12px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--molten); margin-bottom: 6px; }
.menu__langs { display: flex; flex-wrap: wrap; gap: 18px; font-size: 13px; font-weight: 700; letter-spacing: .1em; }
.menu__langs .dil button svg { width: 34px; height: 22px; }

/* ---------- Hero ---------- */
.hero {
  position: relative;
  height: 100vh;
  height: 100svh;
  min-height: 560px;
  overflow: hidden;
  background: var(--black);
}
.hero__canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; z-index: 2; }

/* Logo oturunca arkada beliren fabrika videosu */
.hero__video {
  position: absolute;
  inset: 0;
}
.hero__video video { width: 100%; height: 100%; object-fit: cover; }
/* menünün okunması için üstten sönen lacivert filtre: videonun üstünde, yazıların ve logonun altında */
.hero__video::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 300px; pointer-events: none; background: linear-gradient(180deg, rgba(8, 8, 36, .95) 0%, rgba(8, 8, 36, .78) 38%, rgba(8, 8, 36, .32) 72%, rgba(8, 8, 36, 0) 100%); }
/* alttaki ürün göstergesi için de alttan yükselen lacivert filtre */
.hero__video::before { content: ""; position: absolute; left: 0; right: 0; bottom: 0; z-index: 1; height: 260px; pointer-events: none; background: linear-gradient(0deg, rgba(8, 8, 36, .9) 0%, rgba(8, 8, 36, .6) 45%, rgba(8, 8, 36, 0) 100%); }
.hero__video::after { z-index: 1; }
@media (max-width: 900px) { .hero__video::after { height: 190px; } }

/* Cam logo: logo şeklinde maskelenmiş buzlu cam; arkadaki videoyu bulanıklaştırır.
   Konumu ve görünürlüğü main.js ayarlar, renk/ışık WebGL katmanından gelir. */
.hero__glass {
  position: absolute;
  left: 0; top: 0;
  z-index: 1;
  opacity: 0;
  pointer-events: none;
  -webkit-backdrop-filter: blur(10px) saturate(1.25) brightness(1.15);
  backdrop-filter: blur(10px) saturate(1.25) brightness(1.15);
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}
.hero__fallback {
  display: block;
  position: absolute;
  right: 12%; top: 50%;
  height: 70%;
  width: auto;
  transform: translateY(-50%);
}
.gl-modu .hero__fallback { display: none; }

.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Slogan: firmanın üç işi, sırayla harf harf değişir (main.js: Slogan) */
.hero__text {
  position: absolute;
  left: calc(var(--gutter) + 46px);
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  width: min(46vw, 680px);
  text-shadow: 0 1px 3px rgba(0, 0, 0, .55), 0 2px 18px rgba(0, 0, 0, .45);
}
/* Yazının okunurluğu: yalnızca yazı bloğunun arkasında, kenarları sönen koyu lacivert hale */
.hero__text::before {
  content: "";
  position: absolute;
  left: -90px; right: -110px;
  top: -70px; bottom: -70px;
  z-index: -1;
  pointer-events: none;
  background: radial-gradient(closest-side, rgba(12, 12, 46, .62) 0%, rgba(12, 12, 46, .4) 55%, rgba(12, 12, 46, 0) 100%);
}
.hero__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .3em;
  text-transform: uppercase;
  color: var(--white);
  margin-bottom: 24px;
}
.hero__eyebrow::before { content: ""; width: 28px; height: 2px; border-radius: 2px; background: var(--red); }
.slogan {
  font-size: clamp(34px, 3.7vw, 60px);
  font-weight: 700;
  line-height: 1.08;
  letter-spacing: -.03em;
  min-height: 2.2em;
  margin-bottom: 22px;
}
/* üst/alt boşluk: Türkçe işaretler (Ü, ğ, ş, ç) kesilmesin */
.s-satir { display: block; overflow: hidden; white-space: nowrap; padding: .14em 0 .26em; margin: -.14em 0 -.26em; }
.s-satir--ham { color: var(--white); }
.s-kelime { display: inline-block; white-space: nowrap; }
.s-harf { display: inline-block; transform: translateY(118%); transition: transform .9s var(--ease); }
.s-harf.is-in { transform: none; }
.s-harf.is-out { transform: translateY(-118%); transition: transform .5s cubic-bezier(.7, 0, .84, 0); }
.slogan-alt {
  max-width: 480px;
  min-height: 3.4em;
  font-size: clamp(15px, 1.1vw, 17px);
  font-weight: 500;
  line-height: 1.7;
  color: rgba(255, 255, 255, .82);
  transition: opacity .5s, transform .6s var(--ease);
}
.slogan-alt.is-out { opacity: 0; transform: translateY(8px); }
.hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.pill {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  height: 54px;
  padding: 0 28px;
  border-radius: 60px;
  font-size: 15px;
  font-weight: 700;
  overflow: hidden;
  isolation: isolate;
  transition: color .4s, background .4s, border-color .4s, transform .5s var(--ease);
}
.pill:hover { transform: translateY(-2px); }
.pill--solid { background: var(--white); color: #0a0a0f; }
.pill--solid::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(90deg, #2f2d84, #e1262c);
  transform: translateX(-101%);
  transition: transform .6s var(--ease);
}
.pill--solid:hover { color: var(--white); }
.pill--solid:hover::before { transform: none; }
.pill__arrow { position: relative; width: 16px; height: 2px; border-radius: 2px; background: currentColor; transition: width .4s var(--ease); }
.pill__arrow::after {
  content: "";
  position: absolute;
  right: 0; top: -3px;
  width: 8px; height: 8px;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
  transform: rotate(45deg);
}
.pill:hover .pill__arrow { width: 24px; }
.pill--glass {
  color: var(--white);
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(255, 255, 255, .22);
  -webkit-backdrop-filter: blur(14px) saturate(1.4);
  backdrop-filter: blur(14px) saturate(1.4);
}
.pill--glass:hover { background: rgba(255, 255, 255, .16); border-color: rgba(255, 255, 255, .4); }
.hero__eyebrow, .slogan-alt, .hero__actions { transform: translateY(16px); transition: opacity .5s, transform 1.2s var(--ease); }
.slogan-alt { transition-delay: .35s; }
.hero__actions { transition-delay: .5s; }
.is-ready .hero__eyebrow, .is-ready .slogan-alt, .is-ready .hero__actions { transform: none; }
.is-ready .slogan-alt.is-out { opacity: 0; transform: translateY(8px); transition-delay: 0s; }

/* Slayt göstergeleri: aktif olanın çubuğu süre boyunca dolar */
.slayt-nav {
  position: absolute;
  left: calc(var(--gutter) + 46px);
  bottom: 62px;
  z-index: 3;
  display: flex;
  gap: 26px;
  opacity: 0;
  transition: opacity 1.2s .8s;
}
.is-ready .slayt-nav { opacity: 1; }
.slayt-nav button {
  display: flex;
  align-items: baseline;
  gap: 10px;
  width: 170px;
  padding: 16px 0 0;
  position: relative;
  text-align: left;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .78);
  text-shadow: 0 1px 10px rgba(0, 0, 0, .5);
  transition: color .4s;
}
.slayt-nav button:hover, .slayt-nav button.is-active { color: var(--white); }
.slayt-nav b { color: var(--red); font-weight: 800; }
.slayt-nav i { position: absolute; left: 0; right: 0; top: 0; height: 2px; border-radius: 2px; background: rgba(255, 255, 255, .35); overflow: hidden; }
.slayt-nav i span { position: absolute; inset: 0; background: var(--white); transform: scaleX(0); transform-origin: left; }
.slayt-nav button.is-active i span { animation: slayt-dolum var(--sure, 6.5s) linear forwards; }
.slayt-nav.is-durdu button.is-active i span { animation-play-state: paused; }
@keyframes slayt-dolum { to { transform: scaleX(1); } }



/* Çerçeve: kenardan içeride ince hat, sol kenarda dikey yazı */
.cerceve {
  position: absolute;
  inset: 22px;
  z-index: 3;
  pointer-events: none;
  border: 1px solid rgba(255, 255, 255, .16);
  opacity: 0;
  transform: scale(1.015);
  transition: opacity 1.4s var(--ease), transform 1.6s var(--ease);
}
.is-ready .cerceve { opacity: 1; transform: none; }
.cerceve__yan {
  position: absolute;
  left: -1px; top: 50%;
  padding: 0 14px;
  transform: translate(-50%, -50%) rotate(-90deg);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .34em;
  text-transform: uppercase;
  white-space: nowrap;
  color: rgba(255, 255, 255, .7);
  text-shadow: 0 1px 8px rgba(0, 0, 0, .5);
}
.v-cerceve .header { padding-left: calc(var(--gutter) + 22px); padding-right: calc(var(--gutter) + 22px); top: 22px; }
.v-cerceve .header.is-scrolled { top: 0; }

/* =========================================================
   Hero altı bölümler — bir açık, bir koyu; düz geçişler
   ========================================================= */
.kap { width: 100%; max-width: 1320px; margin: 0 auto; padding: 0 var(--gutter); }
.bolum {
  position: relative;
  z-index: 4;
  padding: 50px 0;
  background: #07080d;
  color: #fff;
  content-visibility: auto;
  contain-intrinsic-size: auto 900px;
}
.bolum--acik { --yazi: #12132b; --soluk: rgba(18, 19, 43, .68); background: #f4f3ef; color: var(--yazi); }
.etiket {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 22px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .7);
}
.etiket::before { content: ""; width: 28px; height: 2px; border-radius: 2px; background: var(--red); }
.bolum--acik .etiket { color: rgba(18, 19, 43, .7); }
.bb { font-size: clamp(34px, 4.4vw, 64px); font-weight: 700; line-height: 1.06; letter-spacing: -.035em; }
.bolum__bas { max-width: 760px; margin-bottom: 50px; }
/* iki sütunlu bölüm başlığı: sağdaki paragraf etiketin hizasından başlar, başlığın üstüne taşmaz */
.bolum__bas--satir { max-width: none; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); align-items: start; gap: 24px clamp(32px, 5vw, 80px); }
.bolum__bas--satir .bolum__acik { max-width: 520px; margin-top: 0; padding-top: 6px; justify-self: end; }
.bolum__acik { margin-top: 22px; font-size: clamp(15px, 1.15vw, 18px); line-height: 1.75; color: rgba(255, 255, 255, .66); }
.bolum--acik .bolum__acik { color: var(--soluk); }

/* görünür olunca belir (gecikme: --g) */
[data-gor] { opacity: 0; transform: translateY(34px); transition: opacity 1s var(--ease) var(--g, 0s), transform 1.2s var(--ease) var(--g, 0s); }
[data-gor].gorundu { opacity: 1; transform: none; }
/* başlıklar kelime kelime, maskeli yükselir */
.bb[data-gor] { opacity: 1; transform: none; }
/* tedarik bloğu görünmezken başlamaz: kaydırırken önceden çizilsin, dolum takılmasın (içindeki maddeler yine sırayla belirir) */
.akis[data-gor] { opacity: 1; transform: none; }
.km { display: inline-block; overflow: hidden; vertical-align: top; padding: .1em .02em .2em 0; margin: -.1em 0 -.2em; }
.km > span { display: inline-block; transform: translateY(112%); transition: transform 1.1s var(--ease); }
.gorundu .km > span { transform: none; }

/* ---------- Kurumsal: 1959'dan bugüne ----------
   Tarihçe kartları kaydırdıkça üst üste biner (sticky). Arkada kalan kart küçülüp kararır (--s, main.js);
   öne gelen kartın yılı alttan erimiş metalle dolar (.dolu). */
.kurumsal { content-visibility: visible; }
.kurumsal { padding-top: 50px; }
.bolum--acik .pill--glass { color: var(--yazi); background: #fff; border-color: rgba(18, 19, 43, .14); -webkit-backdrop-filter: none; backdrop-filter: none; }
.bolum--acik .pill--glass:hover { background: var(--yazi); color: #fff; border-color: var(--yazi); }
.bolum--acik .pill--solid { background: var(--yazi); color: #fff; }

/* ---------- Ürettiklerimiz: katmanlı 3B vitrin kartları ----------
   Zeminde ince ızgara + alttan nefes alan erimiş ufuk; kartlarda fareyi izleyen dev sembol (--px/--py, main.js tilt) */
.urunler { position: relative; overflow: hidden; }
.urunler::before { content: ""; position: absolute; inset: 0; pointer-events: none; background-image: repeating-radial-gradient(circle at 78% 112%, rgba(255, 255, 255, .055) 0 1px, transparent 1px 44px); -webkit-mask-image: radial-gradient(ellipse 80% 70% at 50% 60%, #000 20%, transparent 100%); mask-image: radial-gradient(ellipse 80% 70% at 50% 60%, #000 20%, transparent 100%); }
.urunler::after { content: ""; position: absolute; left: 50%; bottom: -30%; width: 120%; height: 70%; transform: translateX(-50%); pointer-events: none; background: radial-gradient(ellipse at 50% 100%, rgba(225, 38, 44, .28) 0%, rgba(79, 76, 214, .16) 38%, transparent 68%); animation: ufuk 9s ease-in-out infinite; }
@keyframes ufuk { 0%, 100% { opacity: .7; transform: translateX(-50%) scaleX(1); } 50% { opacity: 1; transform: translateX(-50%) scaleX(1.12); } }
.urunler > .kap { position: relative; z-index: 1; }
.urun-izgara { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; perspective: 1400px; }
.urun {
  position: relative;
  display: flex;
  flex-direction: column;
  border-radius: 30px;
  overflow: hidden;
  isolation: isolate;
  background: linear-gradient(180deg, #11131f, #0b0c15);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .07), 0 40px 80px -50px rgba(0, 0, 0, .9);
  clip-path: inset(22% 0 0 0 round 30px);
  transition: transform .5s var(--ease), box-shadow .6s, opacity 1s var(--ease) var(--g, 0s), clip-path 1.5s var(--ease) var(--g, 0s);
}
.urun.gorundu { clip-path: inset(0 round 30px); }
.urun:hover { box-shadow: 0 0 0 1px rgba(255, 140, 110, .45), 0 60px 100px -50px rgba(225, 38, 44, .6); }
/* fareyi izleyen sıcak ışık */
.urun::before { content: ""; position: absolute; inset: 0; z-index: 3; pointer-events: none; background: radial-gradient(360px circle at var(--mx, 50%) var(--my, 30%), rgba(255, 150, 110, .14), transparent 55%); opacity: 0; transition: opacity .4s; }
.urun:hover::before { opacity: 1; }
.urun__sahne { position: relative; height: clamp(230px, 20vw, 300px); overflow: hidden; }
.urun__gorsel { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: var(--op, 50% 50%); transform: translate(calc(var(--px, 0) * 10px), calc(var(--py, 0) * 8px)) scale(1.12); filter: saturate(.8) contrast(1.05) brightness(.9); transition: filter .6s, transform .25s; -webkit-mask-image: linear-gradient(180deg, #000 60%, transparent 100%); mask-image: linear-gradient(180deg, #000 60%, transparent 100%); }
.urun:hover .urun__gorsel { filter: saturate(1) contrast(1.05) brightness(1); }
.urun__dev { position: absolute; right: -.06em; top: -.12em; z-index: 1; font-size: clamp(110px, 10.5vw, 150px); font-weight: 800; line-height: 1; letter-spacing: -.06em; color: transparent; -webkit-text-stroke: 1.5px rgba(255, 255, 255, .22); transform: translate(calc(var(--px, 0) * -26px), calc(var(--py, 0) * -20px)); transition: transform .25s, -webkit-text-stroke .5s; pointer-events: none; }
.urun:hover .urun__dev { -webkit-text-stroke: 1.5px rgba(255, 170, 130, .7); }
.urun__no { position: absolute; left: 20px; top: 20px; z-index: 2; padding: 7px 12px; border-radius: 40px; font-size: 12px; font-weight: 800; letter-spacing: .14em; color: #fff; background: rgba(225, 38, 44, .9); }
.urun__sembol { position: absolute; left: 20px; bottom: 16px; z-index: 2; padding: 8px 14px; border-radius: 40px; font-size: 15px; font-weight: 800; color: #fff; background: rgba(7, 8, 13, .55); border: 1px solid rgba(255, 255, 255, .25); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
/* parıltı süpürmesi */
.urun__sahne::after { content: ""; position: absolute; top: 0; bottom: 0; left: -60%; width: 40%; z-index: 2; pointer-events: none; background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .28), transparent); transform: skewX(-18deg); transition: left 1.1s var(--ease); }
.urun:hover .urun__sahne::after { left: 130%; }
.urun__icerik { position: relative; z-index: 2; display: flex; flex-direction: column; gap: 12px; flex: 1; padding: 8px 26px 26px; }
.urun h3 { font-size: clamp(26px, 2.2vw, 32px); font-weight: 700; letter-spacing: -.02em; }
.urun p { font-size: 14.5px; line-height: 1.65; color: rgba(255, 255, 255, .72); }
.urun__ozellik { margin: 6px 0 4px; border-top: 1px solid rgba(255, 255, 255, .1); }
.urun__ozellik div { display: grid; grid-template-columns: 76px 1fr; gap: 12px; padding: 10px 0; border-bottom: 1px solid rgba(255, 255, 255, .07); font-size: 13px; line-height: 1.45; }
.urun__ozellik dt { font-size: 10.5px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: rgba(255, 255, 255, .42); padding-top: 2px; }
.urun__ozellik dd { margin: 0; font-weight: 600; color: rgba(255, 255, 255, .9); }
.urun__link { display: inline-flex; align-items: center; gap: 10px; margin-top: auto; padding-top: 6px; font-size: 12px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #fff; }
.urun__link .pill__arrow { width: 18px; }
.urun:hover .urun__link { color: #ffb27a; }
.urun:hover .urun__link .pill__arrow { width: 30px; }

/* ---------- Kalite: laboratuvar paneli ----------
   Solda ilkeler, iki laboratuvar, üç yöntem (cihaz kartları) ve belgeler; sağda teknik föy cihaz ekranı:
   altı saflık derecesi (eski site tablosu), saflık göstergesi ve safsızlık çubukları (main.js) */
.lab { display: grid; grid-template-columns: 1fr 1.05fr; gap: clamp(32px, 4.5vw, 72px); align-items: start; }
.ilkeler-serit { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 22px; }
.ilkeler-serit li { padding: 8px 14px; border-radius: 60px; font-size: 11.5px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--yazi); border: 1px solid rgba(18, 19, 43, .16); background: rgba(255, 255, 255, .5); }
.labs { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 12px; }
.labkart { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 20px 22px; border-radius: 22px; background: #12132b; color: #fff; overflow: hidden; isolation: isolate; }
.labkart::after { content: ""; position: absolute; right: -30px; top: -30px; width: 120px; height: 120px; border-radius: 50%; background: radial-gradient(circle, rgba(225, 38, 44, .45), transparent 70%); }
.labkart b { font-size: 34px; font-weight: 800; letter-spacing: -.04em; line-height: 1; color: transparent; background: linear-gradient(100deg, #ffb27a, #ff6d2a 45%, #e1262c); -webkit-background-clip: text; background-clip: text; }
.labkart span { font-size: 13.5px; line-height: 1.45; color: rgba(255, 255, 255, .78); }
.cihazlar { display: grid; gap: 10px; }
.cihaz { position: relative; display: grid; grid-template-columns: 44px 1fr; gap: 4px 16px; padding: 18px 20px; border-radius: 22px; background: #fff; border: 1px solid rgba(18, 19, 43, .08); box-shadow: 0 16px 36px -30px rgba(18, 19, 43, .5); overflow: hidden; isolation: isolate; transition: transform .5s var(--ease), box-shadow .5s, border-color .5s, opacity 1s var(--ease) var(--g, 0s); }
.cihaz:hover { transform: translateX(6px); border-color: rgba(225, 38, 44, .35); box-shadow: 0 24px 46px -28px rgba(225, 38, 44, .5); }
.cihaz__no { grid-row: span 3; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 14px; font-size: 12px; font-weight: 800; letter-spacing: .1em; color: #c8161d; background: rgba(225, 38, 44, .1); }
.cihaz h3 { font-size: 17px; font-weight: 700; letter-spacing: -.01em; }
.cihaz p { font-size: 13px; line-height: 1.5; color: var(--soluk); }
.elementler { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 6px; }
.elementler li { padding: 3px 8px; border-radius: 8px; font-size: 11px; font-weight: 800; color: rgba(18, 19, 43, .6); background: rgba(18, 19, 43, .06); transition: background .3s, color .3s, transform .4s var(--ease); }
.cihaz:hover .elementler li { color: #fff; background: #12132b; }
.cihaz:hover .elementler li:nth-child(3n+1) { background: var(--red); }
.muhurler { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-top: 28px; }
.belge { position: relative; display: grid; grid-template-columns: 64px 1fr; align-items: center; gap: 16px; width: 100%; height: 100%; padding: 14px 44px 14px 14px; border-radius: 22px; text-align: left; background: #fff; border: 1px solid rgba(18, 19, 43, .08); box-shadow: 0 16px 36px -30px rgba(18, 19, 43, .5); transition: transform .5s var(--ease), box-shadow .5s, border-color .5s; }
.belge:hover { transform: translateY(-4px); border-color: rgba(225, 38, 44, .35); box-shadow: 0 26px 46px -28px rgba(225, 38, 44, .5); }
.belge > span, .belge > small { grid-column: 2; }
.belge > span { align-self: end; font-size: 15px; font-weight: 700; line-height: 1.25; }
.belge > small { align-self: start; font-size: 12.5px; line-height: 1.4; color: var(--soluk); }
.belge__ok { position: absolute; right: 18px; top: 50%; width: 14px; height: 2px; border-radius: 2px; background: #c8161d; transform: translateY(-50%); opacity: .35; transition: opacity .3s, width .4s var(--ease); }
.belge__ok::after { content: ""; position: absolute; right: 0; top: 50%; width: 7px; height: 7px; border-top: 2px solid #c8161d; border-right: 2px solid #c8161d; transform: translateY(-50%) rotate(45deg); }
.belge:hover .belge__ok { opacity: 1; width: 22px; }
.muhur { grid-row: span 2; position: relative; width: 64px; height: 84px; border-radius: 10px; overflow: hidden; background: #fff; box-shadow: 0 0 0 1px rgba(18, 19, 43, .1), 0 10px 20px -12px rgba(18, 19, 43, .45); transform: rotate(-4deg); transition: transform .5s var(--ease); }
.belge:hover .muhur { transform: rotate(0) scale(1.06); }
.muhur img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: top; }


.rapor { position: relative; display: flex; flex-direction: column; padding: clamp(22px, 2.4vw, 32px); border-radius: 30px; overflow: hidden; isolation: isolate; background: radial-gradient(ellipse at 100% 0%, rgba(79, 76, 214, .35), transparent 50%), linear-gradient(160deg, #11132a, #0a0b14); color: #fff; box-shadow: 0 50px 90px -50px rgba(18, 19, 43, .7), inset 0 1px 0 rgba(255, 255, 255, .08); transition: transform .5s var(--ease), opacity 1s var(--ease), box-shadow .5s; }
.rapor::before { content: ""; position: absolute; inset: 0; pointer-events: none; background-image: repeating-linear-gradient(180deg, rgba(255, 255, 255, .04) 0 1px, transparent 1px 7px); -webkit-mask-image: linear-gradient(180deg, #000, transparent 85%); mask-image: linear-gradient(180deg, #000, transparent 85%); }
.rapor__ust { position: relative; display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; }
.rapor__etiket { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; font-size: 11px; font-weight: 800; letter-spacing: .24em; text-transform: uppercase; color: rgba(255, 255, 255, .5); }
.rapor__etiket::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #ff6a6e; box-shadow: 0 0 0 3px rgba(225, 38, 44, .3); animation: nokta-yan 2s ease-in-out infinite; }
@keyframes nokta-yan { 50% { opacity: .35; } }
.rapor__ust strong { font-size: 22px; font-weight: 700; letter-spacing: -.02em; }
.rapor__kod { font-size: 34px; font-weight: 800; letter-spacing: -.04em; color: transparent; -webkit-text-stroke: 1px rgba(255, 255, 255, .5); }
.derece { position: relative; display: flex; gap: 6px; margin: 18px 0 20px; padding: 5px; border-radius: 60px; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .08); }
.derece__btn { flex: 1; padding: 9px 4px; border-radius: 60px; font-size: 12.5px; font-weight: 800; letter-spacing: .02em; color: rgba(255, 255, 255, .6); transition: color .3s, background .4s, box-shadow .4s; font-variant-numeric: tabular-nums; }
.derece__btn:hover { color: #fff; }
.derece__btn.is-active { color: #fff; background: linear-gradient(135deg, #e1262c, #ff7a3d); box-shadow: 0 8px 22px -10px rgba(225, 38, 44, .8); }
.rapor__govde { position: relative; display: grid; grid-template-columns: 168px 1fr; gap: 22px; align-items: center; }
.olcek { position: relative; display: grid; place-items: center; width: 168px; aspect-ratio: 1; }
.olcek svg { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); }
.olcek circle { fill: none; stroke-width: 9; }
.olcek__iz { stroke: rgba(255, 255, 255, .1); }
.olcek__dolu { stroke: url(#olcek-g); stroke: #ff6a3a; stroke-linecap: round; stroke-dasharray: 100; stroke-dashoffset: 100; transition: stroke-dashoffset 1.6s var(--ease); }
.rapor.gorundu .olcek__dolu { stroke-dashoffset: var(--bos, .5); }
.olcek__deger { display: flex; align-items: baseline; gap: 2px; font-size: 38px; font-weight: 800; letter-spacing: -.05em; line-height: 1; font-variant-numeric: tabular-nums; }
.olcek__deger small { font-size: 16px; font-weight: 700; color: #ffb27a; }
.olcek__ad { position: absolute; bottom: 30px; font-size: 10.5px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: rgba(255, 255, 255, .5); }
.rapor__liste li { display: grid; grid-template-columns: 38px 86px 1fr 78px; gap: 12px; align-items: center; padding: 9px 0; border-bottom: 1px solid rgba(255, 255, 255, .06); }
.rapor__liste li:last-child { border-bottom: 0; }
.rapor .el { display: grid; place-items: center; width: 38px; height: 30px; border-radius: 9px; font-size: 13px; font-weight: 800; background: rgba(255, 255, 255, .08); }
.rapor .ad { font-size: 13px; color: rgba(255, 255, 255, .55); }
.cubuk { height: 6px; border-radius: 6px; background: rgba(255, 255, 255, .08); overflow: hidden; }
.cubuk i { display: block; height: 100%; width: var(--w, 0%); border-radius: 6px; background: linear-gradient(90deg, #4f4cd6, var(--red)); transform: scaleX(0); transform-origin: left; transition: transform 1.2s var(--ease), width .9s var(--ease); }
.rapor.gorundu .cubuk i { transform: scaleX(1); }
.rapor__liste li:nth-child(2) .cubuk i { transition-delay: .08s; }
.rapor__liste li:nth-child(3) .cubuk i { transition-delay: .16s; }
.rapor__liste li:nth-child(4) .cubuk i { transition-delay: .24s; }
.rapor__liste li:nth-child(5) .cubuk i { transition-delay: .32s; }
.rapor__liste li:nth-child(6) .cubuk i { transition-delay: .4s; }
.deger { text-align: right; font-size: 13px; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.rapor__not { position: relative; margin-top: 18px; padding-top: 14px; border-top: 1px solid rgba(255, 255, 255, .08); font-size: 12px; line-height: 1.6; color: rgba(255, 255, 255, .45); }

/* ---------- Üretim döngümüz: kaydırdıkça çizilen yol (logo renkleri) ---------- */
.dongu { overflow: hidden; background: radial-gradient(ellipse at 20% 0%, rgba(47, 45, 132, .25), transparent 55%), #07080d; }
/* ---------- Üretim döngüsü: üretim hattı sahnesi ----------
   Büyük panelde aşama fotoğrafı + girdi → çıktı; altta erimiş metalin aktığı boru ve 4 istasyon (main.js hatKur) */
.hat { --sure: 6s; }
.hat__sahne { position: relative; height: clamp(440px, 40vw, 560px); border-radius: 32px 32px 0 0; overflow: hidden; isolation: isolate; background: #0d0f18; }
.hat__foto { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.06); transition: opacity .6s ease, transform 1.2s var(--ease); }
.hat__foto.is-aktif { opacity: 1; transform: none; }
.hat__karart { position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, rgba(7, 8, 13, .7) 0%, rgba(7, 8, 13, .42) 34%, rgba(7, 8, 13, 0) 60%), linear-gradient(0deg, rgba(7, 8, 13, .45), transparent 32%); }
.hat__icerik { text-shadow: 0 2px 14px rgba(7, 8, 13, .75), 0 1px 3px rgba(7, 8, 13, .6); }
.hat__icerik { position: absolute; left: clamp(26px, 4vw, 64px); top: 50%; z-index: 2; width: min(560px, 52%); transform: translateY(-50%); pointer-events: none; }
.hat__icerik > * { opacity: 0; transform: translateY(22px); transition: opacity .5s, transform .7s var(--ease); }
.hat__icerik.is-aktif { pointer-events: auto; }
.hat__icerik.is-aktif > * { opacity: 1; transform: none; transition: opacity .5s .08s, transform .7s var(--ease) .08s; }
.hat__icerik.is-aktif > :nth-child(2) { transition-delay: .13s; }
.hat__icerik.is-aktif > :nth-child(3) { transition-delay: .18s; }
.hat__icerik.is-aktif > :nth-child(4) { transition-delay: .23s; }
.hat__dev { display: block; margin-bottom: -.12em; font-size: clamp(90px, 10vw, 150px); font-weight: 800; line-height: 1; letter-spacing: -.06em; color: transparent; -webkit-text-stroke: 1.5px rgba(255, 140, 100, .55); }
.hat__icerik h3 { margin-bottom: 14px; font-size: clamp(30px, 3.2vw, 46px); font-weight: 700; letter-spacing: -.035em; line-height: 1.05; }
.hat__icerik p { max-width: 470px; font-size: 15.5px; line-height: 1.7; color: rgba(255, 255, 255, .78); }
.donusum { display: flex; align-items: center; gap: 14px; margin-top: 26px; }
.donusum__grup { display: flex; flex-direction: column; gap: 6px; }
.donusum__grup li { padding: 9px 14px; border-radius: 12px; font-size: 13px; font-weight: 700; white-space: nowrap; }
.donusum__grup--girdi li { color: rgba(255, 255, 255, .85); background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .14); }
.donusum__grup--cikti li { color: #fff; background: linear-gradient(135deg, rgba(225, 38, 44, .9), rgba(255, 122, 61, .85)); box-shadow: 0 10px 24px -12px rgba(225, 38, 44, .8); }
.donusum__ok { position: relative; flex: none; width: 64px; height: 4px; border-radius: 4px; background: rgba(255, 255, 255, .12); overflow: hidden; }
.donusum__ok::after { content: ""; position: absolute; right: -1px; top: 50%; width: 9px; height: 9px; margin-top: -4.5px; border-top: 2px solid #ffb27a; border-right: 2px solid #ffb27a; transform: rotate(45deg); }
.donusum__ok i { position: absolute; top: 0; bottom: 0; width: 26px; border-radius: 4px; background: linear-gradient(90deg, transparent, #ffb27a, #fff3e2); animation: ok-ak 1.3s linear infinite; }
@keyframes ok-ak { from { left: -26px; } to { left: 64px; } }
@keyframes ok-ak-dik { from { top: -12px; } to { top: 26px; } }
.hat__boru { position: relative; padding: 26px clamp(18px, 3vw, 40px) 24px; border-radius: 0 0 32px 32px; background: linear-gradient(180deg, #11132a, #0b0c18); border: 1px solid rgba(255, 255, 255, .06); border-top: 0; }
.hat__boru-iz { position: absolute; left: calc(clamp(18px, 3vw, 40px) + 12.5% - 10px); right: calc(clamp(18px, 3vw, 40px) + 12.5% - 10px); top: 52px; height: 6px; border-radius: 6px; background: rgba(255, 255, 255, .08); overflow: hidden; }
.hat__boru-dolu { position: absolute; inset: 0; border-radius: 6px; background: linear-gradient(90deg, #4f4cd6, #e1262c 55%, #ff7a3d 85%, #ffd0a8); transform-origin: left; transform: scaleX(var(--hat, 0)); transition: transform .9s var(--ease); }
.hat__boru-dolu::after { content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 60px; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .7), transparent); animation: boru-ak 2.4s linear infinite; }
@keyframes boru-ak { from { transform: translateX(-60px); } to { transform: translateX(1300px); } }
.istasyonlar { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); }
.istasyon { display: flex; flex-direction: column; align-items: center; gap: 10px; width: 100%; padding: 0 6px; text-align: center; color: rgba(255, 255, 255, .55); transition: color .4s; }
.istasyon__ikon { position: relative; display: block; }
.istasyon__ikon > svg:not(.istasyon__sure) { width: 58px; height: 58px; padding: 15px; border-radius: 50%; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; background: #12142c; border: 1px solid rgba(255, 255, 255, .14); transition: background .5s, border-color .5s, box-shadow .5s, transform .6s var(--ease); }
.istasyon b { font-size: 11px; font-weight: 800; letter-spacing: .16em; color: rgba(255, 255, 255, .35); transition: color .4s; }
.istasyon span { margin-top: -6px; font-size: 14px; font-weight: 700; }
.istasyon:hover { color: #fff; }
.istasyon:hover .istasyon__ikon > svg:not(.istasyon__sure) { transform: translateY(-3px); border-color: rgba(255, 140, 100, .5); }
.istasyon.is-gecti { color: rgba(255, 255, 255, .8); }
.istasyon.is-gecti .istasyon__ikon > svg:not(.istasyon__sure) { border-color: rgba(225, 38, 44, .55); background: #1b1530; }
.istasyon.is-aktif { color: #fff; }
.istasyon.is-aktif .istasyon__ikon > svg:not(.istasyon__sure) { color: #fff; background: radial-gradient(circle at 50% 70%, #ff7a3d, #e1262c 60%, #a8121a); border-color: transparent; box-shadow: 0 0 0 6px rgba(225, 38, 44, .18), 0 14px 30px -10px rgba(225, 38, 44, .9); transform: scale(1.08); }
.istasyon.is-aktif b { color: #ff8a6e; }
/* aktif istasyonun çevresinde dolan süre halkası */
.istasyon__sure { position: absolute; left: -7px; top: -7px; width: calc(100% + 14px); height: calc(100% + 14px); transform: rotate(-90deg); pointer-events: none; opacity: 0; }
.istasyon__sure circle { fill: none; stroke: #ffb27a; stroke-width: 2.5; stroke-linecap: round; stroke-dasharray: 100; stroke-dashoffset: 100; }
.istasyon.is-aktif .istasyon__sure { opacity: 1; animation: istasyon-sure var(--sure, 4s) linear forwards; }
.istasyon.is-aktif .istasyon__sure circle { animation: istasyon-sure-c var(--sure, 4s) linear forwards; }
@keyframes istasyon-sure { to { opacity: 1; } }
@keyframes istasyon-sure-c { to { stroke-dashoffset: 0; } }
.hat.is-durdu .istasyon__sure, .hat.is-durdu .istasyon__sure circle { animation-play-state: paused; }
.hat.is-tutuldu 
/* ---------- Tedarik & Ticaret ---------- */
/* ---------- Tedarik: akış sahnesi ----------
   Solda alınan hammaddeler, ortada parlayan pota (Saha), sağda ticareti yapılanlar; hatlar main.js'te çizilir, ışık akar */
.tedarik { position: relative; overflow: hidden; content-visibility: visible; }   /* ekrana gelince ilk çizim yükü dökümle çakışmasın */
.tedarik::before { content: ""; position: absolute; inset: 0; pointer-events: none; background-image: repeating-radial-gradient(circle at 50% 118%, rgba(18, 19, 43, .1) 0 1px, transparent 1px 40px); -webkit-mask-image: radial-gradient(ellipse 70% 70% at 50% 55%, #000 10%, transparent 100%); mask-image: radial-gradient(ellipse 70% 70% at 50% 55%, #000 10%, transparent 100%); }
.tedarik > .kap { position: relative; z-index: 1; }
.akis { position: relative; display: grid; grid-template-columns: 1fr 300px 1fr; gap: clamp(28px, 4vw, 64px); align-items: center; }
.akis__hat { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; pointer-events: none; overflow: visible; }
.akis__hat path { fill: none; stroke: rgba(18, 19, 43, .14); stroke-width: 1.5; }
.akis__top { position: absolute; left: 0; top: 0; z-index: 0; width: 14px; height: 14px; margin: -7px 0 0 -7px; border-radius: 50%; pointer-events: none; background: radial-gradient(circle, #fff 0 18%, rgba(255, 120, 80, .9) 32%, rgba(225, 38, 44, 0) 70%); offset-rotate: 0deg; animation: akis-ak 3.2s linear infinite; }
@keyframes akis-ak { from { offset-distance: 0%; opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } to { offset-distance: 100%; opacity: 0; } }
.akis__hat path.is-aktif { stroke: rgba(225, 38, 44, .55); stroke-width: 2; }
.akis__sutun { position: relative; z-index: 1; }
.akis__baslik { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 14px; font-size: 12px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; }
.akis__baslik em { font-style: normal; color: #c8161d; }
.akis__liste { display: flex; flex-direction: column; gap: 8px; }
.akis__oge { display: flex; align-items: center; gap: 14px; padding: 11px 14px 11px 11px; border-radius: 60px; background: #fff; border: 1px solid rgba(18, 19, 43, .08); box-shadow: 0 10px 26px -20px rgba(18, 19, 43, .5); cursor: default; opacity: 0; transform: translateX(-18px); transition: opacity .8s var(--ease) var(--g, 0s), transform .9s var(--ease) var(--g, 0s), border-color .4s, box-shadow .4s; }
.akis__sutun--cikis .akis__oge { transform: translateX(18px); }
.akis.gorundu .akis__oge { opacity: 1; transform: none; }
.akis__oge b { flex: none; display: grid; place-items: center; min-width: 44px; height: 44px; padding: 0 9px; border-radius: 50px; font-size: 13px; font-weight: 800; letter-spacing: -.01em; color: #12132b; background: linear-gradient(160deg, #f1f0fb, #e4e3f3); border: 1px solid rgba(47, 45, 132, .18); transition: color .4s, background .4s, transform .5s var(--ease); }
.akis__oge span { font-size: 14.5px; font-weight: 600; line-height: 1.3; }
.akis__oge:hover, .akis__oge.is-aktif { border-color: rgba(225, 38, 44, .45); box-shadow: 0 18px 36px -22px rgba(225, 38, 44, .5); }
.akis__oge:hover b, .akis__oge.is-aktif b { color: #fff; background: linear-gradient(135deg, #e1262c, #ff7a3d); transform: rotate(-8deg) scale(1.06); }
.akis__cekirdek { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 18px; }
.pota { position: relative; width: 230px; height: 230px; border-radius: 50%; display: grid; place-items: center; background: radial-gradient(circle at 50% 85%, rgba(255, 150, 90, .22), transparent 55%), radial-gradient(circle at 30% 20%, #fff, #f3f2f8 60%, #e9e8f1); box-shadow: 0 40px 80px -36px rgba(225, 38, 44, .45), 0 0 0 1px rgba(18, 19, 43, .08), inset 0 -24px 50px -30px rgba(255, 120, 60, .35), inset 0 1px 0 #fff; }
.pota::before { content: ""; position: absolute; inset: 14px; border-radius: 50%; border: 1px dashed rgba(47, 45, 132, .3); animation: pota-don 28s linear infinite; }
.pota__donen { position: absolute; inset: -10px; border-radius: 50%; background: conic-gradient(from 0deg, transparent 0 70%, rgba(255, 140, 90, .9) 85%, transparent 100%); -webkit-mask: radial-gradient(circle, transparent 118px, #000 119px, #000 121px, transparent 122px); mask: radial-gradient(circle, transparent 118px, #000 119px, #000 121px, transparent 122px); animation: pota-don 6s linear infinite; }
@keyframes pota-don { to { transform: rotate(360deg); } }
.pota__halka { position: absolute; inset: 0; border-radius: 50%; border: 1.5px solid rgba(225, 38, 44, .8); animation: pota-nabiz 3.2s ease-out infinite; }
.pota__halka--2 { animation-delay: 1.6s; }
@keyframes pota-nabiz { 0% { transform: scale(1); opacity: .9; } 100% { transform: scale(1.55); opacity: 0; } }
/* potadaki işaret (kaladasht gibi): ince ip dışarıdan akar (üst lacivert, alt kırmızı), önce üst sonra alt parça ucundan
   logonun kendi renkleriyle ≈4 sn'de dolar ve DOLU KALIR (bir kez, bölüm görününce).
   Yalnızca transform animasyonu: sıvı kabı (.sivi-k) eğik eksende kayar, içindeki renkli parça ters yönde kayıp yerinde kalır */
.pota__logo { --lw: 84px; --lh: calc(var(--lw) * 495 / 240); position: relative; display: block; width: var(--lw); height: var(--lh); animation: pota-yuz 5s ease-in-out infinite; }
.pota__logo-bos { position: absolute; inset: 0; width: 100%; height: 100%; filter: brightness(0); opacity: .09; }
.parca { position: absolute; inset: 0; -webkit-mask: url("../images/isaret-ust.webp") 0 0 / 100% 100% no-repeat; mask: url("../images/isaret-ust.webp") 0 0 / 100% 100% no-repeat; }
.parca--alt { -webkit-mask-image: url("../images/isaret-alt.webp"); mask-image: url("../images/isaret-alt.webp"); }
.sivi-k { position: absolute; left: 50%; top: 50%; width: 300px; height: 600px; margin: -300px 0 0 -150px; overflow: hidden; will-change: transform; -webkit-mask: url("../images/sivi-dalga-ust.png") 0 286px / 70px 18px repeat-x, linear-gradient(#000, #000) 0 0 / 100% 288px no-repeat; mask: url("../images/sivi-dalga-ust.png") 0 286px / 70px 18px repeat-x, linear-gradient(#000, #000) 0 0 / 100% 288px no-repeat; animation: sivi-k-ust 3.8s cubic-bezier(.3, .25, .45, 1) .1s both paused; }
.parca--alt .sivi-k { -webkit-mask: url("../images/sivi-dalga-alt.png") 0 296px / 70px 18px repeat-x, linear-gradient(#000, #000) 0 312px / 100% 288px no-repeat; mask: url("../images/sivi-dalga-alt.png") 0 296px / 70px 18px repeat-x, linear-gradient(#000, #000) 0 312px / 100% 288px no-repeat; animation-name: sivi-k-alt; animation-delay: .25s; }
.sivi-k img { position: absolute; left: 50%; top: 50%; width: var(--lw); height: var(--lh); margin: calc(var(--lh) / -2) 0 0 calc(var(--lw) / -2); will-change: transform; animation: sivi-i-ust 3.8s cubic-bezier(.3, .25, .45, 1) .1s both paused; }
.parca--alt .sivi-k img { animation-name: sivi-i-alt; animation-delay: .25s; }
/* sıvı yüzeyinde akan erimiş metal parıltısı */
.sivi-yuzey { position: absolute; left: 0; right: 0; top: 284px; height: 12px; overflow: hidden; background: linear-gradient(180deg, transparent, rgba(255, 255, 255, .45) 50%, transparent); }
.parca--alt .sivi-yuzey { top: 304px; }
.sivi-yuzey::after { content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 70px; background: radial-gradient(ellipse at center, rgba(255, 245, 225, .95), transparent 70%); animation: sivi-parla 1.8s linear 4 paused; }
@keyframes sivi-parla { from { transform: translateX(60px); } to { transform: translateX(170px); } }
/* yol, parçanın ucundan (sıvı hemen görünür) dibine kadar: eksen boyunca üst parça −70…+19, alt parça −19…+69 px */
@keyframes sivi-k-ust { from { transform: rotate(-18deg) translateY(-60px); } to { transform: rotate(-18deg) translateY(36px); } }
@keyframes sivi-i-ust { from { transform: translateY(60px) rotate(18deg); } to { transform: translateY(-36px) rotate(18deg); } }
@keyframes sivi-k-alt { from { transform: rotate(-18deg) translateY(60px); } to { transform: rotate(-18deg) translateY(-36px); } }
@keyframes sivi-i-alt { from { transform: translateY(-60px) rotate(18deg); } to { transform: translateY(36px) rotate(18deg); } }
.parca--alt /* erimiş metal ipleri: dışarıdan akıp parçanın ucuna girer, dolum bitince incelip kaybolur */
.pota__ip { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.pota__ip-yol { fill: none; stroke: #2f2d84; stroke-width: 11; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: 1; animation: ip-ak .35s ease-in both paused, ip-bit .9s ease-in 3.6s both paused; }
.pota__ip-yol--alt { stroke: #db1b21; animation-delay: 0s, 3.6s; }
@keyframes ip-ak { to { stroke-dashoffset: 0; } }
@keyframes ip-bit { to { stroke-dashoffset: -1; stroke-width: 2; } }
/* bölüm görünür olunca bir kez dökülür, dolu kalır */
.pota.dolsun .sivi-k, .pota.dolsun .sivi-k img, .pota.dolsun .pota__ip-yol, .pota.dolsun .sivi-yuzey::after { animation-play-state: running; }
@keyframes pota-yuz { 0%, 100% { transform: translateY(-4px); } 50% { transform: translateY(4px); } }
.pota__ad { font-size: 18px; font-weight: 800; letter-spacing: -.02em; }
.pota__ad small { display: block; margin-top: 4px; font-size: 11px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--soluk); }
.akis__cekirdek .pill--solid { background: var(--yazi); color: #fff; }
@media (max-width: 1000px) {
  .akis { grid-template-columns: 1fr; gap: 36px; }
  .akis__hat { display: none; }
  .akis__cekirdek { order: -1; }
  .akis__oge, .akis__sutun--cikis .akis__oge { transform: translateY(14px); }
  .pota { width: 190px; height: 190px; }
  .pota__donen { -webkit-mask: radial-gradient(circle, transparent 98px, #000 99px, #000 101px, transparent 102px); mask: radial-gradient(circle, transparent 98px, #000 99px, #000 101px, transparent 102px); }
}

/* ---------- Küresel: dönen noktalı dünya küresi ---------- */
.kuresel { overflow: hidden; background: radial-gradient(ellipse at 70% 50%, rgba(47, 45, 132, .3), transparent 55%), #07080d; }
.kuresel__izgara { display: grid; grid-template-columns: 1fr 1.15fr; gap: clamp(40px, 6vw, 96px); align-items: center; }
.bolgeler { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 30px; }
.bolgeler li { padding: 8px 15px; border-radius: 60px; font-size: 13px; font-weight: 600; border: 1px solid rgba(255, 255, 255, .14); color: rgba(255, 255, 255, .5); transition: color .5s, border-color .5s, background .5s, transform .5s var(--ease); }
.bolgeler li.aktif { color: #fff; border-color: rgba(255, 255, 255, .5); background: rgba(255, 255, 255, .08); transform: translateY(-2px); }
.kuresel__ipucu { margin-top: 24px; font-size: 11px; font-weight: 700; letter-spacing: .24em; text-transform: uppercase; color: rgba(255, 255, 255, .4); }
.kure { position: relative; width: 100%; max-width: 680px; aspect-ratio: 1; margin-left: auto; cursor: grab; touch-action: pan-y; }
.kure.is-surukle { cursor: grabbing; }
.kure__tuval { position: absolute; inset: 0; width: 100%; height: 100%; }
.serit { margin-top: 50px; overflow: hidden; border-top: 1px solid rgba(255, 255, 255, .08); border-bottom: 1px solid rgba(255, 255, 255, .08); -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); }
.serit__ic { display: flex; width: max-content; animation: serit 40s linear infinite; }
.serit span { display: flex; align-items: center; gap: 40px; padding: 26px 0 26px 40px; font-size: clamp(22px, 2.4vw, 36px); font-weight: 700; letter-spacing: -.02em; color: rgba(255, 255, 255, .85); white-space: nowrap; }
.serit span::after { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--red); box-shadow: 0 0 12px rgba(225, 38, 44, .8); }
.serit span:nth-child(even) { color: transparent; -webkit-text-stroke: 1px rgba(255, 255, 255, .6); }
@keyframes serit { to { transform: translateX(-50%); } }

/* ---------- İletişim: teklif formu ---------- */
.iletisim { background: radial-gradient(ellipse at 90% 100%, rgba(225, 38, 44, .1), transparent 55%), radial-gradient(ellipse at 0% 0%, rgba(47, 45, 132, .12), transparent 55%), #f4f3ef; }
.iletisim__izgara { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 6vw, 96px); align-items: start; }
.iletisim__dogrudan { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
.form { display: grid; gap: 16px; padding: clamp(24px, 3vw, 40px); border-radius: 30px; background: #fff; box-shadow: 0 50px 90px -50px rgba(18, 19, 43, .5); }
.form__satir { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.form label { display: grid; gap: 8px; }
.form label > span { font-size: 11px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: rgba(18, 19, 43, .55); }
.form input, .form select, .form textarea {
  width: 100%;
  padding: 14px 18px;
  border-radius: 16px;
  border: 1px solid rgba(18, 19, 43, .14);
  background: #f7f6f2;
  font: inherit;
  font-size: 15px;
  font-weight: 500;
  color: var(--yazi);
  transition: border-color .3s, box-shadow .3s, background .3s;
}
.form select { appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%2312132b' stroke-width='1.6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 18px center; background-size: 12px; padding-right: 44px; }
.form textarea { resize: vertical; min-height: 110px; }
.form :is(input, select, textarea):focus { outline: none; background: #fff; border-color: #2f2d84; box-shadow: 0 0 0 4px rgba(47, 45, 132, .12); }
.form button { justify-self: start; margin-top: 4px; }
.form__not { font-size: 12.5px; color: var(--soluk); }

/* ---------- Footer: söz + teklif, cam panelde dört sütun ---------- */
.altbilgi { position: relative; z-index: 4; padding: 50px 0 0; background: #07080d; color: rgba(255, 255, 255, .66); overflow: hidden; }
.altbilgi::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(ellipse at 0% 0%, rgba(47, 45, 132, .35), transparent 50%), radial-gradient(ellipse at 100% 100%, rgba(225, 38, 44, .22), transparent 50%); }
.altbilgi > .kap { position: relative; }
.altbilgi__ust { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; padding-bottom: 50px; border-bottom: 1px solid rgba(255, 255, 255, .1); }
.altbilgi__soz { max-width: 16ch; font-size: clamp(30px, 4.4vw, 64px); font-weight: 700; line-height: 1.02; letter-spacing: -.035em; color: #fff; }
.altbilgi__soz em { font-style: normal; color: #ff5a5f; }
/* sağ altta sabit yukarı çık: halka ve yüzde sayfa ilerlemesini gösterir, üstüne gelince ok */
.yukari-sabit { position: fixed; right: 24px; bottom: 24px; z-index: 55; display: grid; place-items: center; width: 60px; height: 60px; border-radius: 50%; color: #fff; background: rgba(12, 13, 28, .78); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: 0 14px 34px -12px rgba(0, 0, 0, .5); opacity: 0; visibility: hidden; transform: translateY(16px) scale(.9); transition: opacity .4s, visibility .4s, transform .5s var(--ease), background .4s; }
.yukari-sabit.is-gorunur { opacity: 1; visibility: visible; transform: none; }
.yukari-sabit svg { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); }
.yukari-sabit circle { fill: none; stroke-width: 2.5; }
.yukari-sabit__iz { stroke: rgba(255, 255, 255, .16); }
.yukari-sabit__dolu { stroke: var(--red); stroke-linecap: round; stroke-dasharray: 100; stroke-dashoffset: calc(100 - var(--yuzde, 0)); }
.yukari-sabit__yuzde { font-size: 13px; font-weight: 800; letter-spacing: -.01em; font-variant-numeric: tabular-nums; transition: opacity .3s, transform .4s var(--ease); }
.yukari-sabit__ok { position: absolute; width: 12px; height: 12px; border-top: 2px solid #fff; border-left: 2px solid #fff; opacity: 0; transform: translateY(10px) rotate(45deg); transition: opacity .3s, transform .4s var(--ease); }
.yukari-sabit:hover { background: var(--red); }
.yukari-sabit:hover .yukari-sabit__yuzde { opacity: 0; transform: translateY(-10px); }
.yukari-sabit:hover .yukari-sabit__ok { opacity: 1; transform: translateY(3px) rotate(45deg); }
@media (max-width: 900px) { .yukari-sabit { right: 16px; bottom: 16px; width: 52px; height: 52px; } .yukari-sabit__yuzde { font-size: 12px; } }
.altbilgi__sutunlar { display: grid; grid-template-columns: 1.2fr .9fr 1.1fr 2fr; gap: 40px; padding: 56px 0; }
.altbilgi__sutunlar > div + div { padding-left: 40px; border-left: 1px solid rgba(255, 255, 255, .08); }
.altbilgi__marka img { width: 190px; height: auto; }
.altbilgi__marka p { max-width: 330px; margin-top: 22px; font-size: 15px; line-height: 1.7; }
.altbilgi__sutun { display: flex; flex-direction: column; gap: 12px; }
.altbilgi__sutun h3 { margin-bottom: 8px; font-size: 12px; font-weight: 800; letter-spacing: .26em; text-transform: uppercase; color: #fff; }
.altbilgi__sutun > a { position: relative; width: fit-content; font-size: 15.5px; color: rgba(255, 255, 255, .72); transition: color .3s, transform .4s var(--ease); }
.altbilgi__sutun > a::before { content: ""; position: absolute; left: -18px; top: 50%; width: 10px; height: 2px; border-radius: 2px; background: var(--red); opacity: 0; transition: opacity .3s; }
.altbilgi__sutun > a:hover { color: #fff; transform: translateX(18px); }
.altbilgi__sutun > a:hover::before { opacity: 1; }
.altbilgi__iletisim > a::before { display: none; }
.altbilgi__iletisim > a:hover { transform: none; }
/* adres ve telefonlar kendi satırında bölünmesin (Türkçe); dar ekranda yazı biraz küçülür */
.altbilgi__iletisim .ib span { font-size: clamp(13.5px, 1.15vw, 15.5px); }
html:not([lang="en"]) .altbilgi__iletisim .ib span { white-space: nowrap; }
.ib { display: flex !important; align-items: flex-start; gap: 14px; line-height: 1.5; }
.ib__ikon { flex: none; position: relative; width: 34px; height: 34px; margin-top: -5px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .16); transition: background .4s, border-color .4s; }
.ib:hover .ib__ikon { border-color: transparent; background: linear-gradient(135deg, #2f2d84, #e1262c); }
.ib:hover .ib__ikon::before { background: #fff; }
.ib__ikon::before { content: ""; position: absolute; inset: 0; margin: auto; width: 15px; height: 15px; background: #f3d9c6; transition: background .4s; -webkit-mask: var(--ikon) center / contain no-repeat; mask: var(--ikon) center / contain no-repeat; }
.ib__ikon--konum { --ikon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0Z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E"); }
.ib__ikon--tel { --ikon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1 1 .4 1.9.7 2.8a2 2 0 0 1-.5 2.1L8 9.9a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.8.7a2 2 0 0 1 1.7 2Z'/%3E%3C/svg%3E"); }
.ib__ikon--posta { --ikon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='16' rx='2'/%3E%3Cpath d='m22 7-10 6L2 7'/%3E%3C/svg%3E"); }
.altbilgi__alt { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 30px; padding: 26px 0; border-top: 1px solid rgba(255, 255, 255, .1); font-size: 13px; }
.altbilgi__alt nav { display: flex; flex-wrap: wrap; gap: 8px 22px; }
.altbilgi__alt a { transition: color .3s; }
.altbilgi__alt a:hover { color: #fff; }
.altbilgi__alt b { color: #fff; font-weight: 800; }
.altbilgi { padding-bottom: 8px; }
.altbilgi__eylem { display: flex; align-items: center; gap: 14px; flex: none; }
.altbilgi__sutunlar { position: relative; margin: 50px 0 8px; padding: clamp(32px, 4vw, 56px); border-radius: 32px; background: linear-gradient(180deg, rgba(255, 255, 255, .055), rgba(255, 255, 255, .018)); border: 1px solid rgba(255, 255, 255, .08); }
.altbilgi__sutunlar::before { content: ""; position: absolute; left: 8%; right: 8%; top: -1px; height: 1px; background: linear-gradient(90deg, transparent, #e1262c 30%, #ffb27a 50%, #e1262c 70%, transparent); }
.altbilgi__sutunlar::after { content: ""; position: absolute; left: 20%; right: 20%; top: -40px; height: 80px; pointer-events: none; background: radial-gradient(ellipse at 50% 50%, rgba(255, 110, 50, .14), transparent 70%); }
.altbilgi__sutunlar > div + div { border-left-color: rgba(255, 255, 255, .07); }
.altbilgi__alt { border-top: 0; }

/* ---------- Özel imleç (yalnızca fare olan cihazlarda) + ilerleme çizgisi ---------- */
.ilerleme { position: fixed; left: 0; right: 0; top: 0; z-index: 60; height: 3px; pointer-events: none; }
.ilerleme span { display: block; height: 100%; background: linear-gradient(90deg, #4f4cd6, var(--red)); transform: scaleX(var(--kaydirma, 0)); transform-origin: left; }
.imlec { display: none; }
@media (hover: hover) and (pointer: fine) {
  .imlec { display: block; position: fixed; left: 0; top: 0; z-index: 210; pointer-events: none; }
  .imlec__nokta, .imlec__halka { position: absolute; left: 0; top: 0; border-radius: 50%; }
  .imlec__nokta { width: 7px; height: 7px; margin: -3.5px 0 0 -3.5px; background: var(--red); transition: transform .25s var(--ease), opacity .25s; }
  .imlec__halka { width: 38px; height: 38px; margin: -19px 0 0 -19px; border: 1.5px solid #fff; mix-blend-mode: difference; transition: width .35s var(--ease), height .35s var(--ease), margin .35s var(--ease), background .35s, opacity .3s; }
  .imlec.is-aktif .imlec__halka { width: 64px; height: 64px; margin: -32px 0 0 -32px; background: rgba(255, 255, 255, .18); }
  .imlec.is-aktif .imlec__nokta { transform: scale(.5); }
  .imlec.is-gizli { opacity: 0; }
  body.imlec-var, body.imlec-var a, body.imlec-var button, body.imlec-var label { cursor: none; }
  body.imlec-var .kure { cursor: none; }
  body.imlec-var :is(input, textarea, select) { cursor: auto; }
}

/* ---------- Mobil ---------- */
@media (min-width: 1101px) {
  .burger { display: none; }
}
@media (max-width: 1100px) {
  .nav { display: none; }
}

@media (max-width: 900px) {
  .bolum__bas--satir { grid-template-columns: 1fr; gap: 14px; }
  .bolum__bas--satir .bolum__acik { justify-self: start; padding-top: 0; }
  .kuresel__izgara, .iletisim__izgara, .urun-izgara, .form__satir { grid-template-columns: 1fr; }
  .donem__alt { flex-direction: column; align-items: flex-start; }
  .lab { grid-template-columns: 1fr; }
  .labs { grid-template-columns: 1fr 1fr; }
  .muhurler { grid-template-columns: 1fr; gap: 10px; }
  .belge { grid-template-columns: 48px 1fr; gap: 12px; padding: 12px 30px 12px 12px; }
  .muhur { width: 48px; height: 64px; }
  .belge__ok { right: 12px; }
  .derece__btn { padding: 8px 2px; font-size: 11.5px; }
  .rapor__govde { grid-template-columns: 1fr; justify-items: center; }
  .rapor__liste { width: 100%; }
  .rapor__liste li { grid-template-columns: 38px 1fr auto; }
  .rapor .cubuk { grid-column: 1 / -1; }
  .hat__sahne { height: 560px; border-radius: 26px 26px 0 0; }
  .hat__karart { background: linear-gradient(0deg, rgba(7, 8, 13, .96) 0%, rgba(7, 8, 13, .85) 55%, rgba(7, 8, 13, .25) 100%); }
  .hat__icerik { left: 20px; right: 20px; top: auto; bottom: 24px; width: auto; transform: none; }
  .hat__dev { font-size: 80px; }
  .hat__icerik p { font-size: 14.5px; }
  .donusum { flex-direction: column; align-items: flex-start; gap: 10px; }
  .donusum__ok { width: 4px; height: 26px; margin-left: 18px; }
  .donusum__ok::after { right: auto; left: 50%; top: auto; bottom: -1px; margin: 0 0 0 -4.5px; transform: rotate(135deg); }
  .donusum__ok i { width: auto; left: 0; right: 0; height: 12px; animation-name: ok-ak-dik; }
  .donusum__grup { flex-direction: row; flex-wrap: wrap; }
  .hat__boru { padding: 20px 8px 18px; border-radius: 0 0 26px 26px; }
  .hat__boru-iz { left: calc(8px + 12.5% - 6px); right: calc(8px + 12.5% - 6px); top: 41px; height: 4px; }
  .istasyon__ikon > svg:not(.istasyon__sure) { width: 44px; height: 44px; padding: 11px; }
  .istasyon span { font-size: 11.5px; }
  .istasyon b { display: none; }
  .kure { max-width: none; margin: 0; }
  .altbilgi__sutunlar { grid-template-columns: 1fr 1fr; gap: 36px 24px; padding: 44px 0; }
  .altbilgi__sutunlar > div + div { padding-left: 0; border-left: 0; }
  .altbilgi__marka, .altbilgi__iletisim { grid-column: 1 / -1; }
  .altbilgi__ust { flex-direction: column; align-items: flex-start; }
  .altbilgi__sutunlar { padding: 28px 22px; border-radius: 24px; }

  .cerceve { display: none !important; }
  .v-cerceve .header { top: 0; padding-left: var(--gutter); padding-right: var(--gutter); }
  .hero__text { left: var(--gutter); right: var(--gutter); top: auto; bottom: 104px; transform: none; width: auto; }
  .hero__eyebrow { margin-bottom: 14px; }
  .slogan { font-size: clamp(26px, 7.4vw, 34px); margin-bottom: 12px; }
  .s-satir { white-space: normal; }
  .slogan-alt { font-size: 14px; min-height: 4.8em; }
  .hero__actions { margin-top: 16px; }
  .slayt-nav { left: var(--gutter); bottom: 54px; gap: 12px; }
  .slayt-nav button { width: 54px; }
  .slayt-nav .ad { display: none; }

  .header { padding: 18px var(--gutter); }
  .header__tools { gap: 22px; }
  .hero__eyebrow { font-size: 10px; letter-spacing: .22em; }
  .hero__eyebrow::before { width: 16px; }
  .pill { height: 46px; padding: 0 22px; font-size: 14px; }
  .menu { grid-template-columns: 1fr; align-content: start; padding-top: 110px; overflow-y: auto; gap: 40px; }
  .hero__fallback { right: 50%; top: 32%; height: 42%; transform: translate(50%, -50%); }
}


/* =========================================================
   Efsane katmanı: sayaçlar, harf çözme, fare ışığı, paralaks, parıltı
   ========================================================= */
/* Kurumsal sayaç bandı */


/* başlık kelimeleri bulanıktan netleşir */
.km > span { filter: blur(10px); transition: transform 1.1s var(--ease), filter 1.1s var(--ease); }
.gorundu .km > span { filter: none; }

/* fareyi izleyen ışık + kenar parıltısı (JS .isik ve .isik__k ekler) */
.isik__k { position: absolute; inset: 0; z-index: 3; border-radius: inherit; pointer-events: none; opacity: 0; transition: opacity .45s; background: radial-gradient(420px circle at var(--ix, 50%) var(--iy, 50%), rgba(255, 140, 90, .1), transparent 45%); }
.isik__k::before { content: ""; position: absolute; inset: 0; padding: 1px; border-radius: inherit; background: radial-gradient(260px circle at var(--ix, 50%) var(--iy, 50%), rgba(255, 90, 60, .85), transparent 60%); -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); }
.isik:hover > .isik__k { opacity: 1; }

/* butonlardan parıltı geçer */
.pill::after { content: ""; position: absolute; top: 0; bottom: 0; left: -70%; width: 45%; z-index: 1; pointer-events: none; background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .5), transparent); transform: skewX(-20deg); transition: left .9s var(--ease); }
.pill:hover::after { left: 135%; }



@media (max-width: 900px) {
}


/* ---------- Kurumsal: mozaik + açılan tarihçe panelleri ---------- */
.kurumsal::before { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; background-image: repeating-radial-gradient(circle at 12% -20%, rgba(18, 19, 43, .1) 0 1px, transparent 1px 40px); -webkit-mask-image: radial-gradient(ellipse 75% 70% at 50% 35%, #000 10%, transparent 100%); mask-image: radial-gradient(ellipse 75% 70% at 50% 35%, #000 10%, transparent 100%); }
.kurumsal > .kap { position: relative; z-index: 1; }
.kurumsal .bolum__bas--satir .bolum__acik { max-width: 460px; }
.mozaik { display: grid; grid-template-columns: repeat(12, 1fr); grid-auto-rows: clamp(170px, 15vw, 225px); gap: 14px; }
.mz { position: relative; overflow: hidden; border-radius: 28px; isolation: isolate; display: flex; flex-direction: column; padding: 26px; }
.mz--foto { grid-column: 1 / 8; grid-row: 1 / 3; padding: 0; background: #0d0f18; color: #fff; }
.mz--foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transform: scale(1.12); transition: transform 1.8s var(--ease); }
.mz--foto.gorundu img { transform: scale(1.03); }
.mz--foto:hover img { transform: scale(1.08); }
.mz--foto::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(7, 8, 13, .3) 0%, rgba(7, 8, 13, 0) 30%, rgba(7, 8, 13, 0) 45%, rgba(7, 8, 13, .88) 100%); }
.mz__konum, .mz__cip { position: absolute; top: 22px; z-index: 2; display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border-radius: 40px; font-size: 12px; font-weight: 700; letter-spacing: .08em; background: rgba(7, 8, 13, .45); border: 1px solid rgba(255, 255, 255, .22); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.mz__konum { left: 22px; text-transform: uppercase; }
.mz__konum::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--red); box-shadow: 0 0 0 4px rgba(225, 38, 44, .3); }
.mz__cip { right: 22px; letter-spacing: 0; font-weight: 600; }
.mz__cip b { font-size: 16px; font-weight: 800; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.mz__alt { position: relative; z-index: 2; margin-top: auto; display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 18px 32px; padding: 28px; }
.mz__alt p { max-width: 380px; font-size: clamp(18px, 1.5vw, 23px); font-weight: 600; line-height: 1.3; letter-spacing: -.02em; }
.mz__alt .pill--solid { flex: none; }
.mz--yil { grid-column: 8 / 13; grid-row: 1; justify-content: space-between; color: #fff; background: radial-gradient(circle at 85% 15%, rgba(225, 38, 44, .35), transparent 50%), radial-gradient(circle at 10% 100%, rgba(79, 76, 214, .4), transparent 55%), #0f1030; box-shadow: 0 30px 60px -40px rgba(18, 19, 43, .8); }
.mz__etiket { font-size: 11.5px; font-weight: 800; letter-spacing: .22em; text-transform: uppercase; color: rgba(255, 255, 255, .6); }
.mz__dev { display: block; margin: -.08em 0 0 -.04em; font-size: clamp(84px, 8.6vw, 136px); font-weight: 800; line-height: .95; letter-spacing: -.06em; color: transparent; background: linear-gradient(100deg, #ffb27a 0%, #ff6d2a 18%, #e1262c 40%, #ffb27a 55%, #fff3e2 66%, #e1262c 85%, #ffb27a 100%); background-size: 240% 100%; -webkit-background-clip: text; background-clip: text; animation: mz-parla 7s linear infinite; }
@keyframes mz-parla { to { background-position: -240% 0; } }
.mz__not { font-size: 13.5px; line-height: 1.45; color: rgba(255, 255, 255, .72); }
.mz--oran { grid-column: 8 / 11; grid-row: 2; justify-content: flex-end; padding-right: clamp(110px, 9vw, 150px); background: linear-gradient(145deg, #e1262c, #a8121a); color: #fff; box-shadow: 0 30px 60px -36px rgba(225, 38, 44, .8); }
.mz--oran .mz__not { max-width: 230px; color: rgba(255, 255, 255, .85); }
.halka { position: absolute; right: 18px; top: 50%; width: clamp(84px, 7vw, 112px); height: auto; transform: translateY(-50%) rotate(-90deg); }
.halka circle { fill: none; stroke-width: 8; }
.halka__iz { stroke: rgba(255, 255, 255, .22); }
.halka__dolu { stroke: #fff; stroke-linecap: round; stroke-dasharray: 100; stroke-dashoffset: 100; transition: stroke-dashoffset 2.2s var(--ease) .4s; }
.mz--oran.gorundu .halka__dolu { stroke-dashoffset: 20; }
.mz__rakam { display: flex; align-items: baseline; gap: 2px; margin-bottom: 8px; font-size: clamp(44px, 4.2vw, 64px); font-weight: 800; line-height: 1; letter-spacing: -.05em; font-variant-numeric: tabular-nums; }
.mz__rakam small { font-size: .5em; font-weight: 700; }
.mz--tesis { grid-column: 11 / 13; grid-row: 2; justify-content: flex-end; background: #fff; color: #12132b; border: 1px solid rgba(18, 19, 43, .08); box-shadow: 0 24px 50px -36px rgba(18, 19, 43, .5); }
.mz--tesis .mz__not { color: var(--soluk); }
.mz__pin { position: absolute; right: 22px; top: 22px; width: 18px; height: 18px; border-radius: 50% 50% 50% 0; transform: rotate(-45deg); background: var(--red); box-shadow: 0 0 0 6px rgba(225, 38, 44, .14); }
.mz__pin::after { content: ""; position: absolute; left: 6px; top: 6px; width: 6px; height: 6px; border-radius: 50%; background: #fff; }

/* tarihçe: dört panel; aktif olan açılır, yılı erimiş metalle dolar; 5 sn'de bir sıradaki açılır */
.donemler { display: flex; gap: 12px; height: clamp(440px, 46vw, 600px); margin-top: 14px; }
.donem { position: relative; flex: 1; min-width: 0; border-radius: 28px; overflow: hidden; isolation: isolate; background: #0d0f18; color: #fff; cursor: pointer; transition: flex 1.1s var(--ease); contain: layout paint; }
.donem.is-aktif { flex: 3.4; cursor: default; }
/* fotoğraf ve metin açık panel genişliğinde SABİT (--acik-w, main.js): panel genişlerken yeniden boyutlanmaz, yalnız kırpım değişir */
.donem img { position: absolute; top: 0; left: 50%; z-index: 0; width: var(--acik-w, 100%); height: 100%; object-fit: cover; object-position: var(--op, 50% 50%); transform: translateX(-50%); }
.donem::before { content: ""; position: absolute; inset: 0; z-index: 1; background: #07080d; opacity: .42; transition: opacity 1s; pointer-events: none; }
.donem.is-aktif::before { opacity: 0; }
.donem::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(7, 8, 13, .3) 0%, rgba(7, 8, 13, 0) 32%, rgba(7, 8, 13, 0) 48%, rgba(7, 8, 13, .9) 100%); }
.donem__kapali { position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; justify-content: space-between; align-items: center; padding: 24px 0; transition: opacity .45s; }
.donem__no { font-size: 12px; font-weight: 800; letter-spacing: .16em; color: rgba(255, 255, 255, .75); }
.donem__yil-dik { writing-mode: vertical-rl; transform: rotate(180deg); font-size: clamp(26px, 2.8vw, 42px); font-weight: 800; letter-spacing: -.02em; }
.donem.is-aktif .donem__kapali { opacity: 0; pointer-events: none; }
.donem__acik { position: absolute; left: 0; bottom: 0; z-index: 2; width: var(--acik-w, 100%); padding: clamp(22px, 3vw, 40px); opacity: 0; transform: translateY(24px); transition: opacity .5s .25s, transform .9s var(--ease) .25s; }
.donem.is-aktif .donem__acik { opacity: 1; transform: none; }
.donem__etiket { display: inline-flex; align-items: center; gap: 10px; margin-bottom: 14px; padding: 8px 14px 8px 12px; border-radius: 6px; font-size: 11.5px; font-weight: 800; letter-spacing: .28em; text-transform: uppercase; color: #fff; background: linear-gradient(90deg, rgba(7, 8, 13, .82), rgba(7, 8, 13, .5)); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12); }
.donem__etiket::before { content: ""; width: 22px; height: 2px; border-radius: 2px; background: linear-gradient(90deg, #4f4cd6, #e1262c 55%, #ffb27a); box-shadow: 0 0 8px rgba(255, 120, 80, .6); }
.donem__yil { position: relative; margin: 0 0 4px -.04em; font-size: clamp(58px, 7vw, 112px); font-weight: 800; line-height: 1.18; letter-spacing: -.055em; white-space: nowrap; color: rgba(255, 255, 255, .16); }
/* yıl dolumu yalnız transform ile: pencere alttan yukarı açılır, içindeki renkli yazı yerinde kalır (yeniden boyama yok) */
.yil-p { position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: hidden; transform: translateY(100%); transition: transform 1.9s var(--ease) .35s; }
.yil-i { display: block; color: transparent; background: linear-gradient(0deg, #a8121a 10%, #e1262c 27%, #ff6d2a 50%, #ffb27a 72%, #fff3e2 92%); -webkit-background-clip: text; background-clip: text; transform: translateY(-100%); transition: transform 1.9s var(--ease) .35s; }
.donem.is-aktif .yil-p, .donem.is-aktif .yil-i { transform: none; }
.donem__acik h3 { margin-bottom: 10px; font-size: clamp(20px, 2vw, 28px); font-weight: 700; letter-spacing: -.02em; }
.donem__p { max-width: 540px; font-size: 15px; line-height: 1.7; color: rgba(255, 255, 255, .82); }
.donem__cubuk { position: absolute; left: 0; right: 0; bottom: 0; z-index: 3; height: 3px; background: rgba(255, 255, 255, .14); opacity: 0; transition: opacity .4s; }
.donem__cubuk::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, #4f4cd6, var(--red)); transform: scaleX(0); transform-origin: left; }
.donem.is-aktif .donem__cubuk { opacity: 1; }
.donem.is-aktif .donem__cubuk::after { animation: donem-sure var(--sure, 5s) linear forwards; }
.donemler.is-durdu .donem.is-aktif .donem__cubuk::after { animation-play-state: paused; }
@keyframes donem-sure { to { transform: scaleX(1); } }
@media (max-width: 900px) {
  .mozaik { grid-template-columns: 1fr 1fr; grid-auto-rows: auto; gap: 10px; }
  .mz--oran .mz__not { font-size: 12.5px; }
  .mz { padding: 20px; border-radius: 22px; }
  .mz--foto { grid-column: 1 / -1; grid-row: auto; aspect-ratio: 4 / 3.4; }
  .mz__alt { padding: 20px; }
  .mz__alt p { font-size: 17px; }
  .mz--foto::after { background: linear-gradient(180deg, rgba(7, 8, 13, .35) 0%, rgba(7, 8, 13, 0) 22%, rgba(7, 8, 13, .25) 42%, rgba(7, 8, 13, .94) 100%); }
  .mz__cip { display: none; }
  .mz--yil { grid-column: 1 / -1; grid-row: auto; min-height: 210px; }
  .mz--oran, .mz--tesis { grid-column: auto; grid-row: auto; min-height: 200px; }
  .halka { width: 84px; right: 14px; }
  .mz--oran { padding-right: 110px; }
  .donemler { flex-direction: column; height: auto; gap: 10px; }
  .donem { flex: none; height: 78px; border-radius: 22px; transition: height 1s var(--ease); }
  .donem.is-aktif { flex: none; height: 460px; }
  .donem__kapali { flex-direction: row; justify-content: flex-start; align-items: center; gap: 14px; padding: 0 20px; }
  .donem__yil-dik { writing-mode: horizontal-tb; transform: none; font-size: 24px; }
  .donem__acik { padding: 20px; }
  .donem__yil { font-size: 64px; }
}

/* ekran dışındaki bölümlerde sonsuz animasyonlar durur (main.js .is-ekranda) */
.bolum:not(.is-ekranda) .urunler-ufuk, .bolum:not(.is-ekranda).urunler::after, .bolum:not(.is-ekranda) .mz__dev, .bolum:not(.is-ekranda) .pota::before, .bolum:not(.is-ekranda) .pota__donen, .bolum:not(.is-ekranda) .pota__halka, .bolum:not(.is-ekranda) .pota__logo, .bolum:not(.is-ekranda) .akis__top, .bolum:not(.is-ekranda) .donusum__ok i, .bolum:not(.is-ekranda) .hat__boru-dolu::after, .bolum:not(.is-ekranda) .serit__ic, .bolum:not(.is-ekranda) .rapor__etiket::before { animation-play-state: paused; }

/* belge ışık kutusu */
.isik-kutu { position: fixed; inset: 0; z-index: 95; display: grid; place-items: center; padding: 24px; background: rgba(7, 8, 13, .88); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); opacity: 0; transition: opacity .35s; }
.isik-kutu[hidden] { display: none; }
.isik-kutu.is-acik { opacity: 1; }
.isik-kutu__govde { display: flex; flex-direction: column; align-items: center; gap: 14px; max-width: min(92vw, 900px); max-height: 100%; transform: translateY(18px) scale(.97); transition: transform .5s var(--ease); }
.isik-kutu.is-acik .isik-kutu__govde { transform: none; }
.isik-kutu__govde img { max-width: 100%; max-height: calc(100vh - 110px); border-radius: 10px; box-shadow: 0 40px 90px -30px rgba(0, 0, 0, .9); background: #fff; }
.isik-kutu__govde figcaption { font-size: 13px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: rgba(255, 255, 255, .75); }
.isik-kutu__kapat { position: absolute; right: 22px; top: 22px; width: 50px; height: 50px; border-radius: 50%; background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .25); transition: background .3s, transform .5s var(--ease); }
.isik-kutu__kapat:hover { background: var(--red); transform: rotate(90deg); }
.isik-kutu__kapat span { position: absolute; left: 50%; top: 50%; width: 18px; height: 2px; background: #fff; }
.isik-kutu__kapat span:first-child { transform: translate(-50%, -50%) rotate(45deg); }
.isik-kutu__kapat span:last-child { transform: translate(-50%, -50%) rotate(-45deg); }
body.isik-acik { overflow: hidden; }

/* =========================================================
   Yalnızca mobil (≤900px) düzenlemeler
   ========================================================= */
@media (max-width: 900px) {
  /* hero: açılış bitince logo görünmez (açılıştaki döküm kalır), yazılar ortada */
  body.is-ready .hero__canvas:not(.is-ustte), body.is-ready .hero__glass, .hero__fallback { opacity: 0 !important; visibility: hidden; transition: opacity .6s, visibility 0s .6s; }
  .hero__text { left: var(--gutter); right: var(--gutter); top: 50%; bottom: auto; transform: translateY(-50%); width: auto; text-align: center; }
  .hero__text::before { left: -20px; right: -20px; }
  .hero__eyebrow { justify-content: center; }
  .slogan-alt { margin-left: auto; margin-right: auto; }
  .hero__actions { justify-content: center; }
  .slayt-nav { left: 50%; transform: translateX(-50%); justify-content: center; }
  .is-ready .slayt-nav { transform: translateX(-50%); }

  /* kurumsal mozaik: %80 ve 2 tesis tam genişlik, yatay */
  .mz--oran, .mz--tesis { grid-column: 1 / -1; min-height: 0; }
  .mz--oran { min-height: 170px; }
  .mz--tesis { flex-direction: row; align-items: center; justify-content: flex-start; gap: 16px; padding: 20px 22px; }
  .mz--tesis .mz__rakam { margin: 0; }
  .mz--tesis .mz__not { font-size: 14px; }
  .mz__pin { top: 50%; transform: translateY(-50%) rotate(-45deg); }

  /* kurumsal tarihçe: kaydırdıkça üst üste binen kartlar */
  .donemler { display: block; height: auto; }
  .donem, .donem.is-aktif { position: sticky; top: calc(84px + var(--i) * 14px); height: 440px; margin-bottom: 16px; cursor: default; box-shadow: 0 -16px 40px -24px rgba(7, 8, 13, .55); }
  .donem img,   .donem::before { display: none; }
  .donem__kapali { display: none; }
  .donem__acik, .donem.is-aktif .donem__acik { opacity: 1; transform: none; padding: 22px; }
  .yil-p, .yil-i { transform: none; transition: none; }
  .donem__cubuk { display: none; }

  /* footer: üst söz bandı yok, sütunlar alt alta */
  .altbilgi__ust { display: none; }
  .altbilgi { padding-top: 34px; }
  .altbilgi__sutunlar { display: flex; flex-direction: column; gap: 0; margin-top: 0; padding: 26px 22px 8px; border-radius: 26px; }
  .altbilgi__sutunlar > div { padding: 22px 0; border-left: 0 !important; border-top: 1px solid rgba(255, 255, 255, .08); }
  .altbilgi__sutunlar > div:first-child { padding-top: 0; border-top: 0; }
  .altbilgi__marka img { width: 150px; }
  .altbilgi__sutun { gap: 4px; }
  .altbilgi__sutun h3 { margin-bottom: 10px; }
  .altbilgi__sutun > a { width: 100%; padding: 9px 0; font-size: 16px; }
  .altbilgi__sutun > a:hover { transform: none; }
  .altbilgi__iletisim .ib { padding: 8px 0; }
  .altbilgi__alt { flex-direction: column; align-items: center; text-align: center; gap: 14px; padding: 24px 0 90px; }
  .altbilgi__alt nav { justify-content: center; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: .01ms !important; }
}

/* index.html satır içi stilleri buraya taşındı: gecikme (--g), panel sırası (--i), görsel kırpımı (--op, object-position) */
.g-10 { --g: .1s; }
.g-15 { --g: 0.15s; }
.g-20 { --g: .2s; }
.g-22 { --g: 0.22s; }
.g-25 { --g: .25s; }
.g-29 { --g: 0.29s; }
.g-30 { --g: .3s; }
.g-35 { --g: .35s; }
.g-36 { --g: 0.36s; }
.g-43 { --g: 0.43s; }
.g-50 { --g: 0.50s; }
.g-8 { --g: 0.08s; }
.i-0 { --i: 0; }
.i-1 { --i: 1; }
.i-2 { --i: 2; }
.i-3 { --i: 3; }
.konum-62-50 { object-position: 62% 50%; }
.konum-64-50 { object-position: 64% 50%; }
.konum-74-50 { object-position: 74% 50%; }
.op-42-55 { --op: 42% 55%; }
.op-48-35 { --op: 48% 35%; }
.op-50-50 { --op: 50% 50%; }
.op-55-45 { --op: 55% 45%; }
.op-58-40 { --op: 58% 40%; }
.op-58-50 { --op: 58% 50%; }
.op-68-50 { --op: 68% 50%; }


/* =========================================================
   WordPress alt sayfalar (page.php / single.php / 404.php)
   ========================================================= */
.alt-sayfa { background: #f4f3ef; color: #12132b; }
/* açılır menü koyu zeminde: sayfanın koyu yazı rengini miras almasın */
.alt-sayfa .menu { color: #fff; }
.alt-sayfa .header__logo, .alt-sayfa .nav__list > li, .alt-sayfa .header__tools > * { opacity: 1; transform: none; }
.alt-sayfa .nav__link.is-active::after { transform: scaleX(0); }
.alt-sayfa .nav__link.is-active { color: rgba(255, 255, 255, .88); }
.alt-sayfa .header.is-scrolled .nav__link.is-active { color: rgba(18, 19, 43, .78); }
.alt-sayfa .pill--glass { color: #12132b; background: #fff; border-color: rgba(18, 19, 43, .14); -webkit-backdrop-filter: none; backdrop-filter: none; }
.alt-sayfa .pill--glass:hover { color: #fff; background: #12132b; }

/* sayfa başlığı: koyu lacivert zemin, erimiş metal ışığı, dev kontur metin */
.sayfa-bas { position: relative; overflow: hidden; isolation: isolate; padding: 150px 0 44px; color: #fff; background: radial-gradient(ellipse 60% 80% at 85% 110%, rgba(225, 38, 44, .45), transparent 60%), radial-gradient(ellipse 50% 70% at 10% -10%, rgba(79, 76, 214, .5), transparent 60%), #0b0b22; }
.sayfa-bas::before { content: ""; position: absolute; inset: 0; z-index: -1; background-image: repeating-radial-gradient(circle at 85% 120%, rgba(255, 255, 255, .05) 0 1px, transparent 1px 46px); }
.sayfa-bas::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: linear-gradient(90deg, #2f2d84, #e1262c 50%, #ffb27a); }
.sayfa-bas__dev { position: absolute; right: -.04em; bottom: -.24em; z-index: -1; font-size: clamp(90px, 11vw, 180px); font-weight: 800; line-height: 1; letter-spacing: -.06em; color: transparent; -webkit-text-stroke: 1.5px rgba(255, 255, 255, .09); white-space: nowrap; pointer-events: none; }
.sayfa-bas .etiket { color: rgba(255, 255, 255, .75); }
.sayfa-bas .etiket { margin-bottom: 12px; }
.sayfa-bas h1 { max-width: 900px; font-size: clamp(32px, 3.6vw, 54px); font-weight: 700; line-height: 1.03; letter-spacing: -.045em; }
.yol { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 16px; font-size: 13.5px; font-weight: 600; color: rgba(255, 255, 255, .6); }
.yol a { display: inline-flex; align-items: center; gap: 8px; color: #fff; transition: color .3s; }
.yol a:hover { color: #ffb27a; }
.yol svg { width: 16px; height: 16px; }
.yol__ayrac { width: 18px; height: 2px; border-radius: 2px; background: linear-gradient(90deg, #4f4cd6, #e1262c); }

/* içerik: WordPress editör çıktısı için tipografi */
.sayfa-govde { padding: 56px 0 80px; }
.sayfa-icerik { font-size: 17px; line-height: 1.8; color: rgba(18, 19, 43, .82); }
.sayfa-icerik > * + * { margin-top: 22px; }
.sayfa-icerik h2 { margin-top: 40px; font-size: clamp(26px, 2.6vw, 38px); font-weight: 700; line-height: 1.15; letter-spacing: -.03em; color: #12132b; }
.sayfa-icerik h3 { margin-top: 34px; font-size: 22px; font-weight: 700; letter-spacing: -.02em; color: #12132b; }
.sayfa-icerik a { color: #c8161d; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.sayfa-icerik strong { color: #12132b; }
.sayfa-icerik ul, .sayfa-icerik ol { padding-left: 0; list-style: none; }
.sayfa-icerik ul li, .sayfa-icerik ol li { position: relative; padding-left: 26px; margin-top: 8px; }
.sayfa-icerik ul li::before { content: ""; position: absolute; left: 4px; top: .72em; width: 8px; height: 8px; border-radius: 50%; background: #e1262c; box-shadow: 0 0 0 4px rgba(225, 38, 44, .14); }
.sayfa-icerik ol { counter-reset: s; }
.sayfa-icerik ol li { counter-increment: s; }
.sayfa-icerik ol li::before { content: counter(s, decimal-leading-zero); position: absolute; left: 0; top: .1em; font-size: 12px; font-weight: 800; color: #c8161d; }
.sayfa-icerik img, .sayfa-icerik figure { max-width: 100%; height: auto; border-radius: 22px; }
.sayfa-icerik figure img { border-radius: 22px; }
.sayfa-icerik figcaption { margin-top: 10px; font-size: 13px; color: rgba(18, 19, 43, .55); }
.sayfa-icerik blockquote { margin-left: 0; margin-right: 0; padding: 22px 26px; border-radius: 18px; background: #fff; border-left: 4px solid #e1262c; font-size: 19px; font-weight: 600; color: #12132b; }
.sayfa-icerik table { width: 100%; border-collapse: collapse; overflow: hidden; border-radius: 18px; background: #fff; font-size: 15px; box-shadow: 0 20px 40px -32px rgba(18, 19, 43, .5); }
.sayfa-icerik th { padding: 14px 16px; text-align: left; font-size: 12px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #fff; background: #12132b; }
.sayfa-icerik td { padding: 12px 16px; border-top: 1px solid rgba(18, 19, 43, .08); }
.sayfa-icerik .wp-block-table { overflow-x: auto; }
.sayfa-icerik .wp-block-gallery, .sayfa-icerik .gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; }
.sayfa-icerik .wp-block-button__link { display: inline-flex; padding: 14px 26px; border-radius: 60px; color: #fff; background: #12132b; text-decoration: none; }
.belir { opacity: 0; transform: translateY(24px); transition: opacity .9s var(--ease), transform 1s var(--ease); }
.belir.gorundu { opacity: 1; transform: none; }

/* 404 */
.yok { padding: 90px 0 110px; text-align: center; }
.yok__kod { display: flex; justify-content: center; align-items: center; gap: .04em; font-size: clamp(120px, 20vw, 240px); font-weight: 800; line-height: 1; letter-spacing: -.06em; color: transparent; background: linear-gradient(0deg, #a8121a 10%, #e1262c 35%, #ff6d2a 60%, #ffb27a 85%); -webkit-background-clip: text; background-clip: text; }
.yok__kod img { width: .42em; height: auto; margin: 0 .04em; }
.yok h2 { margin-top: 18px; font-size: clamp(26px, 3vw, 40px); font-weight: 700; letter-spacing: -.03em; color: #12132b; }
.yok p { max-width: 560px; margin: 14px auto 0; font-size: 16px; line-height: 1.7; color: rgba(18, 19, 43, .7); }
.yok__dugmeler { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 30px; }
.yok__linkler { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 46px; }
.yok__linkler a { padding: 10px 18px; border-radius: 60px; font-size: 14px; font-weight: 600; color: #12132b; background: #fff; border: 1px solid rgba(18, 19, 43, .1); transition: color .3s, border-color .3s, transform .4s var(--ease); }
.yok__linkler a:hover { color: #c8161d; border-color: rgba(225, 38, 44, .4); transform: translateY(-2px); }
@media (max-width: 900px) {
  .sayfa-bas { padding: 118px 0 34px; }
  .sayfa-govde { padding: 44px 0 60px; }
  .sayfa-icerik { font-size: 16px; }
}

/* =========================================================
   Alt sayfalar ortak bileşenleri (.sp)
   ========================================================= */
.sp { font-size: 16px; line-height: 1.75; color: rgba(18, 19, 43, .72); }
.sp *, .sp *::before, .sp *::after { box-sizing: border-box; }
.sp p, .sp h2, .sp h3, .sp h4, .sp ul, .sp ol, .sp li, .sp figure, .sp dl, .sp dd, .sp dt { margin: 0; padding: 0; }
.sp ul, .sp ol { list-style: none; }
.sayfa-icerik .sp li { padding: 0; margin: 0; }
.sp li::before, .sp h2::before { content: none !important; display: none !important; }
.sp strong { color: #12132b; }
.sp a { text-decoration: none; }
.sp img { display: block; max-width: 100%; border-radius: 0; }
.sp-bolum { margin-top: clamp(52px, 6.5vw, 96px); }
.sp-etiket { display: inline-flex; align-items: center; gap: 12px; margin-bottom: 14px !important; font-size: 12px; font-weight: 800; letter-spacing: .28em; text-transform: uppercase; color: rgba(18, 19, 43, .6); }
.sp-etiket::before { content: ""; width: 28px; height: 2px; border-radius: 2px; background: #e1262c; }
.sp-baslik { font-size: clamp(28px, 3.2vw, 46px); font-weight: 700; line-height: 1.06; letter-spacing: -.04em; color: #12132b; }
.sp-baslik em { font-style: normal; color: transparent; background: linear-gradient(100deg, #2f2d84, #c8161d 60%, #ff7a3d); -webkit-background-clip: text; background-clip: text; }
.sp-bas { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 14px 40px; margin-bottom: 28px; }
.sp-bas p:not(.sp-etiket) { max-width: 520px; font-size: 15.5px; }
.sp-giris { font-size: 17px; line-height: 1.8; }
.sp-giris + .sp-giris { margin-top: 14px; }

/* üst: metin + görsel */
.sp-ust { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(28px, 4vw, 64px); align-items: stretch; }
.sp-ust > div { align-self: center; }
.sp-ust .sp-baslik { margin-bottom: 20px; }
.sp-foto { position: relative; overflow: hidden; min-height: 340px; border-radius: 30px; background: #0d0f18; box-shadow: 0 40px 80px -45px rgba(18, 19, 43, .6); }
.sp .sp-foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.sp-foto-rozet { position: absolute; left: 18px; bottom: 18px; display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border-radius: 40px; font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #fff; background: rgba(7, 8, 13, .55); border: 1px solid rgba(255, 255, 255, .22); }
.sp-foto-rozet::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #e1262c; box-shadow: 0 0 0 4px rgba(225, 38, 44, .3); }
.sp-sembol { position: absolute; right: 18px; top: 14px; font-size: clamp(64px, 7vw, 110px); font-weight: 800; line-height: 1; letter-spacing: -.06em; color: transparent; -webkit-text-stroke: 1.5px rgba(255, 255, 255, .45); }

/* rakam kartları */
.sayfa-icerik .sp .sp-rakam { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 50px; }
.sayfa-icerik .sp .sp-rakam li { padding: 22px 24px; border-radius: 24px; background: #fff; border: 1px solid rgba(18, 19, 43, .07); box-shadow: 0 18px 40px -32px rgba(18, 19, 43, .5); }
.sayfa-icerik .sp .sp-rakam li:first-child { background: #12132b; border-color: transparent; }
.sp-rakam b { display: flex; align-items: baseline; gap: 3px; font-size: clamp(26px, 2.6vw, 38px); font-weight: 800; line-height: 1.05; letter-spacing: -.04em; color: #12132b; }
.sp-rakam small { font-size: .5em; font-weight: 700; color: #e1262c; }
.sp-rakam span { display: block; margin-top: 8px; font-size: 13.5px; line-height: 1.45; }
.sp-rakam li:first-child b { color: transparent; background: linear-gradient(100deg, #ffb27a, #ff6d2a 40%, #e1262c); -webkit-background-clip: text; background-clip: text; }
.sp-rakam li:first-child span { color: rgba(255, 255, 255, .78); }

/* özellik kartları */
.sp-ozellik { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.sp-ozellik > div { padding: 22px; border-radius: 22px; background: #fff; border: 1px solid rgba(18, 19, 43, .07); }
.sp-ozellik dt { margin-bottom: 8px !important; font-size: 11px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: #c8161d; }
.sp-ozellik dd { font-size: 15px; font-weight: 600; line-height: 1.5; color: #12132b; }

/* teknik tablo */
.sp-tablo-kap { overflow-x: auto; border-radius: 24px; background: #fff; border: 1px solid rgba(18, 19, 43, .07); box-shadow: 0 24px 50px -40px rgba(18, 19, 43, .55); }
.sayfa-icerik .sp table.sp-tablo { width: 100%; min-width: 620px; border-collapse: collapse; border-radius: 0; box-shadow: none; background: transparent; font-size: 14px; }
.sayfa-icerik .sp .sp-tablo th { position: sticky; top: 0; padding: 16px 18px; text-align: left; font-size: 12px; font-weight: 800; letter-spacing: .1em; color: #fff; background: #12132b; white-space: nowrap; }
.sayfa-icerik .sp .sp-tablo th:first-child { border-top-left-radius: 0; }
.sayfa-icerik .sp .sp-tablo td { padding: 11px 18px; border-top: 1px solid rgba(18, 19, 43, .07); color: #12132b; font-variant-numeric: tabular-nums; white-space: nowrap; }
.sp-tablo td:first-child { font-weight: 800; color: #c8161d !important; }
.sp-tablo tbody tr:nth-child(even) td { background: rgba(18, 19, 43, .025); }
.sp-tablo tbody tr:hover td { background: rgba(225, 38, 44, .06); }
.sp-tablo-not { margin-top: 12px !important; font-size: 13px; color: rgba(18, 19, 43, .55); }

/* görselli kart ızgarası (hammadde / ticaret) */
.sp-kartlar { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.sp-kartlar--4 { grid-template-columns: repeat(4, 1fr); }
.sp-kart { overflow: hidden; border-radius: 26px; background: #fff; border: 1px solid rgba(18, 19, 43, .07); box-shadow: 0 20px 44px -36px rgba(18, 19, 43, .5); transition: transform .5s cubic-bezier(.16, 1, .3, 1), box-shadow .5s, border-color .4s; }
.sp-kart:hover { transform: translateY(-5px); border-color: rgba(225, 38, 44, .3); box-shadow: 0 30px 56px -34px rgba(225, 38, 44, .45); }
.sp-kart-foto { position: relative; aspect-ratio: 3 / 2; overflow: hidden; background: #e9e8ee; }
.sp .sp-kart-foto img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s cubic-bezier(.16, 1, .3, 1); }
.sp-kart:hover .sp-kart-foto img { transform: scale(1.05); }
.sp-kart-sembol { position: absolute; left: 14px; top: 14px; padding: 6px 12px; border-radius: 40px; font-size: 12.5px; font-weight: 800; color: #fff; background: rgba(18, 19, 43, .78); }
.sp-kart-ic { padding: 18px 20px 20px; }
.sp-kart h3 { font-size: 18px; font-weight: 700; line-height: 1.25; letter-spacing: -.01em; color: #12132b; }
.sp-kart p { margin-top: 6px !important; font-size: 13.5px; line-height: 1.55; }
.sp-kart-en { display: block; margin-top: 4px; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: rgba(18, 19, 43, .45); }

/* bilgi kartları */
.sp-bilgi { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.sp-bilgi--2 { grid-template-columns: 1fr 1fr; }
.sp-bilgi > article { position: relative; overflow: hidden; padding: clamp(22px, 2.6vw, 32px); border-radius: 26px; background: #fff; border: 1px solid rgba(18, 19, 43, .07); box-shadow: 0 20px 44px -36px rgba(18, 19, 43, .5); }
.sp-bilgi > article::after { content: ""; position: absolute; right: -40px; top: -40px; width: 150px; height: 150px; border-radius: 50%; background: radial-gradient(circle, rgba(225, 38, 44, .12), transparent 70%); }
.sp-bilgi-ikon { display: grid; place-items: center; width: 50px; height: 50px; margin-bottom: 16px; border-radius: 15px; font-size: 13px; font-weight: 800; color: #fff; background: linear-gradient(135deg, #2f2d84, #e1262c); }
.sp-bilgi-ikon svg { width: 24px; height: 24px; fill: none; stroke: #fff; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.sp-bilgi h3 { margin-bottom: 8px !important; font-size: 20px; font-weight: 700; letter-spacing: -.02em; color: #12132b; }
.sp-bilgi p { font-size: 15px; line-height: 1.7; }
.sp-koyu { color: rgba(255, 255, 255, .78) !important; background: radial-gradient(circle at 100% 0%, rgba(225, 38, 44, .4), transparent 55%), radial-gradient(circle at 0% 100%, rgba(79, 76, 214, .45), transparent 60%), #0f1030 !important; border-color: transparent !important; }
.sp-koyu h3, .sp-koyu strong { color: #fff; }

/* çip listesi */
.sp-cip { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px !important; }
.sayfa-icerik .sp .sp-cip li { padding: 5px 10px; border-radius: 9px; font-size: 12px; font-weight: 800; color: #12132b; background: rgba(47, 45, 132, .08); }
.sayfa-icerik .sp .sp-koyu .sp-cip li { color: #fff; background: rgba(255, 255, 255, .1); }

/* numaralı taahhüt listesi */
.sp-liste { counter-reset: s; display: grid; gap: 10px; }
.sayfa-icerik .sp .sp-liste li { counter-increment: s; position: relative; padding: 18px 22px 18px 72px; border-radius: 20px; background: #fff; border: 1px solid rgba(18, 19, 43, .07); font-size: 15.5px; line-height: 1.65; color: #12132b; }
.sayfa-icerik .sp .sp-liste li::after { content: counter(s, decimal-leading-zero); position: absolute; left: 22px; top: 18px; font-size: 13px; font-weight: 800; letter-spacing: .06em; color: #c8161d; }

/* belge kartları */
.sp-belgeler { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.sp-belge { display: block; overflow: hidden; border-radius: 22px; background: #fff; border: 1px solid rgba(18, 19, 43, .08); box-shadow: 0 20px 44px -36px rgba(18, 19, 43, .5); transition: transform .5s cubic-bezier(.16, 1, .3, 1); }
.sp-belge:hover { transform: translateY(-6px) rotate(-.5deg); }
.sp-belge-kagit { aspect-ratio: 3 / 4; overflow: hidden; padding: 14px; background: linear-gradient(160deg, #eceaf3, #dedce8); }
.sp .sp-belge-kagit img { width: 100%; height: 100%; object-fit: cover; object-position: top; border-radius: 6px; box-shadow: 0 14px 28px -14px rgba(18, 19, 43, .5); }
.sp-belge-ic { padding: 16px 18px 18px; }
.sp-belge h3 { font-size: 17px; font-weight: 700; color: #12132b; }
.sp-belge span { font-size: 13px; color: rgba(18, 19, 43, .6); }

/* belge künyesi (politika belgeleri) */
.sp-dokuman { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; overflow: hidden; border-radius: 22px; background: #fff; border: 1px solid rgba(18, 19, 43, .08); }
.sp-dokuman div { padding: 16px 20px; border-right: 1px solid rgba(18, 19, 43, .07); }
.sp-dokuman div:last-child { border-right: 0; }
.sp-dokuman dt { font-size: 11px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: rgba(18, 19, 43, .5); }
.sp-dokuman dd { margin-top: 4px !important; font-size: 15px; font-weight: 700; color: #12132b; }

/* metin bölümü (yasal metinler) */
.sp-metin { display: grid; grid-template-columns: 260px 1fr; gap: clamp(24px, 4vw, 56px); align-items: start; }
.sp-icindekiler { position: sticky; top: 110px; padding: 20px; border-radius: 22px; background: #fff; border: 1px solid rgba(18, 19, 43, .07); }
.sp-icindekiler p { margin-bottom: 10px !important; font-size: 11px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: rgba(18, 19, 43, .5); }
.sayfa-icerik .sp .sp-icindekiler a { display: block; padding: 7px 0; font-size: 13.5px; font-weight: 600; line-height: 1.35; color: #12132b; text-decoration: none; border-top: 1px solid rgba(18, 19, 43, .06); }
.sayfa-icerik .sp .sp-icindekiler a:hover { color: #c8161d; }
.sp-madde { scroll-margin-top: 110px; }
.sp-madde + .sp-madde { margin-top: 30px; padding-top: 30px; border-top: 1px solid rgba(18, 19, 43, .08); }
.sp-madde h3 { display: flex; align-items: baseline; gap: 12px; margin-bottom: 12px !important; font-size: 21px; font-weight: 700; letter-spacing: -.02em; color: #12132b; }
.sp-madde h3 span { font-size: 13px; font-weight: 800; color: #c8161d; }
.sp-madde p + p, .sp-madde p + ul, .sp-madde ul + p { margin-top: 12px !important; }
.sp-nokta { display: grid; gap: 6px; }
.sayfa-icerik .sp .sp-nokta li { position: relative; padding-left: 22px; font-size: 15px; line-height: 1.6; }
.sayfa-icerik .sp .sp-nokta li::after { content: ""; position: absolute; left: 4px; top: .62em; width: 7px; height: 7px; border-radius: 50%; background: #e1262c; }

/* iletişim / çağrı */
.sp-cagri { position: relative; overflow: hidden; isolation: isolate; display: grid; grid-template-columns: 1.2fr .8fr; gap: 24px 48px; align-items: center; padding: clamp(28px, 4vw, 52px); border-radius: 32px; color: rgba(255, 255, 255, .78); background: linear-gradient(135deg, #1b1a52, #0b0b1f); }
.sp-cagri::before { content: ""; position: absolute; left: -10%; bottom: -60%; z-index: -1; width: 60%; height: 140%; background: radial-gradient(circle, rgba(225, 38, 44, .35), transparent 60%); }
.sp-cagri .sp-etiket { color: rgba(255, 255, 255, .6); }
.sp-cagri h2 { font-size: clamp(24px, 2.6vw, 36px); font-weight: 700; line-height: 1.12; letter-spacing: -.03em; color: #fff; }
.sp-cagri p:not(.sp-etiket) { margin-top: 10px !important; font-size: 15px; }
.sp-kisi { display: grid; gap: 8px; padding: 22px; border-radius: 22px; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .14); }
.sp-kisi b { font-size: 18px; color: #fff; }
.sp-kisi span { font-size: 12px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: #ff8a6e; }
.sayfa-icerik .sp .sp-kisi a { display: flex; align-items: center; gap: 10px; font-size: 15px; font-weight: 600; color: #fff; text-decoration: none; }
.sayfa-icerik .sp .sp-kisi a:hover { color: #ffb27a; }
.sayfa-icerik .sp .sp-dugme { display: inline-flex; align-items: center; gap: 10px; margin-top: 20px; padding: 14px 24px; border-radius: 60px; font-size: 15px; font-weight: 700; color: #12132b; background: #fff; text-decoration: none; transition: background .4s, color .4s, transform .4s; }
.sayfa-icerik .sp .sp-dugme:hover { color: #fff; background: #e1262c; transform: translateY(-2px); }
.sayfa-icerik .sp .sp-dugme--koyu { color: #fff; background: #12132b; }

/* ürün merkez kartları */
.sp-urunler { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.sayfa-icerik .sp a.sp-urun { position: relative; display: flex; flex-direction: column; justify-content: flex-end; min-height: 440px; overflow: hidden; isolation: isolate; padding: 26px; border-radius: 30px; color: #fff; text-decoration: none; background: #0d0f18; transition: transform .5s cubic-bezier(.16, 1, .3, 1), box-shadow .5s; }
.sayfa-icerik .sp a.sp-urun:hover { transform: translateY(-6px); box-shadow: 0 40px 70px -40px rgba(225, 38, 44, .6); }
.sp .sp-urun img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 62%; object-fit: cover; }
.sp-urun::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(7, 8, 13, 0) 30%, #0d0f18 62%); }
.sp-urun .sp-sembol { -webkit-text-stroke-color: rgba(255, 255, 255, .5); }
.sp-urun h3 { font-size: 28px; font-weight: 700; letter-spacing: -.03em; color: #fff; }
.sp-urun p { margin-top: 8px !important; font-size: 14.5px; line-height: 1.6; color: rgba(255, 255, 255, .75); }
.sp-urun-ok { margin-top: 16px; font-size: 12px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #ffb27a; }

@media (max-width: 1000px) {
  .sp-kartlar--4, .sp-belgeler { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 900px) {
  .sp-foto { min-height: 0; aspect-ratio: 4 / 3.2; }
  .sp-ust, .sp-bilgi, .sp-bilgi--2, .sp-cagri, .sp-metin, .sp-urunler { grid-template-columns: 1fr; }
  .sayfa-icerik .sp .sp-rakam, .sp-ozellik, .sp-dokuman { grid-template-columns: 1fr 1fr; }
  .sp-dokuman div:nth-child(2) { border-right: 0; }
  .sp-dokuman div:nth-child(-n+2) { border-bottom: 1px solid rgba(18, 19, 43, .07); }
  .sp-kartlar { grid-template-columns: 1fr 1fr; }
  .sp-icindekiler { position: static; }
  .sayfa-icerik .sp a.sp-urun { min-height: 380px; }
}
@media (max-width: 560px) {
  .sp-kartlar, .sp-kartlar--4, .sp-belgeler { grid-template-columns: 1fr; }
}

/* Grup Firmamız sayfası (.gf) — etiket/başlık .hk-etiket/.hk-baslik */
.gf { font-size: 16px; line-height: 1.7; color: rgba(18, 19, 43, .7); }
.gf *, .gf *::before, .gf *::after { box-sizing: border-box; }
.gf p, .gf h2, .gf h3, .gf ul, .gf li, .gf figure { margin: 0; padding: 0; }
.gf ul { list-style: none; }
.sayfa-icerik .gf li { padding: 0; margin: 0; }
.gf li::before, .gf h2::before { content: none !important; display: none !important; }
.gf strong { color: #12132b; }
.gf .hk-etiket { display: inline-flex; align-items: center; gap: 12px; margin-bottom: 14px; font-size: 12px; font-weight: 800; letter-spacing: .28em; text-transform: uppercase; color: rgba(18, 19, 43, .6); }
.gf .hk-etiket::before { content: ""; width: 28px; height: 2px; border-radius: 2px; background: #e1262c; }
.gf .hk-baslik { font-size: clamp(30px, 3.4vw, 50px); font-weight: 700; line-height: 1.05; letter-spacing: -.04em; color: #12132b; }
.gf .hk-baslik em { font-style: normal; color: transparent; background: linear-gradient(100deg, #2f2d84, #c8161d 60%, #ff7a3d); -webkit-background-clip: text; background-clip: text; }

.gf-ust { display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(28px, 4vw, 64px); align-items: center; }
.gf-ust-metin .hk-baslik { margin-bottom: 20px; }
.gf-ust-metin > p:not(.hk-etiket) { font-size: 17px; line-height: 1.8; }
.sayfa-icerik .gf .gf-dugme, .gf-dugme { display: inline-flex; align-items: center; gap: 10px; margin-top: 26px; padding: 14px 24px; border-radius: 60px; font-size: 15px; font-weight: 700; color: #fff; background: #12132b; text-decoration: none; transition: background .4s, transform .4s; }
.sayfa-icerik .gf .gf-dugme:hover, .gf-dugme:hover { background: #e1262c; transform: translateY(-2px); }
.sayfa-icerik .gf .gf-dugme--acik { color: #12132b; background: #fff; }
.sayfa-icerik .gf .gf-dugme--acik:hover { color: #fff; background: #e1262c; }
.gf-foto { position: relative; overflow: hidden; border-radius: 30px; aspect-ratio: 4 / 3.2; background: #0d0f18; box-shadow: 0 40px 80px -45px rgba(18, 19, 43, .6); }
.gf .gf-foto img { width: 100%; height: 100%; object-fit: cover; border-radius: 0; }
.gf-foto figcaption { position: absolute; right: 18px; bottom: 18px; display: flex; flex-direction: column; align-items: flex-end; padding: 14px 18px; border-radius: 18px; color: #fff; background: rgba(7, 8, 13, .55); border: 1px solid rgba(255, 255, 255, .2); }
.gf-foto figcaption b { font-size: 30px; font-weight: 800; line-height: 1; letter-spacing: -.04em; color: transparent; background: linear-gradient(100deg, #ffb27a, #ff6d2a 45%, #e1262c); -webkit-background-clip: text; background-clip: text; }
.gf-foto figcaption span { margin-top: 4px; font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: rgba(255, 255, 255, .8); }

.gf-rakam { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: clamp(40px, 5vw, 64px); }
.sayfa-icerik .gf .gf-rakam li { padding: 24px; border-radius: 24px; background: #fff; border: 1px solid rgba(18, 19, 43, .07); box-shadow: 0 18px 40px -32px rgba(18, 19, 43, .5); }
.gf-rakam b { display: flex; align-items: baseline; gap: 3px; font-size: clamp(32px, 3vw, 46px); font-weight: 800; line-height: 1; letter-spacing: -.05em; color: #12132b; }
.gf-rakam small { font-size: .45em; font-weight: 700; color: #e1262c; }
.gf-rakam span { display: block; margin-top: 10px; font-size: 13.5px; line-height: 1.45; }

.gf-izgara { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 14px; margin-top: 14px; }
.gf-kart { position: relative; overflow: hidden; padding: clamp(24px, 2.6vw, 34px); border-radius: 28px; background: #fff; border: 1px solid rgba(18, 19, 43, .07); box-shadow: 0 20px 44px -34px rgba(18, 19, 43, .5); }
.gf-kart::after { content: ""; position: absolute; right: -40px; top: -40px; width: 160px; height: 160px; border-radius: 50%; background: radial-gradient(circle, rgba(225, 38, 44, .14), transparent 70%); }
.gf-kart-etiket { margin-bottom: 14px !important; font-size: 11.5px; font-weight: 800; letter-spacing: .24em; text-transform: uppercase; color: #c8161d; }
.gf-kart h3 { margin-bottom: 12px; font-size: 22px; font-weight: 700; line-height: 1.2; letter-spacing: -.02em; color: #12132b; }
.gf-kart p { font-size: 15px; line-height: 1.7; }
.gf-kart--koyu { color: rgba(255, 255, 255, .78); background: radial-gradient(circle at 100% 0%, rgba(225, 38, 44, .4), transparent 55%), radial-gradient(circle at 0% 100%, rgba(79, 76, 214, .45), transparent 60%), #0f1030; border-color: transparent; }
.gf-kart--koyu h3 { color: #fff; }
.gf-kart--koyu .gf-kart-etiket { color: #ff8a6e; }
.gf-derece { display: flex; gap: 10px; margin: 6px 0 16px; }
.sayfa-icerik .gf .gf-derece li { flex: 1; padding: 16px; border-radius: 18px; background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .14); }
.gf-derece b { display: block; font-size: 24px; font-weight: 800; letter-spacing: -.03em; color: #fff; }
.gf-derece span { font-size: 12px; font-weight: 700; letter-spacing: .14em; color: #ffb27a; }
.gf-ilke { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.sayfa-icerik .gf .gf-ilke li { padding: 8px 14px; border-radius: 40px; font-size: 13px; font-weight: 700; color: #12132b; background: rgba(47, 45, 132, .08); border: 1px solid rgba(47, 45, 132, .16); }

.gf-alt { position: relative; overflow: hidden; isolation: isolate; margin-top: clamp(48px, 6vw, 80px); padding: clamp(30px, 4vw, 60px); border-radius: 32px; text-align: center; color: #fff; background: linear-gradient(135deg, #1b1a52, #0b0b1f); }
.gf-alt::before { content: "ZNO"; position: absolute; right: -.04em; bottom: -.2em; z-index: -1; font-size: clamp(120px, 16vw, 240px); font-weight: 800; line-height: 1; letter-spacing: -.06em; color: transparent; -webkit-text-stroke: 1.5px rgba(255, 255, 255, .08); }
.gf-alt p { max-width: 860px; margin: 0 auto; font-size: clamp(19px, 2vw, 28px); font-weight: 600; line-height: 1.4; letter-spacing: -.02em; }
.gf-alt p em { font-style: normal; color: #ff8a6e; }
@media (max-width: 900px) {
  .gf-ust, .gf-izgara { grid-template-columns: 1fr; }
  .gf-rakam { grid-template-columns: 1fr 1fr; }
}

/* Hakkımızda sayfası (.hk) */
.hk{--l:#12132b;--k:#e1262c;--s:rgba(18,19,43,.7);font-size:16px;line-height:1.7;color:var(--s)}

.hk *{box-sizing:border-box;margin:0;padding:0}

.hk ul,.hk ol{list-style:none;padding:0;margin:0}

.hk li,.sayfa-icerik .hk li{padding:0;margin:0}

.hk li::before{content:none!important;display:none!important}

.hk h2,.hk h3{color:var(--l);margin:0}

.hk h2::before{content:none!important;display:none!important}

.hk img{display:block;max-width:100%;border-radius:0}

.hk-etiket{display:inline-flex;align-items:center;gap:12px;margin-bottom:14px;font-size:12px;font-weight:800;letter-spacing:.28em;text-transform:uppercase;color:rgba(18,19,43,.6)}

.hk-etiket::before{content:"";width:28px;height:2px;border-radius:2px;background:var(--k)}

.hk-baslik{font-size:clamp(30px,3.4vw,50px);font-weight:700;line-height:1.05;letter-spacing:-.04em}

.hk-baslik em{font-style:normal;color:transparent;background:linear-gradient(100deg,#2f2d84,#c8161d 60%,#ff7a3d);-webkit-background-clip:text;background-clip:text}

.hk-bolum{margin-top:clamp(56px,7vw,100px)}

/* giriş */
.hk-giris{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,4vw,64px);align-items:center}

.hk-giris p{font-size:17px;line-height:1.8}

.hk-giris p+p{margin-top:16px}

.hk-giris strong{color:var(--l)}

.hk-giris .hk-baslik{margin-bottom:22px}

.hk-foto{position:relative;border-radius:30px;overflow:hidden;aspect-ratio:4/3.4;box-shadow:0 40px 80px -45px rgba(18,19,43,.6)}

.hk-foto img{width:100%;height:100%;object-fit:cover}

.hk-foto span{position:absolute;left:18px;bottom:18px;display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:40px;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#fff;background:rgba(7,8,13,.55);border:1px solid rgba(255,255,255,.22)}

.hk-foto span::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--k);box-shadow:0 0 0 4px rgba(225,38,44,.3)}

/* rakamlar */
.hk-rakam{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:clamp(40px,5vw,64px)}

.hk-rakam div{padding:24px;border-radius:24px;background:#fff;border:1px solid rgba(18,19,43,.07);box-shadow:0 18px 40px -32px rgba(18,19,43,.5)}

.hk-rakam div:first-child{background:#12132b;border-color:transparent}

.hk-rakam div:nth-child(2){background:linear-gradient(140deg,#e1262c,#a8121a);border-color:transparent}

.hk-rakam b{display:flex;align-items:baseline;gap:3px;font-size:clamp(32px,3vw,46px);font-weight:800;line-height:1;letter-spacing:-.05em;color:var(--l)}

.hk-rakam small{font-size:.48em;font-weight:700;color:var(--k)}

.hk-rakam span{display:block;margin-top:10px;font-size:13.5px;line-height:1.45}

.hk-rakam div:first-child b{color:transparent;background:linear-gradient(100deg,#ffb27a,#ff6d2a 40%,#e1262c);-webkit-background-clip:text;background-clip:text}

.hk-rakam div:first-child span,.hk-rakam div:nth-child(2) span{color:rgba(255,255,255,.8)}

.hk-rakam div:nth-child(2) b,.hk-rakam div:nth-child(2) small{color:#fff}

/* tarihçe */
.hk-yol{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-top:34px}

.hk-yol::before{content:"";position:absolute;left:0;right:0;top:27px;height:2px;background:linear-gradient(90deg,#2f2d84,#e1262c 60%,#ffb27a)}

.hk .hk-yol li,.sayfa-icerik .hk .hk-yol li{position:relative;padding:60px 0 0}

.hk-yol li::after{content:"";position:absolute;left:0;top:19px;width:18px;height:18px;border-radius:50%;background:#f4f3ef;border:3px solid var(--k);box-shadow:0 0 0 6px rgba(225,38,44,.12)}

.hk-yol b{display:block;font-size:28px;font-weight:800;letter-spacing:-.04em;color:transparent;background:linear-gradient(0deg,#a8121a,#e1262c 40%,#ff6d2a 75%,#ffb27a);-webkit-background-clip:text;background-clip:text}

.hk-yol h3{margin:6px 0 8px;font-size:17px;font-weight:700;letter-spacing:-.01em;line-height:1.3}

.hk-yol p{font-size:14px;line-height:1.6}

/* koyu bant: üretim */
.hk-koyu{position:relative;overflow:hidden;isolation:isolate;display:grid;grid-template-columns:1fr 1fr;border-radius:32px;background:#0b0b22;color:rgba(255,255,255,.78)}

.hk-koyu::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse 60% 80% at 0% 100%,rgba(225,38,44,.35),transparent 60%),radial-gradient(ellipse 50% 70% at 100% 0%,rgba(79,76,214,.4),transparent 60%)}

.hk-koyu-metin{padding:clamp(28px,4vw,56px)}

.hk-koyu .hk-etiket{color:rgba(255,255,255,.65)}

.hk-koyu .hk-baslik{color:#fff;margin-bottom:20px}

.hk-koyu p+p{margin-top:14px}

.hk-koyu strong{color:#fff}

.hk-koyu-foto{min-height:340px;background-repeat:no-repeat;background-image:url(/wp-content/themes/saha-wp/assets/images/hat-ergitme-1600.webp);background-size:cover;background-position:60% 50%}

.hk-cip{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}

.hk .hk-cip li,.sayfa-icerik .hk .hk-cip li{padding:8px 14px;border-radius:40px;font-size:13px;font-weight:700;color:#fff;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18)}

/* iki kart */
.hk-iki{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:34px}

.hk-kart{position:relative;overflow:hidden;padding:clamp(24px,3vw,40px);border-radius:28px;background:#fff;border:1px solid rgba(18,19,43,.07);box-shadow:0 20px 44px -34px rgba(18,19,43,.5)}

.hk-kart::after{content:"";position:absolute;right:-40px;top:-40px;width:160px;height:160px;border-radius:50%;background:radial-gradient(circle,rgba(225,38,44,.14),transparent 70%)}

.hk-kart i{display:grid;place-items:center;width:52px;height:52px;margin-bottom:18px;border-radius:16px;font-style:normal;font-size:13px;font-weight:800;letter-spacing:.06em;color:#fff;background:linear-gradient(135deg,#2f2d84,#e1262c)}

.hk-kart h3{margin-bottom:10px;font-size:22px;font-weight:700;letter-spacing:-.02em}

.hk-kart p{font-size:15px;line-height:1.7}

.hk-kart strong{color:var(--l)}

/* amaç */
.hk-amac{position:relative;padding:clamp(30px,4vw,60px);border-radius:32px;text-align:center;background:linear-gradient(135deg,#1b1a52,#0b0b1f);color:#fff;overflow:hidden;isolation:isolate}

.hk-amac::before{content:"“";position:absolute;left:50%;top:-.18em;z-index:-1;transform:translateX(-50%);font-size:280px;font-weight:800;line-height:1;color:rgba(255,255,255,.05)}

.hk-amac p{max-width:900px;margin:0 auto;font-size:clamp(20px,2.1vw,30px);font-weight:600;line-height:1.4;letter-spacing:-.02em}

.hk-amac p em{font-style:normal;color:#ff8a6e}

.hk-amac small{display:block;margin-top:18px;font-size:12px;font-weight:800;letter-spacing:.26em;text-transform:uppercase;color:rgba(255,255,255,.55)}

.hk-amac a{display:inline-flex;align-items:center;gap:10px;margin-top:28px;padding:15px 26px;border-radius:60px;font-size:15px;font-weight:700;color:#12132b!important;background:#fff;text-decoration:none!important;transition:transform .4s}

.hk-amac a:hover{transform:translateY(-2px)}

@media (max-width:900px){
.hk-giris,.hk-koyu,.hk-iki{grid-template-columns:1fr}

.hk-rakam{grid-template-columns:1fr 1fr}

.hk-yol{grid-template-columns:1fr;gap:0;margin-left:8px}

.hk-yol::before{left:8px;right:auto;top:0;bottom:0;width:2px;height:auto;background:linear-gradient(180deg,#2f2d84,#e1262c 60%,#ffb27a)}

.hk .hk-yol li,.sayfa-icerik .hk .hk-yol li{padding:0 0 26px 40px}

.hk-yol li::after{left:0;top:6px}

.hk-koyu-foto{min-height:240px;order:-1}

}


/* İletişim sayfası (.il) — başlık, üç kart, harita, panel + form; form alanları .form (tema) */
.il { font-size: 16px; line-height: 1.7; color: rgba(18, 19, 43, .72); }
.il *, .il *::before, .il *::after { box-sizing: border-box; }
.il p, .il h2, .il h3, .il dl, .il dd { margin: 0; padding: 0; }
.sayfa-icerik .il h2, .sayfa-icerik .il h3 { margin-top: 0; }
.sayfa-icerik .il a { color: inherit; font-weight: inherit; text-decoration: none; transition: color .3s; }
.il h2 em { font-style: normal; color: transparent; background: linear-gradient(100deg, #2f2d84, #c8161d 60%, #ff7a3d); -webkit-background-clip: text; background-clip: text; }

/* kartlar: üçü aynı, eşit yükseklikte */
.il-kartlar { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; align-items: stretch; }
.il-kart { position: relative; overflow: hidden; isolation: isolate; display: flex; flex-direction: column; align-items: center; padding: 40px 28px 30px; border-radius: 24px; text-align: center; background: #fff; border: 1px solid rgba(47, 45, 132, .12); box-shadow: 0 24px 50px -40px rgba(18, 19, 43, .45); animation: il-gir .9s cubic-bezier(.2, .8, .2, 1) both; transition: transform .5s cubic-bezier(.2, .8, .2, 1), box-shadow .5s, border-color .5s; }
.il-kart:nth-child(2) { animation-delay: .1s; }
.il-kart:nth-child(3) { animation-delay: .2s; }
@keyframes il-gir { from { opacity: 0; transform: translateY(26px); } }
.il-kart::before { content: ""; position: absolute; left: 50%; bottom: -120px; z-index: -1; width: 280px; height: 220px; margin-left: -140px; border-radius: 50%; background: radial-gradient(closest-side, rgba(225, 38, 44, .14), rgba(79, 76, 214, .1) 55%, transparent); opacity: 0; transform: translateY(30px); transition: opacity .6s, transform .6s cubic-bezier(.2, .8, .2, 1); }
.il-kart:hover { transform: translateY(-8px); border-color: rgba(47, 45, 132, .22); box-shadow: 0 40px 70px -40px rgba(47, 45, 132, .5); }
.il-kart:hover::before { opacity: 1; transform: none; }
.il-ikon { position: relative; display: grid; place-items: center; width: 68px; height: 68px; border-radius: 50%; background: linear-gradient(135deg, #2f2d84, #c8161d); box-shadow: 0 16px 30px -14px rgba(200, 22, 29, .6); transition: transform .5s cubic-bezier(.2, .8, .2, 1); }
.il-ikon::after { content: ""; position: absolute; inset: -8px; border-radius: 50%; border: 1px dashed rgba(47, 45, 132, .25); transition: transform 1.2s cubic-bezier(.2, .8, .2, 1); }
.il-ikon svg { width: 26px; height: 26px; fill: none; stroke: #fff; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.il-kart:hover .il-ikon { transform: scale(1.06); }
.il-kart:hover .il-ikon::after { transform: rotate(140deg); }
.il-kart h3 { margin: 26px 0 12px !important; font-size: 12px; font-weight: 800; letter-spacing: .24em; text-transform: uppercase; color: rgba(18, 19, 43, .5); }
.il-kart p { font-size: 17px; font-weight: 600; line-height: 1.85; color: #12132b; overflow-wrap: anywhere; }
.sayfa-icerik .il .il-kart p a:hover { color: #c8161d; }
.sayfa-icerik .il .il-eylem { display: inline-flex; align-items: center; gap: 8px; margin-top: 24px; padding: 11px 20px; border-radius: 40px; font-size: 13.5px; font-weight: 700; color: #2f2d84; background: rgba(47, 45, 132, .07); transition: background .4s, color .4s; }
.il-kartlar .il-kart > p { flex: 1; }
.sayfa-icerik .il .il-eylem:hover, .il-kart:hover .il-eylem { color: #fff; background: #2f2d84; }
.il-eylem i { font-style: normal; transition: transform .4s; }
.il-kart:hover .il-eylem i { transform: translateX(4px); }

/* harita */
.il-harita { position: relative; overflow: hidden; height: clamp(360px, 34vw, 480px); margin-top: 40px; border-radius: 20px; background: #e9e8e3; border: 1px solid rgba(18, 19, 43, .08); box-shadow: 0 30px 60px -45px rgba(18, 19, 43, .5); }
.il-harita iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.il-harita-kart { position: absolute; right: 18px; top: 18px; display: flex; align-items: center; gap: 14px; padding: 12px 12px 12px 18px; border-radius: 60px; background: #fff; box-shadow: 0 16px 34px -14px rgba(18, 19, 43, .45); }
.il-harita-kart b { display: block; font-size: 14px; line-height: 1.3; color: #12132b; }
.il-harita-kart small { font-size: 12.5px; color: rgba(18, 19, 43, .55); }
.sayfa-icerik .il .il-harita-kart a { white-space: nowrap; padding: 10px 18px; border-radius: 40px; font-size: 13.5px; font-weight: 700; color: #fff; background: #2f2d84; transition: background .3s; }
.sayfa-icerik .il .il-harita-kart a:hover { background: #c8161d; }
.il-nabiz { position: relative; flex: none; width: 10px; height: 10px; border-radius: 50%; background: #e1262c; }
.il-nabiz::after { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 2px solid #e1262c; animation: il-nabiz 2s cubic-bezier(.2, .6, .3, 1) infinite; }
@keyframes il-nabiz { from { transform: scale(1); opacity: .9; } to { transform: scale(3.4); opacity: 0; } }

/* panel + form */
.il-form-alan { display: grid; grid-template-columns: .85fr 1.15fr; margin-top: 50px; border-radius: 20px; overflow: hidden; background: #fff; border: 1px solid rgba(47, 45, 132, .16); box-shadow: 0 30px 60px -45px rgba(18, 19, 43, .5); }
.il-panel { position: relative; overflow: hidden; isolation: isolate; padding: clamp(30px, 4vw, 52px); color: rgba(255, 255, 255, .7); background: radial-gradient(circle at 100% 0%, rgba(225, 38, 44, .38), transparent 55%), radial-gradient(circle at 0% 100%, rgba(79, 76, 214, .4), transparent 60%), #0f1030; }
.il-panel::before { content: "SAHA"; position: absolute; right: -.04em; bottom: -.22em; z-index: -1; font-size: clamp(90px, 10vw, 150px); font-weight: 800; line-height: 1; letter-spacing: -.06em; color: transparent; -webkit-text-stroke: 1.5px rgba(255, 255, 255, .07); }
.il-panel .sp-etiket { color: rgba(255, 255, 255, .6); }
.il-panel h2 { font-size: clamp(30px, 3vw, 44px); font-weight: 700; letter-spacing: -.04em; color: #fff; }
.il-panel h2 em { background: linear-gradient(100deg, #ffb27a, #ff6d2a 45%, #e1262c); -webkit-background-clip: text; background-clip: text; }
.il-panel > p:not(.sp-etiket) { margin-top: 12px; font-size: 15.5px; }
.il-panel-liste { margin-top: 30px !important; }
.il-panel-liste > div { padding: 14px 0; border-top: 1px solid rgba(255, 255, 255, .12); }
.il-panel-liste dt { font-size: 11px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: #ff8a6e; }
.il-panel-liste dd { margin-top: 2px; font-size: 15.5px; font-weight: 600; color: #fff; overflow-wrap: anywhere; }
.sayfa-icerik .il .il-panel-liste a:hover { color: #ff8a6e; }
.il .il-form { padding: clamp(28px, 3.6vw, 48px); border-radius: 0; box-shadow: none; }
.il-form-alt { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin-top: 4px; }
.il-gonder { display: inline-flex; align-items: center; gap: 10px; padding: 15px 32px; border: 0; border-radius: 60px; font: inherit; font-size: 15px; font-weight: 700; color: #fff; background: #2f2d84; cursor: pointer; transition: background .3s, transform .3s; }
.il-gonder:hover { background: #c8161d; transform: translateY(-2px); }
.il-gonder span { transition: transform .3s; }
.il-gonder:hover span { transform: translateX(4px); }

@media (prefers-reduced-motion: reduce) { .il-kart, .il-nabiz::after { animation: none !important; } }
@media (max-width: 900px) {
  .il-kartlar, .il-form-alan { grid-template-columns: 1fr; }
  .il-kartlar { gap: 16px; }
  .il-harita { margin-top: 24px; }
}
@media (max-width: 560px) {
  .il-harita-kart { left: 12px; right: 12px; top: auto; bottom: 30px; justify-content: space-between; }
}

/* Kurumsal sayfası (.kr) — etiket/başlık sınıfları .hk ile ortak */
.kr { font-size: 16px; line-height: 1.7; color: rgba(18, 19, 43, .7); }
.kr *, .kr *::before, .kr *::after { box-sizing: border-box; }
.kr p, .kr h2, .kr h3, .kr ul, .kr li { margin: 0; padding: 0; }
.kr ul { list-style: none; }
.sayfa-icerik .kr li { padding: 0; margin: 0; }
.kr li::before, .kr h2::before { content: none !important; display: none !important; }
.kr a { text-decoration: none !important; color: inherit; font-weight: inherit; }
.kr .hk-etiket { display: inline-flex; align-items: center; gap: 12px; margin-bottom: 14px; font-size: 12px; font-weight: 800; letter-spacing: .28em; text-transform: uppercase; color: rgba(18, 19, 43, .6); }
.kr .hk-etiket::before { content: ""; width: 28px; height: 2px; border-radius: 2px; background: #e1262c; }
.kr .hk-baslik { font-size: clamp(30px, 3.4vw, 50px); font-weight: 700; line-height: 1.05; letter-spacing: -.04em; color: #12132b; }
.kr .hk-baslik em { font-style: normal; color: transparent; background: linear-gradient(100deg, #2f2d84, #c8161d 60%, #ff7a3d); -webkit-background-clip: text; background-clip: text; }

/* üst: metin + künye */
.kr-ust { display: grid; grid-template-columns: 1.2fr .8fr; gap: clamp(28px, 4vw, 64px); align-items: end; }
.kr-ust-metin .hk-baslik { margin-bottom: 20px; }
.kr-ust-metin p:last-child { max-width: 640px; font-size: 17px; line-height: 1.8; }
.kr-kunye { border-radius: 26px; padding: 8px 26px; background: #fff; border: 1px solid rgba(18, 19, 43, .07); box-shadow: 0 20px 44px -34px rgba(18, 19, 43, .5); }
.kr-kunye li { display: flex; justify-content: space-between; gap: 16px; padding: 14px 0; border-bottom: 1px solid rgba(18, 19, 43, .07); font-size: 14px; }
.kr-kunye li:last-child { border-bottom: 0; }
.kr-kunye span { font-size: 11px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: rgba(18, 19, 43, .45); padding-top: 2px; }
.kr-kunye b { font-weight: 700; color: #12132b; text-align: right; }

/* kart ızgarası */
.kr-izgara { display: grid; grid-template-columns: 1.25fr 1fr 1fr; grid-template-rows: 280px 280px; gap: 14px; margin-top: clamp(40px, 5vw, 70px); }
.kr-kart { position: relative; display: flex; flex-direction: column; justify-content: flex-end; overflow: hidden; isolation: isolate; padding: 26px; border-radius: 28px; color: #fff; background: #0d0f18; transition: transform .5s cubic-bezier(.16, 1, .3, 1), box-shadow .5s; }
.kr-kart:hover { transform: translateY(-5px); box-shadow: 0 34px 60px -34px rgba(225, 38, 44, .55); }
.kr-kart img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s cubic-bezier(.16, 1, .3, 1); }
.kr-kart:hover img { transform: scale(1.05); }
.kr-kart::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(7, 8, 13, .25) 0%, rgba(7, 8, 13, 0) 35%, rgba(7, 8, 13, .88) 100%); }
.kr-kart--buyuk { grid-row: 1 / 3; }
.kr-kart--grup { grid-column: 2 / 4; background: radial-gradient(circle at 100% 0%, rgba(225, 38, 44, .4), transparent 55%), radial-gradient(circle at 0% 100%, rgba(79, 76, 214, .45), transparent 60%), #0f1030; }
.kr-kart--grup::after, .kr-kart--belge::after { content: none; }
.kr-kart--belge { background: linear-gradient(150deg, #e1262c, #a8121a); }
.kr-no { position: absolute; left: 22px; top: 22px; padding: 7px 12px; border-radius: 40px; font-size: 12px; font-weight: 800; letter-spacing: .14em; background: rgba(7, 8, 13, .5); border: 1px solid rgba(255, 255, 255, .22); }
.kr-kart-alt { position: relative; padding-right: 40px; }
.kr-kart h3 { margin-bottom: 6px; font-size: clamp(22px, 2vw, 30px); font-weight: 700; letter-spacing: -.03em; color: #fff; }
.kr-kart p { font-size: 14px; line-height: 1.55; color: rgba(255, 255, 255, .8); }
.kr-mini { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.kr-mini li { padding: 7px 12px; border-radius: 40px; font-size: 12.5px; color: rgba(255, 255, 255, .8); background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .14); }
.kr-mini b { color: #ffb27a; font-weight: 800; }
.kr-belgeler { position: absolute; right: 22px; top: 22px; display: flex; }
.kr-belgeler img { position: static; width: 54px; height: 72px; border-radius: 6px; object-fit: cover; object-position: top; box-shadow: 0 10px 20px -8px rgba(0, 0, 0, .5); }
.kr-belgeler img + img { margin-left: -16px; }
.kr-belgeler img:nth-child(1) { transform: rotate(-8deg); }
.kr-belgeler img:nth-child(3) { transform: rotate(8deg); }
.kr-ok { position: absolute; right: 0; bottom: 6px; width: 34px; height: 34px; border-radius: 50%; background: #fff; transition: transform .5s cubic-bezier(.16, 1, .3, 1); }
.kr-ok::before { content: ""; position: absolute; left: 10px; top: 16px; width: 13px; height: 2px; background: #12132b; }
.kr-ok::after { content: ""; position: absolute; left: 15px; top: 12.5px; width: 7px; height: 7px; border-top: 2px solid #12132b; border-right: 2px solid #12132b; transform: rotate(45deg); }
.kr-kart:hover .kr-ok, .kr-pol:hover .kr-ok { transform: rotate(-45deg); }

/* politikalar */
.kr-politika { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 14px; }
.kr-pol { position: relative; display: flex; flex-direction: column; gap: 16px; padding: 26px 26px 64px; border-radius: 26px; background: #fff; border: 1px solid rgba(18, 19, 43, .07); box-shadow: 0 20px 44px -34px rgba(18, 19, 43, .5); transition: transform .5s cubic-bezier(.16, 1, .3, 1), border-color .4s; }
.kr-pol:hover { transform: translateY(-4px); border-color: rgba(225, 38, 44, .35); }
.kr-pol-ikon { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 16px; background: linear-gradient(135deg, #2f2d84, #e1262c); }
.kr-pol-ikon svg { width: 24px; height: 24px; fill: none; stroke: #fff; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.kr-pol h3 { margin-bottom: 6px; font-size: 19px; font-weight: 700; letter-spacing: -.02em; color: #12132b; }
.kr-pol p { font-size: 14.5px; line-height: 1.6; }
.kr-pol .kr-ok { right: 22px; bottom: 22px; background: #12132b; }
.kr-pol .kr-ok::before { background: #fff; }
.kr-pol .kr-ok::after { border-color: #fff; }
@media (max-width: 900px) {
  .kr-ust, .kr-politika { grid-template-columns: 1fr; }
  .kr-izgara { grid-template-columns: 1fr; grid-template-rows: none; }
  .kr-kart, .kr-kart--buyuk, .kr-kart--grup { grid-row: auto; grid-column: auto; min-height: 260px; }
  .kr-kart--buyuk { min-height: 340px; }
}
/* tema içerik stillerini ezen özgüllük düzeltmeleri */
.kr .kr-kart, .kr .kr-no { color: #fff; }
.sayfa-icerik .kr .kr-kunye { padding: 8px 26px; }
.sayfa-icerik .kr .kr-mini li { padding: 7px 12px; }

/* Kişisel Verilerin Korunması sayfası (.kv) */
.kv { font-size: 16px; line-height: 1.75; color: rgba(18, 19, 43, .72); }
.kv *, .kv *::before, .kv *::after { box-sizing: border-box; }
.kv p, .kv h2, .kv h3, .kv h4, .kv ul, .kv ol, .kv dl, .kv dd { margin: 0; padding: 0; }
.kv ul, .kv ol { list-style: none; }
.sayfa-icerik .kv h2, .sayfa-icerik .kv h3, .sayfa-icerik .kv h4 { margin-top: 0; }
.sayfa-icerik .kv li { padding: 0; margin: 0; }
.sayfa-icerik .kv li::before { content: none; }
.sayfa-icerik .kv a { color: inherit; font-weight: inherit; text-decoration: none; }
.kv strong { color: #12132b; }

/* üst: koyu kart + belgeler */
.kv-ust { position: relative; overflow: hidden; isolation: isolate; display: grid; grid-template-columns: 1.35fr .65fr; gap: clamp(28px, 4vw, 56px); padding: clamp(30px, 4vw, 56px); border-radius: 34px; color: rgba(255, 255, 255, .72); background: radial-gradient(circle at 100% 0%, rgba(225, 38, 44, .42), transparent 50%), radial-gradient(circle at 0% 100%, rgba(79, 76, 214, .45), transparent 55%), #0f1030; box-shadow: 0 50px 90px -55px rgba(18, 19, 43, .8); }
.kv-ust::before { content: "KVKK"; position: absolute; right: -.03em; bottom: -.22em; z-index: -1; font-size: clamp(120px, 15vw, 230px); font-weight: 800; line-height: 1; letter-spacing: -.06em; color: transparent; -webkit-text-stroke: 1.5px rgba(255, 255, 255, .07); }
.kv-ust .sp-etiket { color: rgba(255, 255, 255, .6); }
.kv-ust h2 { font-size: clamp(32px, 3.8vw, 56px); font-weight: 700; line-height: 1.03; letter-spacing: -.045em; color: #fff; }
.kv-ust h2 em { font-style: normal; color: transparent; background: linear-gradient(100deg, #ffb27a, #ff6d2a 45%, #e1262c); -webkit-background-clip: text; background-clip: text; }
.kv-ust-metin > p:last-child { margin-top: 22px; font-size: 15px; line-height: 1.85; }
.kv-belgeler { display: grid; gap: 10px; align-content: center; }
.kv-belgeler-bas { font-size: 11px; font-weight: 800; letter-spacing: .24em; text-transform: uppercase; color: #ff8a6e; }
.sayfa-icerik .kv .kv-belge { display: grid; grid-template-columns: 44px 1fr auto; gap: 14px; align-items: center; padding: 14px 16px; border-radius: 20px; background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .14); transition: background .4s, transform .4s, border-color .4s; }
.sayfa-icerik .kv .kv-belge:hover { background: rgba(255, 255, 255, .13); border-color: rgba(255, 138, 110, .5); transform: translateX(4px); }
.kv-belge svg { width: 44px; height: 44px; padding: 10px; border-radius: 14px; fill: none; stroke: #fff; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; background: linear-gradient(135deg, #2f2d84, #c8161d); }
.kv-belge b { display: block; font-size: 14.5px; font-weight: 700; line-height: 1.3; color: #fff; }
.kv-belge small { font-size: 12px; font-weight: 700; letter-spacing: .08em; color: rgba(255, 255, 255, .55); }
.kv-belge i { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; font-style: normal; color: #fff; border: 1px solid rgba(255, 255, 255, .25); transition: background .4s, border-color .4s; }
.kv-belge:hover i { background: #e1262c; border-color: transparent; }

/* özet şeridi */
.kv-ozet { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 12px !important; }
.sayfa-icerik .kv .kv-ozet li { padding: 20px 22px; border-radius: 22px; background: #fff; border: 1px solid rgba(18, 19, 43, .07); box-shadow: 0 18px 40px -32px rgba(18, 19, 43, .5); }
.kv-ozet span { display: block; font-size: 11px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: #c8161d; }
.kv-ozet b { display: block; margin-top: 4px; font-size: 16px; font-weight: 700; line-height: 1.35; color: #12132b; overflow-wrap: anywhere; }

/* gövde: içindekiler + maddeler */
.kv-govde { display: grid; grid-template-columns: 270px 1fr; gap: clamp(20px, 3vw, 40px); align-items: start; margin-top: 50px; }
.kv-icindekiler { position: sticky; top: 110px; padding: 22px; border-radius: 26px; background: #fff; border: 1px solid rgba(18, 19, 43, .07); box-shadow: 0 20px 44px -36px rgba(18, 19, 43, .5); }
.kv-icindekiler > p { font-size: 11px; font-weight: 800; letter-spacing: .22em; text-transform: uppercase; color: rgba(18, 19, 43, .5); }
.kv-ilerleme { display: block; height: 3px; margin: 12px 0 8px; border-radius: 3px; background: rgba(18, 19, 43, .08); overflow: hidden; }
.kv-ilerleme i { display: block; height: 100%; background: linear-gradient(90deg, #2f2d84, #e1262c); transform: scaleX(var(--kv, 0)); transform-origin: left; }
.sayfa-icerik .kv .kv-icindekiler a { display: grid; grid-template-columns: 26px 1fr; gap: 6px; padding: 9px 10px; margin: 0 -10px; border-radius: 12px; font-size: 13.5px; font-weight: 600; line-height: 1.35; color: rgba(18, 19, 43, .7); transition: background .3s, color .3s; }
.kv-icindekiler a span { font-size: 11.5px; font-weight: 800; color: rgba(18, 19, 43, .35); transition: color .3s; }
.sayfa-icerik .kv .kv-icindekiler a:hover { color: #12132b; background: rgba(47, 45, 132, .05); }
.sayfa-icerik .kv .kv-icindekiler a.is-aktif { color: #12132b; background: rgba(225, 38, 44, .08); }
.kv-icindekiler a.is-aktif span { color: #e1262c; }

.kv-maddeler { display: grid; gap: 14px; }
.kv-madde { scroll-margin-top: 110px; padding: clamp(24px, 3vw, 40px); border-radius: 30px; background: #fff; border: 1px solid rgba(18, 19, 43, .07); box-shadow: 0 20px 44px -36px rgba(18, 19, 43, .5); }
.kv-madde-bas { display: flex; align-items: center; gap: 16px; margin-bottom: 16px; }
.kv-no { flex: none; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 16px; font-size: 15px; font-weight: 800; color: #fff; background: linear-gradient(135deg, #2f2d84, #c8161d); box-shadow: 0 12px 24px -12px rgba(200, 22, 29, .7); }
.kv-madde h3 { font-size: clamp(20px, 1.8vw, 25px); font-weight: 700; line-height: 1.2; letter-spacing: -.025em; color: #12132b; }
.kv-madde > p { font-size: 15.5px; }
.kv-madde > p + p { margin-top: 12px; }
.kv-madde > p + * { margin-top: 20px !important; }

.kv-kunye { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.kv-kunye > div { padding: 16px 18px; border-radius: 18px; background: #f6f5f1; }
.kv-kunye dt { font-size: 11px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: #c8161d; }
.kv-kunye dd { margin-top: 2px; font-size: 15px; font-weight: 600; color: #12132b; }

.kv-kategori { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.kv-kategori article { padding: 20px; border-radius: 22px; background: #f6f5f1; }
.kv-kat-ikon { display: inline-grid; place-items: center; width: 40px; height: 40px; margin-bottom: 10px; border-radius: 13px; background: #12132b; }
.kv-kat-ikon svg { width: 20px; height: 20px; fill: none; stroke: #fff; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.kv-kategori h4 { margin-bottom: 10px !important; font-size: 16px; font-weight: 700; color: #12132b; }
.kv-cip { display: flex; flex-wrap: wrap; gap: 6px; }
.sayfa-icerik .kv .kv-cip li { padding: 5px 11px; border-radius: 30px; font-size: 13px; font-weight: 600; line-height: 1.4; color: #12132b; background: #fff; border: 1px solid rgba(18, 19, 43, .1); }
.sayfa-icerik .kv .kv-cip--buyuk li { padding: 10px 16px; font-size: 14px; background: rgba(47, 45, 132, .06); border-color: rgba(47, 45, 132, .14); }

.kv-onay { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.sayfa-icerik .kv .kv-onay li { position: relative; padding: 12px 14px 12px 44px; border-radius: 16px; font-size: 14.5px; line-height: 1.45; color: #12132b; background: #f6f5f1; }
.sayfa-icerik .kv .kv-onay li::before { content: ""; position: absolute; left: 14px; top: 13px; width: 18px; height: 18px; border-radius: 50%; background: #e1262c url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='m5 9.2 2.6 2.5L13 6.4' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 18px no-repeat; }

.kv-sira { display: grid; gap: 8px; counter-reset: kv; }
.sayfa-icerik .kv .kv-sira li { position: relative; counter-increment: kv; padding: 12px 16px 12px 52px; border-radius: 16px; font-size: 14.5px; line-height: 1.6; background: #f6f5f1; }
.sayfa-icerik .kv .kv-sira li::before { content: counter(kv, lower-alpha) ")"; position: absolute; left: 18px; top: 12px; font-size: 14px; font-weight: 800; color: #c8161d; }

.kv-haklar { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; counter-reset: hk; }
.sayfa-icerik .kv .kv-haklar li { position: relative; counter-increment: hk; padding: 52px 18px 18px; border-radius: 20px; font-size: 14.5px; font-weight: 600; line-height: 1.45; color: #12132b; background: #f6f5f1; transition: background .4s, color .4s, transform .4s; }
.sayfa-icerik .kv .kv-haklar li::before { content: counter(hk, decimal-leading-zero); position: absolute; left: 18px; top: 16px; font-size: 22px; font-weight: 800; letter-spacing: -.04em; color: transparent; -webkit-text-stroke: 1.2px #c8161d; }
.sayfa-icerik .kv .kv-haklar li:hover { color: #fff; background: #12132b; transform: translateY(-3px); }
.sayfa-icerik .kv .kv-haklar li:hover::before { -webkit-text-stroke-color: #ff8a6e; }

/* başvuru */
.kv-madde--koyu { color: rgba(255, 255, 255, .72); background: linear-gradient(135deg, #1b1a52, #0b0b1f); border-color: transparent; }
.kv-madde--koyu h3, .kv-madde--koyu strong { color: #fff; }
.kv-madde--koyu .kv-no { color: #12132b; background: #fff; box-shadow: none; }
.sayfa-icerik .kv .kv-madde--koyu > p a { color: #ff8a6e; font-weight: 700; }
.kv-yollar { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.kv-yollar > * { display: block; padding: 18px 20px; border-radius: 20px; background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .14); }
.sayfa-icerik .kv .kv-yollar a:hover { background: rgba(255, 255, 255, .13); }
.kv-yollar span { display: block; font-size: 11px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: #ff8a6e; }
.kv-yollar b { display: block; margin-top: 6px; font-size: 15.5px; color: #fff; overflow-wrap: anywhere; }
.kv-yollar small { font-size: 13px; color: rgba(255, 255, 255, .55); }
.kv-not { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px !important; }
.sayfa-icerik .kv .kv-not li { display: flex; align-items: baseline; gap: 10px; padding: 12px 18px; border-radius: 40px; font-size: 13.5px; color: rgba(255, 255, 255, .7); border: 1px dashed rgba(255, 255, 255, .22); }
.kv-not b { font-size: 17px; color: #fff; }
.sayfa-icerik .kv .kv-belge--acik { margin-top: 18px; max-width: 420px; }

@media (max-width: 1100px) { .kv-haklar { grid-template-columns: 1fr 1fr; } }
@media (max-width: 900px) {
  .kv-ust, .kv-govde { grid-template-columns: 1fr; }
  .kv-ozet { grid-template-columns: 1fr 1fr; }
  .kv-icindekiler { position: static; }
  .kv-yollar { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .kv-ozet, .kv-kunye, .kv-kategori, .kv-onay, .kv-haklar { grid-template-columns: 1fr; }
  .kv-madde-bas { gap: 12px; }
  .kv-no { width: 40px; height: 40px; border-radius: 13px; font-size: 13px; }
}