:root { --alt-ust: 150px; }
:root{--k:#C6633F;--k2:#E08A5C;--pembe:#E0557A;--bg:#050506;--kart:#0b0b0d;--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:.14em;color:var(--k2)}
.serif{font-family:"Instrument Serif",serif;font-weight:400;font-style:italic;letter-spacing:-.01em}
.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}

/* ---------- 1 · GÜRÜLTÜDEN SİNYALE ---------- */
.sinyal{position:relative;height:260vh}
.sinyal .sabit{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;padding:0 24px}
.sinyal canvas{position:absolute;inset:0;width:100%;height:100%;opacity:var(--gurultu,.5);pointer-events:none}
.sinyal .etk{position:relative;transition:opacity .4s}
.cumle{position:relative;margin-top:28px;max-width:1100px;text-align:center;font:800 clamp(46px,7.2vw,112px)/.98 "Hanken Grotesk";letter-spacing:-.055em}
.cumle .kl{display:inline-block;white-space:nowrap}
.cumle .h{display:inline-block;will-change:transform,filter,opacity}
/* Harfler tek tek dönüştüğü için kelimeye verilen degrade boyanmıyor: her harfe kendi tonu. */
.cumle .sinyal-k .h{color:var(--ton)}
.ipucu{position:absolute;bottom:34px;left:50%;transform:translateX(-50%);font:500 12px/1 "IBM Plex Mono";letter-spacing:.14em;color:var(--soluk2);transition:opacity .4s}
.olcer{position:absolute;bottom:70px;left:50%;width:min(320px,70vw);transform:translateX(-50%);display:flex;align-items:center;gap:12px;font:500 11px/1 "IBM Plex Mono";letter-spacing:.12em;color:var(--soluk2)}
.olcer i{flex:1;height:2px;border-radius:2px;background:rgba(255,255,255,.1);overflow:hidden}
.olcer i b{display:block;height:100%;width:100%;background:linear-gradient(90deg,var(--k),var(--pembe));transform-origin:left;transform:scaleX(var(--p,0))}

/* ---------- 2 · METİN, KELİME KELİME ---------- */
.metin{max-width:1000px;margin:0 auto;padding:60px 24px 40px}
.metin p{font:600 clamp(32px,4.2vw,58px)/1.16 "Hanken Grotesk";letter-spacing:-.035em;margin-bottom:.9em}
.metin p .w{color:#2a2a2e;transition:color .35s}
.metin p .w.on{color:#ededef}
.metin p .w.on.vurgu{color:var(--k2)}
.metin p .serif.w.on{color:#fff}

/* ---------- 3 · BEŞ ÖZELLİK ---------- */
.bol{max-width:1240px;margin:0 auto;padding:120px 24px 0}
.bol .bb{display:flex;justify-content:space-between;align-items:end;gap:30px;flex-wrap:wrap}
.bol h2{font:700 clamp(40px,4.8vw,68px)/1 "Hanken Grotesk";letter-spacing:-.045em;margin-top:16px}
.bol .bb p{max-width:420px;font-size:17px;line-height:1.55;color:var(--soluk)}
.ozellikler{margin-top:50px;border-top:1px solid var(--cz)}
.oz{display:grid;grid-template-columns:140px minmax(0,1.1fr) minmax(0,1fr);gap:30px;align-items:center;padding:40px 0;border-bottom:1px solid var(--cz);transition:background .4s}
.oz:hover{background:linear-gradient(90deg,rgba(198,99,63,.06),transparent 60%)}
.oz .no{font:400 clamp(64px,6vw,96px)/.8 "Instrument Serif",serif;font-style:italic;color:#3a3a3e;transition:color .4s}
.oz:hover .no{color:var(--k2)}
.oz h3{font:700 clamp(30px,3.2vw,46px)/1 "Hanken Grotesk";letter-spacing:-.04em}
.oz h3 + p{margin-top:12px;font:400 italic clamp(22px,2vw,28px)/1.25 "Instrument Serif",serif;color:#c8c8cd}
.oz .kanit{padding:20px 22px;border-radius:20px;background:var(--kart);box-shadow:inset 0 0 0 1px var(--cz);transition:box-shadow .3s}
.oz .kanit:hover{box-shadow:inset 0 0 0 1px var(--cz2)}
.oz .kanit small{display:flex;justify-content:space-between;font:500 11px/1 "IBM Plex Mono";letter-spacing:.14em;color:var(--soluk2)}
.oz .kanit small i{font-style:normal;color:var(--r)}
.oz .kanit p{margin-top:10px;font-size:15.5px;line-height:1.5;color:#c8c8cd}
.oz .kanit p b{color:#fff;font-weight:600}

/* ---------- 4 · BEŞ KELİME ---------- */
.kelimeler{margin-top:140px;border-top:1px solid var(--cz);border-bottom:1px solid var(--cz);overflow:hidden;padding:30px 0}
.kayan{display:flex;gap:60px;width:max-content;animation:kay 34s linear infinite}
.kayan span{font:800 clamp(64px,9vw,150px)/1 "Hanken Grotesk";letter-spacing:-.06em;color:transparent;-webkit-text-stroke:1.2px rgba(255,255,255,.22);white-space:nowrap}
.kayan span:nth-child(5n+1){color:#ededef;-webkit-text-stroke:0}
.kayan span em{font:400 italic .9em/1 "Instrument Serif",serif;color:var(--k2);-webkit-text-stroke:0;margin-left:60px}
@keyframes kay{to{transform:translateX(-50%)}}

/* ---------- 5 · İMZA ---------- */
.imza{max-width:1000px;margin:0 auto;padding:150px 24px 0;text-align:center}
.imza blockquote{font:400 italic clamp(40px,5vw,72px)/1.08 "Instrument Serif",serif;letter-spacing:-.015em}
.imza blockquote b{font-style:normal;font-family:"Hanken Grotesk";font-weight:800;letter-spacing:-.05em}
.imza .kim{margin-top:44px;display:flex;justify-content:center;gap:34px;flex-wrap:wrap}
.imza .kim a{display:flex;align-items:center;gap:14px;text-align:left}
.imza .kim img{width:58px;height:58px;border-radius:50%;object-fit:cover;filter:grayscale(1)}
.imza .kim b{display:block;font:700 17px/1.2 "Hanken Grotesk"}
.imza .kim small{display:block;margin-top:5px;font:500 11px/1 "IBM Plex Mono";letter-spacing:.12em;color:var(--k2)}
.imza .dgm{margin-top:56px;display:flex;justify-content:center;gap:12px;flex-wrap:wrap}

@media(max-width:900px){
  .oz{grid-template-columns:70px minmax(0,1fr);gap:16px 18px}
  .oz .kanit{grid-column:1/-1}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.gozle{opacity:1;transform:none}.metin p .w{color:#ededef}}