/* Taban + bileşenler, Konsept B: siyah zemin, geniş grotesk, mono etiketler. Hareket/sahne: vitrin.css */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; background: var(--murekkep); }
body { margin: 0; background: var(--murekkep); color: var(--kagit); font: 400 1.0625rem/1.65 var(--yazi); overflow-x: clip; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
img { max-width: 100%; height: auto; }
a { color: var(--kagit); text-decoration-color: var(--kirmizi); text-underline-offset: .22em; text-decoration-thickness: 1px; transition: color var(--s-mikro) var(--e-his), text-decoration-color var(--s-mikro); }
a:hover { color: var(--beyaz); text-decoration-thickness: 2px; }
::selection { background: var(--kirmizi); color: var(--beyaz); }
:focus-visible { outline: 2px solid var(--kirmizi-koyu); outline-offset: 4px; border-radius: 2px; }
h1, h2, h3 { font-family: var(--gosterim); line-height: 1.02; font-weight: 600; margin: 0 0 .5em; letter-spacing: -.025em; text-wrap: balance; }
h1 { font-size: clamp(2.6rem, 9.2vw, 8.6rem); font-weight: 600; letter-spacing: -.04em; line-height: .94; }
h2 { font-size: clamp(2rem, 5.4vw, 4.4rem); }
h3 { font-size: clamp(1.25rem, 2vw, 1.6rem); letter-spacing: -.015em; line-height: 1.12; }
p { margin: 0 0 1em; max-width: 40rem; color: rgba(236, 234, 228, .86); }
.vurgu { color: var(--kirmizi); }
.kap { width: 100%; max-width: var(--kap); margin-inline: auto; padding-inline: clamp(1rem, 4vw, 2.5rem); }

.atla { position: absolute; left: -999px; top: 0; background: var(--kirmizi); color: var(--beyaz); padding: .6rem 1rem; z-index: 200; }
.atla:focus { left: 0; }

/* üst çubuk */
.ust { position: fixed; inset: 0 0 auto 0; z-index: 60; transition: background var(--s-orta) var(--e-his), backdrop-filter var(--s-orta); }
.ust.golge { background: rgba(6, 6, 6, .72); backdrop-filter: blur(14px) saturate(1.2); -webkit-backdrop-filter: blur(14px) saturate(1.2); }
.ust-ic { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.5rem; padding-block: .85rem; max-width: 96rem; }
.logo { display: inline-flex; min-height: 44px; align-items: center; }
.logo img { display: block; width: 132px; height: auto; }
nav { order: 2; }
.menu { list-style: none; display: flex; flex-wrap: wrap; gap: 0 1.6rem; margin: 0; padding: 0; }
.menu a { font: 500 .78rem/1 var(--mono); text-transform: uppercase; letter-spacing: .12em; color: var(--kagit); text-decoration: none; display: inline-flex; align-items: center; min-height: 44px; position: relative; }
.menu a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 10px; height: 1px; background: var(--kirmizi); transform: scaleX(0); transform-origin: right; transition: transform var(--s-orta) var(--e-kes); }
.menu a:hover::after, .menu a[aria-current]::after { transform: scaleX(1); transform-origin: left; }
.ust-sag { margin-left: auto; display: flex; align-items: center; gap: .9rem; flex-wrap: wrap; order: 3; }
.dil { font: 500 .78rem/1 var(--mono); text-transform: uppercase; letter-spacing: .12em; color: var(--gri-koyu); text-decoration: none; padding: .5rem; min-height: 44px; display: inline-flex; align-items: center; }
.dil:hover { color: var(--kagit); }

/* düğme: iğne ucu kırmızı nokta + mono etiket */
.dugme { display: inline-flex; align-items: center; justify-content: center; gap: .7rem; background: transparent; color: var(--kagit); text-decoration: none; font: 500 .8rem/1 var(--mono); text-transform: uppercase; letter-spacing: .12em; padding: 1rem 1.5rem; min-height: 52px; border: 1px solid var(--cizgi-guclu); border-radius: 999px; cursor: pointer; text-align: center; position: relative; overflow: hidden; isolation: isolate; transition: color var(--s-orta) var(--e-his), border-color var(--s-orta), translate .5s var(--e-cik); }
.dugme::before { content: ""; width: .55rem; height: .55rem; border-radius: 50%; background: var(--kirmizi); box-shadow: 0 0 0 0 rgba(229, 55, 44, .6); transition: box-shadow var(--s-orta) var(--e-his); flex: none; }
.dugme::after { content: ""; position: absolute; inset: 0; background: var(--kirmizi); border-radius: inherit; transform: translateY(101%); transition: transform var(--s-orta) var(--e-kes); z-index: -1; }
.dugme:hover { color: var(--beyaz); border-color: var(--kirmizi); }
.dugme:hover::after { transform: translateY(0); }
.dugme:hover::before { background: var(--beyaz); box-shadow: 0 0 0 6px rgba(255, 255, 255, .18); }
.dugme:active { scale: .97; }
.dugme[disabled] { opacity: .6; cursor: progress; }
.ust .dugme { padding: .65rem 1.1rem; min-height: 44px; font-size: .72rem; }

/* bölümler */
.hero { padding-block: clamp(7rem, 16vh, 11rem) clamp(2rem, 6vw, 4rem); position: relative; }
.ust-yazi { font: 500 .78rem/1.4 var(--mono); text-transform: uppercase; letter-spacing: .16em; color: var(--kirmizi-koyu); margin-bottom: 1.4rem; display: flex; align-items: center; gap: .8rem; }
.ust-yazi::before { content: ""; width: 2.4rem; height: 1px; background: var(--kirmizi); flex: none; }
.ozet { font-size: clamp(1.05rem, 1.5vw, 1.3rem); max-width: 36rem; }
.fiyat { font: 500 1rem var(--mono); color: var(--kirmizi-koyu); }
.blok { padding-block: clamp(4rem, 11vw, 9rem); position: relative; }
.blok > h2, .son > h2 { margin-bottom: clamp(1.5rem, 4vw, 3rem); }
.son { padding-block: clamp(5rem, 14vw, 11rem); position: relative; }
.madde { list-style: none; padding: 0; max-width: 56rem; counter-reset: m; margin: 0; }
.madde li { counter-increment: m; border-top: 1px solid var(--cizgi); padding: 1.1rem 0 1.1rem 3.2rem; position: relative; font: 500 clamp(1.05rem, 1.7vw, 1.4rem)/1.4 var(--yazi); color: var(--kagit); }
.madde li::before { content: "0" counter(m); position: absolute; left: 0; top: 1.3rem; font: 500 .78rem var(--mono); color: var(--kirmizi-koyu); letter-spacing: .1em; }
.madde li:last-child { border-bottom: 1px solid var(--cizgi); }
.adimlar, .takvim { list-style: none; padding: 0; margin: 0; display: grid; gap: 0; counter-reset: a; position: relative; max-width: 60rem; }
.adimlar li, .takvim li { display: grid; gap: .35rem; padding: 1.5rem 0 1.5rem 4.2rem; position: relative; border-top: 1px solid var(--cizgi); }
.adimlar li:last-child, .takvim li:last-child { border-bottom: 1px solid var(--cizgi); }
.adimlar li { counter-increment: a; }
.adimlar li strong, .takvim li strong { font: 600 clamp(1.3rem, 2.4vw, 2rem)/1.1 var(--gosterim); letter-spacing: -.02em; }
.adimlar li strong::before { content: "0" counter(a); position: absolute; left: 0; top: 1.75rem; font: 500 .8rem var(--mono); color: var(--kirmizi-koyu); letter-spacing: .1em; }
.takvim li strong { color: var(--kirmizi-koyu); font-family: var(--mono); font-size: .95rem; font-weight: 500; letter-spacing: .06em; }
.adimlar li span, .takvim li span { color: rgba(236, 234, 228, .78); max-width: 38rem; }
/* ilerleyen kırmızı hat: kaydırma ilerledikçe dolar (--ilerleme, JS) */
.adimlar::before, .takvim::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 1px; background: var(--cizgi); }
.adimlar::after, .takvim::after { content: ""; position: absolute; left: -1px; top: 0; bottom: 0; width: 3px; background: var(--kirmizi); box-shadow: 0 0 14px rgba(229, 55, 44, .8); transform-origin: top; transform: scaleY(var(--ilerleme, 1)); }
.ozet-liste { display: grid; gap: 0; margin: 0 0 1.5rem; max-width: 48rem; }
.ozet-liste div { display: flex; flex-wrap: wrap; align-items: baseline; gap: .25rem 2rem; border-top: 1px solid var(--cizgi); padding-block: 1rem; }
.ozet-liste div:last-child { border-bottom: 1px solid var(--cizgi); }
.ozet-liste dt { font: 500 .78rem var(--mono); color: var(--gri-koyu); text-transform: uppercase; letter-spacing: .12em; min-width: 7rem; }
.ozet-liste dd { margin: 0; font: 500 clamp(1.15rem, 2vw, 1.6rem)/1.2 var(--gosterim); letter-spacing: -.01em; }
.kartlar { list-style: none; padding: 0; margin: 2rem 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr)); }
.kart { background: var(--cam); border: 1px solid var(--cizgi); border-radius: 1.4rem; padding: 1.6rem 1.6rem 1.8rem; backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); position: relative; }
.kart h3 { margin-bottom: 1rem; }
.kart h3 a { text-decoration: none; }
.kart dl { margin: 0; }
.kart dt { font: 500 .7rem var(--mono); color: var(--kirmizi-koyu); text-transform: uppercase; letter-spacing: .14em; margin-top: 1rem; }
.kart dd { margin: .15rem 0 0; color: rgba(236, 234, 228, .88); }
.kart .not { margin: 1rem 0 0; font-size: .92rem; color: var(--gri-koyu); }
.iki { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr)); }
.sss { border-top: 1px solid var(--cizgi); max-width: 54rem; }
.sss:last-of-type { border-bottom: 1px solid var(--cizgi); }
.sss summary { cursor: pointer; font: 500 clamp(1.1rem, 1.8vw, 1.4rem)/1.3 var(--gosterim); padding: 1.1rem 2.5rem 1.1rem 0; min-height: 48px; list-style: none; position: relative; }
.sss summary::-webkit-details-marker { display: none; }
.sss summary::after { content: "+"; position: absolute; right: 0; top: 1rem; font: 400 1.6rem/1 var(--mono); color: var(--kirmizi-koyu); transition: rotate var(--s-orta) var(--e-tik); }
.sss[open] summary::after { rotate: 45deg; }
.sss p { padding: 0 0 1.2rem; }

/* form */
.basvuru form { background: var(--cam); border: 1px solid var(--cizgi); border-radius: 1.6rem; padding: clamp(1.2rem, 4vw, 2.4rem); max-width: 42rem; backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
.alan { margin-bottom: 1.2rem; border: 0; padding: 0; }
.alan label, .alan legend { display: block; font: 500 .74rem var(--mono); text-transform: uppercase; letter-spacing: .1em; color: var(--gri-koyu); margin-bottom: .45rem; padding: 0; }
.alan input[type="text"], .alan input[type="email"], .alan input[type="tel"], .alan select, .alan textarea { width: 100%; font: 400 1.05rem var(--yazi); padding: .75rem .9rem; min-height: 50px; border: 1px solid var(--cizgi-guclu); background: rgba(255, 255, 255, .03); color: var(--kagit); border-radius: .7rem; transition: border-color var(--s-mikro), background var(--s-mikro); }
.alan select option { background: #101011; color: var(--kagit); }
.alan input:focus, .alan select:focus, .alan textarea:focus { outline: none; border-color: var(--kirmizi); background: rgba(229, 55, 44, .06); box-shadow: 0 0 0 3px rgba(229, 55, 44, .22); }
.alan [aria-invalid="true"] { border-color: var(--kirmizi-koyu); border-width: 2px; }
.ipucu { font-size: .9rem; color: var(--gri-koyu); margin: 0 0 .4rem; }
.hata { color: var(--kirmizi-koyu); font-weight: 700; margin: .35rem 0 0; }
.hata::before { content: "! "; }
.secenekler { display: flex; flex-wrap: wrap; gap: .25rem 1.25rem; }
.alan label.secenek { display: flex; align-items: flex-start; gap: .6rem; font: 400 1rem var(--yazi); text-transform: none; letter-spacing: 0; color: var(--kagit); min-height: 44px; padding: .4rem 0; }
.secenek input { width: 1.3rem; height: 1.3rem; margin: .15rem 0 0; flex: none; accent-color: var(--kirmizi); }
.bal { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.ozet-hata { color: var(--kirmizi-koyu); font-weight: 700; margin: 0; }
.ozet-hata:empty, .durum:empty { display: none; }
.durum { font-weight: 600; margin: 0 0 1rem; }
.durum-alani { margin-bottom: 1rem; }
[hidden] { display: none !important; }

/* alt çubuk */
.alt { border-top: 1px solid var(--cizgi); margin-top: 0; padding-block: 3rem 2rem; background: var(--murekkep); position: relative; overflow: hidden; }
.alt-ic { display: grid; gap: 1rem; }
.alt-bag { list-style: none; display: flex; flex-wrap: wrap; gap: .25rem 1.6rem; padding: 0; margin: 0; }
.alt-bag a { display: inline-block; padding: .5rem 0; min-height: 44px; font: 500 .78rem var(--mono); text-transform: uppercase; letter-spacing: .1em; text-decoration: none; color: var(--gri-koyu); }
.alt-bag a:hover { color: var(--kagit); }
.alt p { margin: 0; } .telif { color: var(--gri-koyu); font: 400 .78rem var(--mono); letter-spacing: .06em; }
.alt-ad { font: 500 .78rem var(--mono); text-transform: uppercase; letter-spacing: .14em; color: var(--kirmizi-koyu); }

/* kök */
.kok { min-height: 80vh; display: grid; place-content: center; gap: 2rem; justify-items: start; }
.kok-dil { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 1rem; }
.kok h1 { margin: 0; line-height: 0; font-size: 1rem; }

.hizmet-liste { display: grid; gap: .25rem 2rem; grid-template-columns: minmax(7rem, 12rem) 1fr; margin: 0 0 1rem; }
.hizmet-liste dt { font: 500 .74rem var(--mono); color: var(--kirmizi-koyu); text-transform: uppercase; letter-spacing: .12em; padding-top: .5rem; border-top: 1px solid var(--cizgi); }
.hizmet-liste dd { margin: 0 0 .25rem; padding-top: .3rem; border-top: 1px solid var(--cizgi); } .hizmet-liste dd .madde { margin: 0; }
.hizmet-liste dd .madde li { font-size: 1rem; padding-block: .5rem; }
.hizmet-liste dd .madde li:first-child { border-top: 0; }
.hizmet .not { color: var(--gri-koyu); }
.hizmet h2 { max-width: 20ch; }
main:focus { outline: none; }

@media (max-width: 52em) {
  .menu { gap: 0 1.1rem; }
  .ust-ic { gap: .25rem 1rem; padding-block: .6rem; }
  .logo img { width: 112px; }
  nav { order: 4; width: 100%; }
  .ust-sag .dugme { display: none; }
  h1 { font-size: clamp(2.4rem, 12.5vw, 4rem); }
}
@media (max-width: 40em) { .hizmet-liste { grid-template-columns: 1fr; } .hizmet-liste dd { margin-bottom: .75rem; border-top: 0; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition-duration: .01ms !important; animation: none !important; scroll-behavior: auto !important; } }