:root{--k:#C6633F;--k2:#E08A5C;--pembe:#E0557A;--bg:#050506;--kart:#0b0b0d;--kart2:#111114;--cz:rgba(255,255,255,.08);--cz2:rgba(255,255,255,.14);--soluk:#9a9aa2;--soluk2:#6c6c74}
*{box-sizing:border-box;margin:0;padding:0}
html{overflow-x:clip}
body{font-family:"Hanken Grotesk",sans-serif;-webkit-font-smoothing:antialiased;background:var(--bg);color:#ededef;overflow-x:clip}
img{display:block;max-width:100%}a{color:inherit;text-decoration:none}
.etk{font:500 13px/1 "IBM Plex Mono";letter-spacing:.12em;color:var(--k2)}
.degrade{background:linear-gradient(95deg,#FFB27A 0%,var(--k) 45%,var(--pembe) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.gozle{opacity:0;transform:translateY(24px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
.gozle.gor{opacity:1;transform:none}
.cb{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 18px;border-radius:999px;font:600 14.5px/1 "Hanken Grotesk";background:#ededef;color:#000;transition:background .2s}
.cb:hover{background:#fff}
.cb.k{background:var(--k);color:#fff}.cb.k:hover{background:#d8704a}
.cb.hay{background:transparent;color:#ededef;box-shadow:inset 0 0 0 1px rgba(255,255,255,.16)}
.cb.buyuk{height:54px;padding:0 28px;font-size:16.5px}

/* ---------- HERO ---------- */
.hero{position:relative;max-width:1240px;margin:0 auto;padding:170px 24px 40px}
.hero .izgara{position:absolute;top:0;left:50%;width:100vw;height:760px;margin-left:-50vw;z-index:-1;background-image:linear-gradient(var(--cz) 1px,transparent 1px),linear-gradient(90deg,var(--cz) 1px,transparent 1px);background-size:64px 64px;mask-image:radial-gradient(ellipse 50% 45% at 30% 30%,#000 20%,transparent 70%);-webkit-mask-image:radial-gradient(ellipse 50% 45% at 30% 30%,#000 20%,transparent 70%)}
.hero h1{font:800 clamp(58px,8vw,128px)/.9 "Hanken Grotesk";letter-spacing:-.06em;margin-top:22px;max-width:1000px}
.hero p{margin-top:28px;font-size:21px;line-height:1.5;color:#a1a1a6;max-width:640px}
.hero p b{color:#ededef;font-weight:600}
.dizin{margin-top:46px;display:flex;gap:8px;flex-wrap:wrap}
.dizin a{display:inline-flex;align-items:center;gap:10px;height:44px;padding:0 18px 0 8px;border-radius:999px;background:var(--kart);box-shadow:inset 0 0 0 1px var(--cz);font:600 15px/1 "Hanken Grotesk";transition:box-shadow .2s}
.dizin a:hover{box-shadow:inset 0 0 0 1px var(--cz2)}
.dizin a span{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font:500 12px/1 "IBM Plex Mono";background:rgba(255,255,255,.06);color:var(--k2)}

/* ---------- KART YIĞINI ---------- */
.yigin{max-width:1240px;margin:0 auto;padding:40px 24px 0}
.hiz{position:sticky;top:calc(84px + var(--i) * 18px);margin-bottom:48px;min-height:min(640px,calc(100vh - 140px));border-radius:32px;background:#0c0c0e;box-shadow:inset 0 0 0 1px var(--cz2),0 -30px 60px -20px rgba(0,0,0,.8);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);overflow:hidden;transform-origin:top center}
.hiz .metin{padding:46px 46px 40px;display:flex;flex-direction:column}
.hiz .no{display:flex;align-items:center;gap:12px;font:500 13px/1 "IBM Plex Mono";color:var(--r)}
.hiz .no i{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-style:normal;background:color-mix(in srgb,var(--r) 18%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--r) 45%,transparent)}
.hiz h2{font:800 clamp(40px,4.4vw,64px)/.95 "Hanken Grotesk";letter-spacing:-.05em;margin-top:22px}
.hiz .ne{margin-top:18px;font-size:18px;line-height:1.5;color:#b4b4bb;max-width:480px}
.hiz ul{list-style:none;margin-top:24px;border-top:1px solid var(--cz)}
.hiz li{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--cz);font-size:15.5px;line-height:1.45;color:#d6d6da}
.hiz li::before{content:"";flex:none;width:6px;height:6px;margin-top:8px;border-radius:50%;background:var(--r)}
.hiz .kimin{margin-top:auto;padding-top:22px;font-size:14px;color:var(--soluk2)}
.hiz .kimin b{color:var(--soluk);font-weight:600}
.kanit{position:relative;background:radial-gradient(90% 80% at 70% 30%,color-mix(in srgb,var(--r) 22%,transparent),transparent 70%),#09090b;border-left:1px solid var(--cz);padding:40px;display:flex;flex-direction:column;justify-content:space-between;gap:20px;overflow:hidden}
.kanit .ust{display:flex;justify-content:space-between;align-items:center;gap:12px}
.kanit .ust small{font:500 11.5px/1 "IBM Plex Mono";letter-spacing:.14em;color:var(--soluk)}
.kanit .ust a{font:600 13.5px/1 "Hanken Grotesk";color:#ededef;border-bottom:1px solid rgba(255,255,255,.25);padding-bottom:3px}
.kanit .alt{font-size:14.5px;line-height:1.5;color:var(--soluk)}
.kanit .alt b{color:#ededef;font-weight:600}

/* kanıt 1: fotoğraftan okuma */
.okuma{display:grid;grid-template-columns:1fr auto 1fr;gap:16px;align-items:center}
.kagit{aspect-ratio:3/4;border-radius:10px;background:#efe9df;transform:rotate(-4deg);box-shadow:0 20px 40px rgba(0,0,0,.5);padding:14px;display:grid;grid-template-rows:auto 1fr;gap:8px;position:relative;overflow:hidden}
.kagit b{font:700 10px/1 "IBM Plex Mono";color:#5a4e3f;letter-spacing:.08em}
.kagit .tb{display:grid;grid-template-columns:repeat(4,1fr);gap:3px}
.kagit .tb i{height:12px;border-radius:2px;background:rgba(90,78,63,.18)}
.kagit .tb i.d{background:rgba(198,99,63,.45)}
.kagit::after{content:"";position:absolute;left:0;right:0;height:30%;top:-30%;background:linear-gradient(180deg,transparent,rgba(56,224,176,.35),transparent);animation:tara 2.8s cubic-bezier(.5,0,.5,1) infinite}
@keyframes tara{to{top:100%}}
.ok{font:500 22px/1 "IBM Plex Mono";color:var(--r)}
.satirlar{display:flex;flex-direction:column;gap:6px}
.satirlar div{display:flex;justify-content:space-between;padding:9px 11px;border-radius:10px;background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px var(--cz);font:500 12.5px/1 "IBM Plex Mono";color:#d6d6da;opacity:0;transform:translateX(-8px);animation:gel .5s forwards;animation-delay:calc(var(--d) * .25s + 1s)}
.satirlar div span:last-child{color:var(--r)}
@keyframes gel{to{opacity:1;transform:none}}
.sure{font:800 46px/1 "Hanken Grotesk";letter-spacing:-.04em}
.sure small{font:500 14px/1 "IBM Plex Mono";color:var(--soluk);letter-spacing:0;margin-left:8px}
/* kanıt 2: telefonlar */
.teller{display:flex;justify-content:center;gap:18px;align-items:flex-start}
.tel{width:190px;aspect-ratio:9/19.5;border-radius:34px;background:#0a0a0a;padding:7px;box-shadow:0 0 0 1.5px #2b2b2e,0 30px 70px rgba(0,0,0,.6);flex:none}
.tel img{width:100%;height:100%;object-fit:cover;object-position:top;border-radius:28px}
.teller .tel:nth-child(2){margin-top:40px}
/* kanıt 3: veri tablosu */
.veri{border-radius:18px;overflow:hidden;box-shadow:inset 0 0 0 1px var(--cz);background:rgba(22,12,16,.6)}
.veri div{display:grid;grid-template-columns:1.2fr 1fr;gap:12px;padding:13px 16px;border-top:1px solid var(--cz);font-size:14px;color:#cdb9b4}
.veri div:first-child{border-top:0;font:500 11px/1 "IBM Plex Mono";letter-spacing:.12em;color:#C2817D}
.veri div b{color:#F7EFEC;font-weight:600}
.veri-ek{display:flex;gap:8px;flex-wrap:wrap}
.veri-ek span{height:30px;padding:0 12px;border-radius:999px;display:inline-flex;align-items:center;font:500 12.5px/1 "IBM Plex Mono";background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px var(--cz2);color:#d6d6da}
/* kanıt 4: 3B */
.sahne3b{flex:1;min-height:240px;border-radius:20px;background:url(/assets/transit3d/sahne-kavsak.jpg) center/cover;box-shadow:inset 0 0 0 1px var(--cz2);position:relative}
.sahne3b span{position:absolute;left:14px;bottom:14px;padding:7px 11px;border-radius:9px;background:rgba(11,16,34,.82);font:500 12px/1 "IBM Plex Mono"}
.hat{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font:500 12.5px/1 "IBM Plex Mono";color:#d6d6da}
.hat b{padding:8px 11px;border-radius:9px;background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px var(--cz2);font-weight:500}
.hat i{font-style:normal;color:var(--r)}
/* kanıt 5: dört dünya */
.dunyalar{display:grid;grid-template-columns:1fr 1fr;gap:10px;flex:1}
.dunyalar a{border-radius:18px;padding:16px;display:flex;flex-direction:column;justify-content:space-between;min-height:130px;transition:transform .3s}
.dunyalar a:hover{transform:translateY(-3px)}
.dunyalar small{font:500 10.5px/1.3 "IBM Plex Mono";letter-spacing:.12em;opacity:.8}
.dunyalar b{font-size:46px;line-height:1}
.dunyalar .tl{background:linear-gradient(160deg,#8A3A63,#160C10);color:#F7EFEC}.dunyalar .tl b{font-family:"Playfair Display";font-style:italic;font-weight:400;color:#D5AC89}
.dunyalar .pl{background:linear-gradient(160deg,#1b6b55,#061a16);color:#eefaf6}.dunyalar .pl b{font-family:"Archivo";font-weight:800;color:#38e0b0}
.dunyalar .t3{background:linear-gradient(160deg,#2a2160,#0B1022);color:#E8ECF8}.dunyalar .t3 b{font-family:"Barlow Condensed";font-weight:800;color:#B39BFF}
.dunyalar .kk{background:linear-gradient(160deg,#2F6370,#0E1F26);color:#EEE2D2}.dunyalar .kk b{font-family:"Abril Fatface";color:#D8C38B}

/* ---------- NASIL ÇALIŞIRIZ ---------- */
.bol{max-width:1240px;margin:0 auto;padding:120px 24px 0}
.bol h2{font:700 clamp(40px,4.8vw,68px)/1 "Hanken Grotesk";letter-spacing:-.045em;margin-top:16px;max-width:860px}
.bol .giris{margin-top:18px;font-size:19px;line-height:1.5;color:#a1a1a6;max-width:640px}
.surec{margin-top:50px;display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--cz)}
.sa{position:relative;padding:28px 24px 10px 0}
.sa::before{content:"";position:absolute;top:-5px;left:0;width:9px;height:9px;border-radius:50%;background:var(--k2);box-shadow:0 0 0 5px rgba(224,138,92,.15)}
.sa span{font:500 12.5px/1 "IBM Plex Mono";color:var(--k2)}
.sa h3{font:700 25px/1.1 "Hanken Grotesk";letter-spacing:-.025em;margin-top:16px}
.sa p{margin-top:10px;font-size:15.5px;line-height:1.55;color:var(--soluk)}
.araclar{margin-top:44px;display:flex;flex-wrap:wrap;gap:8px}
.araclar span{height:38px;padding:0 15px;border-radius:999px;display:inline-flex;align-items:center;gap:8px;font:500 13.5px/1 "IBM Plex Mono";background:var(--kart);box-shadow:inset 0 0 0 1px var(--cz);color:#d6d6da}
.araclar span em{font-style:normal;color:var(--soluk2)}
.sss{margin-top:40px;border-top:1px solid var(--cz)}
.sss details{border-bottom:1px solid var(--cz)}
.sss summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:20px;padding:24px 0;font:700 22px/1.2 "Hanken Grotesk";letter-spacing:-.02em}
.sss summary::-webkit-details-marker{display:none}
.sss summary::after{content:"+";flex:none;font:400 28px/1 "Hanken Grotesk";color:var(--k2);transition:transform .25s}
.sss details[open] summary::after{transform:rotate(45deg)}
.sss details p{padding:0 0 24px;color:var(--soluk);font-size:17px;line-height:1.55;max-width:760px}
.son{position:relative;margin-top:140px;padding:140px 24px 130px;text-align:center;border-top:1px solid var(--cz);overflow:hidden}
.son::before{content:"";position:absolute;left:50%;top:50%;width:900px;max-width:100%;height:500px;transform:translate(-50%,-50%);background:radial-gradient(closest-side,rgba(198,99,63,.35),transparent);filter:blur(30px);z-index:-1}
.son h2{font:800 clamp(56px,8vw,128px)/.9 "Hanken Grotesk";letter-spacing:-.06em}
.son p{margin:22px auto 32px;font-size:20px;color:#c8c8cd;max-width:560px}

@media(max-width:980px){
  .hiz{grid-template-columns:1fr;position:relative;top:0;min-height:0}
  .kanit{border-left:0;border-top:1px solid var(--cz)}
  .surec{grid-template-columns:1fr 1fr;row-gap:20px}}
@media(max-width:560px){
  .hiz .metin,.kanit{padding:26px}
  .tel{width:140px}
  .surec{grid-template-columns:1fr}
  .okuma{grid-template-columns:1fr;justify-items:center}
  .kagit{width:60%}
  .ok{transform:rotate(90deg)}
  .satirlar{width:100%}
  .sure{font-size:32px}
  .sure small{display:block;margin:8px 0 0}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.gozle,.satirlar div{opacity:1;transform:none}}