/* Wand Production. Renk ve yazı tipi: marka/KIMLIK.md (değişirse önce orası). */
@font-face {
  font-family: "Geist";
  src: url("/fontlar/geist.woff2?v=1") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}

:root {
  --gece: #0B0B0B;
  --grafit: #1A1A1A;
  --grafit-2: #222222;
  --beyaz: #FFFFFF;
  --kagit: #F3F3F1;
  --kagit-2: #E8E8E5;
  --sari: #E4FF1A;
  --soluk-koyu: #9A9A9A;
  --soluk-acik: #6B6B6B;
  --cizgi-koyu: rgba(255, 255, 255, .1);
  --cizgi-acik: rgba(11, 11, 11, .1);

  --kap: 1200px;
  --yan: clamp(20px, 5vw, 48px);
  --bolum: clamp(88px, 12vw, 152px);
  --r-kart: 16px;
  --gecis: 220ms cubic-bezier(.2, .7, .2, 1);
  --ust-h: 72px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--ust-h) + 8px); }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body {
  margin: 0;
  background: var(--gece);
  color: var(--beyaz);
  font: 400 17px/1.6 "Geist", system-ui, -apple-system, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img, svg { display: block; max-width: 100%; }
a { color: inherit; }
h1, h2, h3, h4 { margin: 0; font-weight: 650; letter-spacing: -.045em; line-height: .98; }
p { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
:focus-visible { outline: 2px solid var(--sari); outline-offset: 3px; border-radius: 4px; }
.bolum--acik :focus-visible { outline-color: var(--gece); }

.kap { width: 100%; max-width: calc(var(--kap) + 2 * var(--yan)); margin: 0 auto; padding: 0 var(--yan); }
.atla { position: absolute; left: 12px; top: -60px; z-index: 100; background: var(--sari); color: var(--gece); padding: 12px 16px; border-radius: 999px; font-weight: 600; text-decoration: none; }
.atla:focus { top: 12px; }

/* Etiket: büyük harf elle yazılır (CSS uppercase + lang="tr" İngilizcede "İ" üretir) */
.etiket { font-size: 12px; font-weight: 500; letter-spacing: .14em; color: var(--soluk-koyu); line-height: 1.4; }
.bolum--acik .etiket { color: var(--soluk-acik); }

/* Vurgu: koyu zeminde sarı yazı; açık zeminde sarı yalnızca dolgu */
.vurgu { color: var(--sari); }
.dolgu { background: var(--sari); color: var(--gece); padding: 0 .12em; margin: 0 -.04em; -webkit-box-decoration-break: clone; box-decoration-break: clone; }

/* Bağ çizgisi: gönderilerdeki sarı çizgi ve varış noktası */
.bag { display: block; position: relative; height: 2px; background: var(--sari); }
.bag i { position: absolute; right: 0; top: 50%; width: 12px; height: 12px; margin-top: -6px; border-radius: 50%; background: var(--beyaz); box-shadow: 0 0 0 4px var(--gece); }

/* Düğmeler: tam yuvarlak, en az 48 px */
.dugme {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 48px; padding: 0 24px; border-radius: 999px; border: 1.5px solid transparent;
  font: 600 15px/1 "Geist", sans-serif; letter-spacing: -.01em; text-decoration: none; white-space: nowrap;
  cursor: pointer; transition: background var(--gecis), color var(--gecis), border-color var(--gecis), transform var(--gecis);
}
.dugme:active { transform: translateY(1px); }
.dugme--buyuk { min-height: 56px; padding: 0 30px; font-size: 16px; }
.dugme--kucuk { min-height: 48px; padding: 0 18px; font-size: 14px; }
.dugme--tam { width: 100%; }
.dugme--sari { background: var(--sari); color: var(--gece); }
.dugme--sari:hover { background: var(--beyaz); }
.dugme--cizgi { border-color: rgba(255, 255, 255, .28); color: var(--beyaz); }
.dugme--cizgi:hover { border-color: var(--beyaz); background: rgba(255, 255, 255, .06); }
.dugme--koyu { background: var(--gece); color: var(--beyaz); }
.dugme--koyu:hover { background: var(--grafit-2); }
.dugme--koyu:disabled { opacity: .6; cursor: progress; }

/* Üst çubuk */
.ust { position: fixed; inset: 0 0 auto; z-index: 50; height: var(--ust-h); transition: background var(--gecis), border-color var(--gecis); border-bottom: 1px solid transparent; }
.ust.dolu { background: rgba(11, 11, 11, .97); -webkit-backdrop-filter: blur(14px) saturate(1.2); backdrop-filter: blur(14px) saturate(1.2); border-bottom-color: var(--cizgi-koyu); }
.ust__ic { height: 100%; display: flex; align-items: center; gap: 24px; }
.ust__logo { display: flex; align-items: center; min-height: 48px; flex-shrink: 0; margin-right: auto; }
.ust__logo img { width: 96px; height: auto; }
.ust__nav { display: flex; align-items: center; gap: 4px; }
.ust__nav a:not(.dugme) { padding: 12px 14px; font-size: 15px; color: rgba(255, 255, 255, .78); text-decoration: none; border-radius: 999px; transition: color var(--gecis), background var(--gecis); }
.ust__nav a:not(.dugme):hover { color: var(--beyaz); background: rgba(255, 255, 255, .06); }
.ust__nav-cta { margin-left: 12px; }
.ust__cta, .ust__menu { display: none; }
.ust__dil { display: inline-flex; align-items: center; justify-content: center; min-width: 48px; min-height: 48px; padding: 0 10px; margin-left: -12px; border-radius: 999px; font-size: 13px; font-weight: 600; letter-spacing: .08em; color: rgba(255, 255, 255, .78); text-decoration: none; transition: color var(--gecis), background var(--gecis); }
.ust__dil:hover { color: var(--beyaz); background: rgba(255, 255, 255, .06); }

@media (max-width: 899px) {
  .ust__cta { display: inline-flex; }
  .ust__dil { margin-left: 0; margin-right: -12px; }
  .ust__ic { gap: 16px; }
  .ust__menu {
    display: grid; place-content: center; gap: 6px; width: 48px; height: 48px; margin-right: -8px;
    background: none; border: 0; color: var(--beyaz); cursor: pointer; border-radius: 999px;
  }
  .ust__menu span { display: block; width: 22px; height: 2px; background: currentColor; transition: transform var(--gecis); }
  .ust__menu[aria-expanded="true"] span:first-child { transform: translateY(4px) rotate(45deg); }
  .ust__menu[aria-expanded="true"] span:last-child { transform: translateY(-4px) rotate(-45deg); }
  .ust__nav {
    position: fixed; inset: var(--ust-h) 0 auto; flex-direction: column; align-items: stretch; gap: 0;
    padding: 8px var(--yan) 24px; background: var(--gece); border-bottom: 1px solid var(--cizgi-koyu);
    opacity: 0; visibility: hidden; transform: translateY(-8px); transition: opacity var(--gecis), transform var(--gecis), visibility var(--gecis);
  }
  .ust__nav.acik { opacity: 1; visibility: visible; transform: none; }
  .ust__nav a:not(.dugme) { padding: 0; min-height: 56px; display: flex; align-items: center; font-size: 20px; color: var(--beyaz); border-bottom: 1px solid var(--cizgi-koyu); border-radius: 0; }
  .ust__nav-cta { margin: 20px 0 0; min-height: 56px; }
  .ust.menu-acik { background: var(--gece); }
}

/* Açılış */
.acilis { position: relative; min-height: 100svh; display: flex; flex-direction: column; justify-content: flex-end; overflow: hidden; isolation: isolate; padding-top: calc(var(--ust-h) + 40px); }
.acilis__sahne { position: absolute; inset: 0; z-index: -2; display: flex; align-items: center; justify-content: flex-end; }
.acilis__isaret { width: min(46vw, 680px); margin-right: max(2vw, calc((100vw - var(--kap)) / 2 - 40px)); transform: translateY(-8%); overflow: visible; }
.acilis__w { fill: var(--beyaz); }
.acilis__kol { fill: var(--sari); }
.acilis__iz { fill: var(--sari); }
.acilis__cizgiler line { stroke: var(--beyaz); stroke-width: 2; stroke-linecap: round; opacity: .35; }
.acilis__katman {
  position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background:
    linear-gradient(90deg, rgba(11, 11, 11, .92) 0%, rgba(11, 11, 11, .7) 36%, rgba(11, 11, 11, 0) 56%),
    linear-gradient(0deg, var(--gece) 0%, rgba(11, 11, 11, 0) 16%);
}
.acilis__katman::after { /* hafif film greni */
  content: ""; position: absolute; inset: 0; opacity: .14; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");
}
.acilis__ic { padding-bottom: clamp(40px, 7vh, 72px); }
.acilis .etiket { margin-bottom: 28px; }
.acilis h1 { font-size: clamp(44px, 7.4vw, 108px); max-width: 11ch; }
.acilis__metin { margin-top: 28px; max-width: 30em; font-size: clamp(17px, 1.5vw, 20px); color: rgba(255, 255, 255, .74); line-height: 1.55; }
.acilis__eylem { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 40px; }
.acilis__notlar { display: flex; flex-wrap: wrap; gap: 8px 28px; margin-top: 36px; font-size: 14px; color: var(--soluk-koyu); }
.acilis__notlar li { display: flex; align-items: center; gap: 10px; }
.acilis__notlar li::before { content: ""; width: 8px; height: 12px; background: var(--sari); transform: skewX(-17deg); }
.acilis__bag { padding-bottom: 32px; }

/* Hareket: kol aşağıdan yükselir, izleri söner, hız çizgileri çıkar */
@media (prefers-reduced-motion: no-preference) {
  .acilis__kol { animation: kol-yuksel 900ms cubic-bezier(.2, .8, .2, 1) 250ms both; }
  .acilis__iz--2 { animation: iz 1100ms cubic-bezier(.2, .8, .2, 1) 180ms both; --dy: 60px; --dx: -17px; }
  .acilis__iz--3 { animation: iz 1300ms cubic-bezier(.2, .8, .2, 1) 120ms both; --dy: 120px; --dx: -34px; }
  .acilis__cizgiler line { stroke-dasharray: 320; animation: cizgi 900ms ease-out 700ms both; }
  .acilis__cizgiler line:nth-child(2) { animation-delay: 780ms; }
  .acilis__cizgiler line:nth-child(3) { animation-delay: 840ms; }
  .acilis__cizgiler line:nth-child(4) { animation-delay: 900ms; }
  .acilis__w { animation: belir 700ms ease-out both; }
  .acilis__ic > * { animation: yukari 800ms cubic-bezier(.2, .8, .2, 1) both; }
  .acilis__ic > :nth-child(2) { animation-delay: 80ms; }
  .acilis__ic > :nth-child(3) { animation-delay: 160ms; }
  .acilis__ic > :nth-child(4) { animation-delay: 240ms; }
  .acilis__ic > :nth-child(5) { animation-delay: 320ms; }
  .acilis__bag .bag { transform-origin: left; animation: bag 1400ms cubic-bezier(.6, 0, .2, 1) 400ms both; }
}
@keyframes kol-yuksel { from { clip-path: inset(100% 0 0 0); transform: translate(-50px, 175px); } to { clip-path: inset(0 0 0 0); transform: none; } }
@keyframes iz { 0% { opacity: 0; transform: translate(-50px, 175px); } 40% { opacity: .5; } 100% { opacity: 0; transform: translate(var(--dx), var(--dy)); } }
@keyframes cizgi { from { stroke-dashoffset: 320; opacity: 0; } 30% { opacity: .5; } to { stroke-dashoffset: 0; opacity: .35; } }
@keyframes belir { from { opacity: 0; } to { opacity: 1; } }
@keyframes yukari { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@keyframes bag { from { transform: scaleX(0); } to { transform: scaleX(1); } }

/* Bölümler */
.bolum { padding: var(--bolum) 0; position: relative; }
.bolum--koyu { background: var(--gece); color: var(--beyaz); }
.bolum--koyu + .bolum--koyu { border-top: 1px solid var(--cizgi-koyu); }
.bolum--acik { background: var(--kagit); color: var(--gece); }
.bolum__bas { max-width: 760px; margin-bottom: clamp(48px, 6vw, 72px); }
.bolum__bas .etiket { margin-bottom: 20px; }
.bolum h2 { font-size: clamp(36px, 5vw, 64px); }
.bolum--acik h2 { line-height: 1.08; }
.bolum__giris { margin-top: 24px; font-size: 18px; max-width: 36em; color: var(--soluk-koyu); }
.bolum--acik .bolum__giris { color: var(--soluk-acik); }

/* Hizmetler */
.analiz-kart {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 32px;
  padding: clamp(28px, 4vw, 48px); margin-bottom: 16px; border-radius: var(--r-kart);
  background: var(--gece); color: var(--beyaz); text-decoration: none; position: relative; overflow: hidden;
  transition: transform var(--gecis);
}
.analiz-kart::before { content: ""; position: absolute; top: -40%; right: 8%; width: 64px; height: 180%; background: var(--sari); transform: skewX(-17deg); opacity: .95; transition: transform 500ms cubic-bezier(.2, .8, .2, 1); }
.analiz-kart > * { position: relative; }
.analiz-kart:hover { transform: translateY(-3px); }
.analiz-kart:hover::before { transform: skewX(-17deg) translateX(12px); }
.analiz-kart div { max-width: 640px; }
.analiz-kart h3 { font-size: clamp(32px, 4vw, 48px); margin: 14px 0 16px; }
.analiz-kart p:not(.etiket) { color: rgba(255, 255, 255, .72); }
.analiz-kart__ok { display: inline-flex; align-items: center; gap: 10px; min-height: 48px; padding: 0 22px; border-radius: 999px; background: var(--beyaz); color: var(--gece); font-weight: 600; font-size: 15px; white-space: nowrap; margin-right: clamp(0px, 8vw, 110px); }
.analiz-kart__ok svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform var(--gecis); }
.analiz-kart:hover .analiz-kart__ok svg { transform: translateX(3px); }

.kartlar { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.kart {
  position: relative; padding: 32px 28px 36px; border-radius: var(--r-kart);
  background: var(--beyaz); border: 1px solid var(--cizgi-acik);
  transition: transform var(--gecis), border-color var(--gecis);
}
.kart::after { content: ""; position: absolute; left: 28px; right: 28px; bottom: 0; height: 3px; background: var(--sari); transform: scaleX(0); transform-origin: left; transition: transform 360ms cubic-bezier(.2, .8, .2, 1); }
.kart:hover { transform: translateY(-3px); border-color: rgba(11, 11, 11, .22); }
.kart:hover::after { transform: scaleX(1); }
.kart__no { display: inline-block; font-size: 13px; font-weight: 500; letter-spacing: .08em; color: var(--soluk-acik); font-variant-numeric: tabular-nums; }
.kart h3 { font-size: 24px; letter-spacing: -.03em; line-height: 1.15; margin: 40px 0 12px; }
.kart p { color: var(--soluk-acik); font-size: 16px; line-height: 1.6; }

/* Paket */
.paket { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(48px, 7vw, 112px); align-items: start; }
.paket__sol .etiket { margin-bottom: 20px; }
.giris-kapilari { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 40px 0 32px; }
.giris-kapilari div { padding: 22px 22px 24px; border-radius: 12px; background: var(--grafit); border: 1px solid var(--cizgi-koyu); }
.giris-kapilari h3 { font-size: 19px; letter-spacing: -.02em; margin-bottom: 10px; }
.giris-kapilari p { font-size: 15px; color: var(--soluk-koyu); line-height: 1.55; }
.paket__fiyat { font-size: 15px; color: var(--beyaz); margin-bottom: 20px; padding-left: 16px; border-left: 2px solid var(--sari); }
.paket__liste { border-top: 1px solid var(--cizgi-koyu); }
.paket__liste li { display: grid; grid-template-columns: 56px 1fr auto; align-items: start; gap: 16px; padding: 28px 0; border-bottom: 1px solid var(--cizgi-koyu); }
.paket__liste li::after { content: ""; width: 22px; height: 22px; margin-top: 2px; border-radius: 50%; background: var(--sari) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B0B0B' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center/14px no-repeat; }
.paket__liste span { font-size: 13px; letter-spacing: .08em; color: var(--soluk-koyu); padding-top: 5px; font-variant-numeric: tabular-nums; }
.paket__liste h3 { font-size: 22px; letter-spacing: -.03em; line-height: 1.2; }
.paket__liste p { margin-top: 6px; font-size: 15px; color: var(--soluk-koyu); }

/* İşler */
.isler { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 3vw, 40px); }
.is__gorsel { position: relative; padding: 0 clamp(28px, 4vw, 56px) clamp(32px, 4vw, 48px) 0; }
.is__masaustu { width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; object-position: top; border-radius: 12px; border: 1px solid var(--cizgi-acik); background: var(--kagit-2); }
.is__mobil { position: absolute; right: 0; bottom: 0; width: 26%; height: auto; aspect-ratio: 360 / 779; object-fit: cover; object-position: top; border-radius: 18px; border: 5px solid var(--gece); background: var(--gece); }
.is__metin { padding-top: 28px; }
.is__metin h3 { font-size: clamp(26px, 2.6vw, 34px); letter-spacing: -.035em; margin: 12px 0 12px; }
.is__metin > p:not(.etiket) { color: var(--soluk-acik); max-width: 30em; }
.rozetler { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
.rozetler li { padding: 7px 14px; border-radius: 999px; border: 1px solid rgba(11, 11, 11, .16); font-size: 13px; font-weight: 500; }

/* Süreç */
.surec { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; position: relative; }
.surec::before { content: ""; position: absolute; left: 0; right: 0; top: 7px; height: 2px; background: var(--sari); }
.surec li { position: relative; padding: 48px 28px 0 0; }
.surec li::before { content: ""; position: absolute; left: 0; top: 0; width: 16px; height: 16px; border-radius: 50%; background: var(--gece); border: 2px solid var(--sari); }
.surec li:last-child::before { background: var(--sari); }
.surec__no { font-size: 13px; letter-spacing: .08em; color: var(--soluk-koyu); font-variant-numeric: tabular-nums; }
.surec h3 { font-size: clamp(26px, 2.6vw, 34px); letter-spacing: -.035em; margin: 14px 0 12px; }
.surec p { color: var(--soluk-koyu); font-size: 16px; max-width: 18em; }

/* Hakkımızda */
.hakkimizda { display: grid; grid-template-columns: 1.05fr 1fr; gap: clamp(48px, 7vw, 112px); align-items: start; }
.hakkimizda__sol .etiket { margin-bottom: 20px; }
.hakkimizda__sol h2 { margin-bottom: 32px; }
.hakkimizda__sol > p:not(.etiket) { color: var(--soluk-acik); font-size: 18px; max-width: 34em; }
.hakkimizda__sol > p + p { margin-top: 16px; }
.hakkimizda blockquote { margin: 40px 0 0; padding: 28px 0 0; border-top: 2px solid var(--gece); font-size: clamp(22px, 2.2vw, 28px); font-weight: 550; letter-spacing: -.03em; line-height: 1.3; max-width: 22em; }
.neden__baslik { font-size: 15px; font-weight: 500; letter-spacing: 0; color: var(--soluk-acik); margin-bottom: 8px; }
.neden li { display: grid; grid-template-columns: 52px 1fr; gap: 18px; padding: 28px 0; border-bottom: 1px solid var(--cizgi-acik); }
.neden li:first-child { border-top: 1px solid var(--cizgi-acik); }
.neden svg { width: 52px; height: 52px; padding: 13px; border-radius: 12px; background: var(--gece); fill: none; stroke: var(--sari); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.neden h4 { font-size: 21px; letter-spacing: -.03em; line-height: 1.2; margin: 2px 0 8px; }
.neden p { color: var(--soluk-acik); font-size: 16px; }

/* SSS */
.sss { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(40px, 6vw, 96px); align-items: start; }
.sss .bolum__bas { margin-bottom: 0; position: sticky; top: calc(var(--ust-h) + 32px); }
.sss__liste { border-top: 1px solid var(--cizgi-koyu); }
.sss__liste details { border-bottom: 1px solid var(--cizgi-koyu); }
.sss__liste summary {
  display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 76px; padding: 18px 0;
  font-size: 19px; font-weight: 550; letter-spacing: -.02em; line-height: 1.35; cursor: pointer; list-style: none;
}
.sss__liste summary::-webkit-details-marker { display: none; }
.sss__liste summary::after {
  content: ""; flex: none; width: 36px; height: 36px; border-radius: 50%; border: 1.5px solid rgba(255, 255, 255, .22);
  background: linear-gradient(currentColor, currentColor) center/12px 1.5px no-repeat, linear-gradient(currentColor, currentColor) center/1.5px 12px no-repeat;
  transition: transform var(--gecis), background-color var(--gecis), border-color var(--gecis);
}
.sss__liste details[open] summary::after { transform: rotate(45deg); border-color: var(--sari); color: var(--sari); }
.sss__liste summary:hover::after { border-color: var(--beyaz); }
.sss__liste details p { padding: 0 64px 28px 0; color: var(--soluk-koyu); font-size: 16px; max-width: 40em; }

/* İletişim */
.iletisim { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(40px, 6vw, 96px); align-items: start; }
.iletisim__sol .etiket { margin-bottom: 20px; }
.iletisim__yollar { margin-top: 48px; border-top: 1px solid var(--cizgi-acik); }
.iletisim__yollar li { padding: 22px 0; border-bottom: 1px solid var(--cizgi-acik); display: grid; gap: 6px; }
.iletisim__yollar a { font-size: 19px; font-weight: 550; letter-spacing: -.02em; text-decoration: none; overflow-wrap: anywhere; display: inline-flex; align-items: center; min-height: 48px; }
.iletisim__yollar a:hover { text-decoration: underline; text-underline-offset: 4px; }
.iletisim__yollar small, .iletisim__yollar p { font-size: 15px; color: var(--soluk-acik); }
.form { padding: clamp(24px, 4vw, 44px); border-radius: 20px; background: var(--beyaz); border: 1px solid var(--cizgi-acik); display: grid; gap: 18px; }
.form__satir { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.alan { display: grid; gap: 8px; }
.alan > span { font-size: 14px; font-weight: 550; }
.alan em { font-style: normal; font-weight: 400; color: var(--soluk-acik); }
.alan input, .alan select, .alan textarea {
  width: 100%; min-height: 56px; padding: 14px 16px; border-radius: 12px; border: 1.5px solid #D6D6D2; background: var(--kagit);
  font: 400 16px/1.4 "Geist", sans-serif; color: var(--gece); transition: border-color var(--gecis), background var(--gecis); -webkit-appearance: none; appearance: none;
}
.alan select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B0B0B' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 16px center; background-size: 18px; padding-right: 48px; }
.alan textarea { resize: vertical; min-height: 128px; }
.alan input::placeholder, .alan textarea::placeholder { color: #9A9A96; }
.alan input:hover, .alan select:hover, .alan textarea:hover { border-color: #B8B8B3; }
.alan input:focus, .alan select:focus, .alan textarea:focus { outline: none; border-color: var(--gece); background: var(--beyaz); }
.alan.hatali input { border-color: #C2261B; }
.form__tuzak { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form__not { font-size: 13px; color: var(--soluk-acik); text-align: center; }
.form__durum { font-size: 15px; text-align: center; min-height: 0; }
.form__durum:empty { display: none; }
.form__durum.iyi { padding: 14px 16px; border-radius: 12px; background: var(--gece); color: var(--beyaz); }
.form__durum.iyi::before { content: ""; display: inline-block; width: 8px; height: 12px; margin-right: 10px; background: var(--sari); transform: skewX(-17deg); }
.form__durum.kotu { padding: 14px 16px; border-radius: 12px; background: #FBEAE8; color: #8E1B12; }
.form__durum a { font-weight: 600; }

/* Alt bilgi */
.alt { background: var(--gece); padding: 88px 0 32px; border-top: 1px solid var(--cizgi-koyu); }
.alt__ic { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 48px; }
.alt__marka img { width: 200px; height: auto; }
.alt__marka p { margin-top: 20px; color: var(--soluk-koyu); max-width: 22em; font-size: 15px; }
.alt__nav { display: grid; gap: 4px; align-content: start; }
.alt__nav a, .alt__iletisim a { color: rgba(255, 255, 255, .78); text-decoration: none; font-size: 15px; min-height: 36px; display: inline-flex; align-items: center; overflow-wrap: anywhere; }
.alt__nav a:hover, .alt__iletisim a:hover { color: var(--beyaz); }
.alt__iletisim { display: grid; gap: 4px; align-content: start; }
.alt__iletisim p { color: var(--soluk-koyu); font-size: 15px; margin-top: 8px; }
.alt__taban { display: grid; grid-template-columns: 1fr; gap: 20px; margin-top: 72px; }
.alt__taban .bag { grid-column: 1 / -1; }
.alt__taban { grid-template-columns: 1fr auto auto; column-gap: 28px; align-items: center; }
.alt__taban p, .alt__taban a { font-size: 13px; color: var(--soluk-koyu); text-decoration: none; }
.alt__taban a { min-height: 44px; display: inline-flex; align-items: center; }
.alt__taban a:hover { color: var(--beyaz); }

/* Görünürken belirme */
@media (prefers-reduced-motion: no-preference) {
  .js .belir { opacity: 0; transform: translateY(24px); transition: opacity 700ms ease, transform 700ms cubic-bezier(.2, .8, .2, 1); }
  .js .belir.gorundu { opacity: 1; transform: none; }
}

/* Tablet */
@media (max-width: 1023px) {
  .kartlar { grid-template-columns: 1fr 1fr; }
  .surec { grid-template-columns: 1fr 1fr; row-gap: 56px; }
  .surec::before { display: none; }
  .surec li { padding: 40px 24px 0 0; border-top: 2px solid var(--sari); }
  .surec li::before { top: -9px; }
}

@media (max-width: 380px) {
  .ust__ic { gap: 10px; }
  .ust__cta { padding: 0 14px; }
}

/* Telefon: tek sütun, tek elle kullanım */
@media (max-width: 767px) {
  body { font-size: 16px; }
  .acilis { min-height: 100svh; padding-top: calc(var(--ust-h) + 24px); }
  .acilis__sahne { align-items: flex-start; padding-top: calc(var(--ust-h) + 20px); }
  .acilis__isaret { width: 44vw; margin-right: var(--yan); transform: none; }
  .acilis__katman { display: none; }
  .acilis .etiket { margin-bottom: 18px; font-size: 12px; letter-spacing: .1em; }
  .alt__nav a, .alt__iletisim a, .alt__taban a { min-height: 48px; }
  .acilis h1 { font-size: clamp(40px, 11.6vw, 56px); }
  .acilis__metin { margin-top: 18px; font-size: 16px; }
  .acilis__eylem { flex-direction: column; margin-top: 28px; gap: 10px; }
  .acilis__eylem .dugme { width: 100%; }
  .acilis__notlar { margin-top: 24px; gap: 8px 18px; font-size: 13px; }
  .acilis__ic { padding-bottom: 28px; }
  .acilis__bag { padding-bottom: 20px; }

  .bolum__giris { font-size: 16px; }
  .analiz-kart { flex-direction: column; align-items: stretch; }
  .analiz-kart::before { top: -24px; right: 28px; width: 26px; height: 96px; }
  .analiz-kart div { padding-right: 36px; }
  .analiz-kart__ok { justify-content: center; margin-right: 0; min-height: 52px; }
  .kartlar { grid-template-columns: 1fr; gap: 12px; }
  .kart { padding: 26px 22px 28px; }
  .kart h3 { margin-top: 20px; font-size: 22px; }

  .paket, .hakkimizda, .sss, .iletisim, .isler { grid-template-columns: 1fr; }
  .giris-kapilari { grid-template-columns: 1fr; }
  .paket__sol .dugme { width: 100%; }
  .paket__liste li { grid-template-columns: 36px 1fr auto; padding: 22px 0; }
  .paket__liste h3 { font-size: 19px; }
  .isler { gap: 56px; }

  .surec { grid-template-columns: 1fr; row-gap: 0; }
  .surec li { border-top: 0; border-left: 2px solid var(--sari); padding: 0 0 36px 28px; margin-left: 7px; }
  .surec li:last-child { padding-bottom: 0; border-left-color: transparent; }
  .surec li::before { left: -9px; top: 0; }
  .surec h3 { margin-top: 6px; font-size: 26px; }

  .sss .bolum__bas { position: static; }
  .sss__liste summary { font-size: 17px; min-height: 68px; }
  .sss__liste details p { padding-right: 0; }

  .form { padding: 22px 18px; border-radius: 16px; }
  .form__satir { grid-template-columns: 1fr; }
  .iletisim__yollar { margin-top: 32px; }

  .alt { padding-top: 64px; }
  .alt__ic { grid-template-columns: 1fr; gap: 32px; }
  .alt__taban { margin-top: 48px; }
}