*{margin:0;padding:0;box-sizing:border-box}
:root{
  --s:#050505;--g:#d4a843;--g2:#8b6a1e;
  --w:#ffffff;--gr:#888;--gr2:#444;
}
html{scroll-behavior:smooth}
body{background:var(--s);color:var(--w);font-family:'Inter',sans-serif;overflow-x:hidden}

/* NAV */
nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  padding:18px 40px;
  display:flex;justify-content:space-between;align-items:center;
  background:rgba(5,5,5,0.92);backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(255,255,255,0.04);
  transition:padding .3s;
}
nav.scrolled{padding:12px 40px}
.nav-logo{
  font-family:'Cormorant Garamond',serif;
  font-size:22px;font-weight:300;letter-spacing:.2em;
  color:var(--w);text-decoration:none;
}
.nav-links{display:flex;gap:32px;list-style:none;align-items:center}
.nav-links a{
  font-size:11px;letter-spacing:2px;color:var(--gr);
  text-transform:uppercase;text-decoration:none;
  font-family:'Inter',sans-serif;transition:color .3s;
}
.nav-links a:hover{color:var(--g)}
.nav-satin{
  padding:8px 20px;border:1px solid var(--g);
  color:var(--g);font-size:11px;letter-spacing:2px;
  text-transform:uppercase;text-decoration:none;
  font-family:'Inter',sans-serif;transition:all .3s;
}
.nav-satin:hover{background:var(--g);color:var(--s)}
.hamburger{
  display:none;flex-direction:column;gap:5px;
  background:none;border:none;cursor:pointer;padding:4px;
}
.hamburger span{
  display:block;width:22px;height:1px;
  background:var(--gr);transition:all .3s;
}
.hamburger.open span:nth-child(1){transform:rotate(45deg) translate(4px,4px)}
.hamburger.open span:nth-child(2){opacity:0}
.hamburger.open span:nth-child(3){transform:rotate(-45deg) translate(4px,-4px)}

/* HERO */
.hero{
  min-height:100vh;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  position:relative;text-align:center;padding:100px 24px 60px;
}
.hero-bg{
  position:absolute;inset:0;
  background:
    linear-gradient(to bottom,rgba(5,5,5,0.6) 0%,rgba(5,5,5,0.85) 60%,#050505 100%),
    url('kapak.jpg') no-repeat center 30%;
  background-size:cover;z-index:0;
}
canvas#particles{position:absolute;inset:0;z-index:1;pointer-events:none}
.hero-content{position:relative;z-index:2;max-width:800px}
.eyebrow{
  font-family:'Inter',sans-serif;font-size:11px;font-weight:300;
  letter-spacing:5px;color:var(--g);text-transform:uppercase;
  margin-bottom:32px;opacity:.8;
}
.title{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(72px,14vw,140px);
  font-weight:300;letter-spacing:0.15em;
  color:var(--w);line-height:.9;margin-bottom:24px;
}
.subtitle{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(14px,2vw,18px);
  font-weight:300;font-style:italic;
  color:var(--gr);letter-spacing:.05em;
  margin-bottom:48px;line-height:1.6;
}
.divider{width:60px;height:1px;background:var(--g2);margin:0 auto 48px;opacity:.6}
.motto{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(16px,2.5vw,22px);
  font-weight:400;font-style:italic;
  color:var(--g);letter-spacing:.02em;
  line-height:1.7;margin-bottom:56px;
}
.hero-cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.btn-primary{
  padding:14px 32px;background:transparent;border:1px solid var(--g);
  color:var(--g);font-size:12px;letter-spacing:3px;
  text-transform:uppercase;cursor:pointer;
  font-family:'Inter',sans-serif;transition:all .3s;text-decoration:none;display:inline-block;
}
.btn-primary:hover{background:var(--g);color:var(--s)}
.btn-secondary{
  padding:14px 32px;background:transparent;border:1px solid var(--gr2);
  color:var(--gr);font-size:12px;letter-spacing:3px;
  text-transform:uppercase;cursor:pointer;
  font-family:'Inter',sans-serif;transition:all .3s;text-decoration:none;display:inline-block;
}
.btn-secondary:hover{border-color:var(--gr);color:var(--w)}
.btn-gold{
  padding:14px 32px;background:var(--g);border:1px solid var(--g);
  color:var(--s);font-size:12px;letter-spacing:3px;
  text-transform:uppercase;cursor:pointer;
  font-family:'Inter',sans-serif;font-weight:500;
  transition:all .3s;text-decoration:none;display:inline-block;
}
.btn-gold:hover{background:var(--w);border-color:var(--w)}
.scroll-hint{
  position:absolute;bottom:40px;left:50%;transform:translateX(-50%);
  z-index:2;display:flex;flex-direction:column;align-items:center;gap:8px;
}
.scroll-hint span{font-size:10px;letter-spacing:3px;color:var(--gr2);text-transform:uppercase}
.scroll-line{width:1px;height:40px;background:linear-gradient(to bottom,var(--gr2),transparent);animation:scrolldown 1.5s infinite}
@keyframes scrolldown{
  0%{transform:scaleY(0);transform-origin:top}
  50%{transform:scaleY(1);transform-origin:top}
  51%{transform:scaleY(1);transform-origin:bottom}
  100%{transform:scaleY(0);transform-origin:bottom}
}

/* SORULAR */
.sorular{padding:120px 24px;max-width:700px;margin:0 auto;text-align:center}
.section-eyebrow{
  font-size:10px;letter-spacing:5px;color:var(--g2);
  text-transform:uppercase;margin-bottom:64px;font-family:'Inter',sans-serif;display:block;
}
.soru-item{margin-bottom:52px}
.soru-text{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(22px,4vw,36px);
  font-weight:300;font-style:italic;color:var(--gr);line-height:1.4;transition:color .4s;
}
.soru-text:hover{color:var(--w)}
.soru-nokta{color:var(--g);font-size:20px;margin-top:24px;display:block}
.soru-vurus{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(26px,5vw,48px);
  font-weight:400;color:var(--w);line-height:1.3;margin-top:64px;
}
.soru-vurus span{color:var(--g);font-style:italic}

/* SATIN AL */
.satin{
  padding:80px 24px;text-align:center;
  background:linear-gradient(to bottom,#050505,#0c0800,#050505);
}
.satin-inner{max-width:600px;margin:0 auto}
.satin-title{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(28px,4vw,44px);font-weight:300;
  color:var(--w);line-height:1.3;margin-bottom:16px;
}
.satin-sub{
  font-size:14px;color:var(--gr);line-height:1.7;
  margin-bottom:40px;font-family:'Inter',sans-serif;font-weight:300;
}
.satin-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-bottom:24px}
.satin-info{font-size:11px;color:var(--gr2);font-family:'Inter',sans-serif;line-height:1.8}

/* SESLİ KİTAP */
.sesli{padding:120px 24px;text-align:center}
.sesli-inner{max-width:600px;margin:0 auto}
.sesli-title{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(28px,4vw,42px);font-weight:300;
  color:var(--w);line-height:1.3;margin-bottom:24px;
}
.sesli-desc{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(16px,2vw,20px);font-style:italic;
  color:var(--gr);line-height:1.8;margin-bottom:48px;
}
.player-card{
  background:#0a0a0a;border:1px solid #1c1c1c;
  padding:28px 28px;margin-bottom:12px;text-align:left;
  transition:border-color .3s;
}
.player-card:hover{border-color:#2a2a2a}
.player-meta{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.player-tag{font-size:10px;letter-spacing:3px;color:var(--g);text-transform:uppercase;font-family:'Inter',sans-serif}
.player-dur{font-size:11px;color:var(--gr2);font-family:'Inter',sans-serif}
.player-quote{
  font-family:'Cormorant Garamond',serif;
  font-size:17px;font-style:italic;color:var(--gr);
  line-height:1.5;margin-bottom:20px;
}
.player-row{display:flex;align-items:center;gap:16px}
.play-btn{
  width:42px;height:42px;border-radius:50%;
  background:var(--g);border:none;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;transition:all .3s;
}
.play-btn:hover{background:var(--w);transform:scale(1.05)}
.play-btn svg{fill:var(--s);width:15px;height:15px}
.progress-wrap{flex:1}
.progress-bar{height:2px;background:#222;border-radius:2px;cursor:pointer;margin-bottom:8px;position:relative}
.progress-fill{height:100%;background:var(--g);border-radius:2px;width:0%;transition:width .1s linear}
.time-row{display:flex;justify-content:space-between}
.time-row span{font-size:11px;color:var(--gr2);font-family:'Inter',sans-serif}

/* BÖLÜMLER */
.bolumler{padding:120px 24px}
.bolumler-inner{max-width:1000px;margin:0 auto}
.bolumler-header{text-align:center;margin-bottom:72px}
.bolumler-title{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(32px,5vw,52px);font-weight:300;color:var(--w);line-height:1.2;
}
.grid-20{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1px;background:#111}
.g-item{
  background:var(--s);padding:24px 22px;
  transition:background .3s;display:flex;flex-direction:column;gap:6px;
}
.g-item:hover{background:#0c0800}
.g-no{font-size:10px;letter-spacing:3px;color:var(--g2);text-transform:uppercase;font-family:'Inter',sans-serif}
.g-name{font-family:'Cormorant Garamond',serif;font-size:19px;font-weight:400;color:var(--w);line-height:1.3}
.g-acik{font-size:12px;color:var(--gr2);line-height:1.6;font-family:'Inter',sans-serif;font-weight:300}

/* YAZAR */
.yazar{padding:120px 24px;border-top:1px solid #0f0f0f}
.yazar-inner{max-width:680px;margin:0 auto;text-align:center}
.yazar-title{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(32px,5vw,52px);font-weight:300;color:var(--w);margin-bottom:32px;
}
.yazar-bio{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(17px,2.5vw,20px);font-weight:300;
  color:var(--gr);line-height:1.9;margin-bottom:48px;font-style:italic;
}
.yazar-imza{font-family:'Cormorant Garamond',serif;font-size:28px;font-weight:300;color:var(--g);letter-spacing:.1em}

/* BÜLTEn */
.mail{padding:120px 24px;text-align:center;background:linear-gradient(to bottom,#050505,#07050,#050505)}
.mail-inner{max-width:480px;margin:0 auto}
.mail-title{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(28px,4vw,44px);font-weight:300;color:var(--w);line-height:1.3;margin-bottom:16px;
}
.mail-sub{font-size:14px;color:var(--gr);line-height:1.7;margin-bottom:40px;font-family:'Inter',sans-serif;font-weight:300}
.mail-form{display:flex;max-width:420px;margin:0 auto 12px}
.mail-input{
  flex:1;padding:14px 18px;
  background:#0d0d0d;border:1px solid #1a1a1a;border-right:none;
  color:var(--w);font-size:14px;font-family:'Inter',sans-serif;outline:none;
}
.mail-input::placeholder{color:var(--gr2)}
.mail-input:focus{border-color:var(--g2)}
.mail-btn{
  padding:14px 22px;background:var(--g);border:none;color:var(--s);
  cursor:pointer;font-size:11px;letter-spacing:2px;
  text-transform:uppercase;font-family:'Inter',sans-serif;font-weight:500;
  transition:background .3s;white-space:nowrap;
}
.mail-btn:hover{background:var(--w)}
.mail-note{font-size:11px;color:var(--gr2);font-family:'Inter',sans-serif}
.mail-success{
  display:none;padding:16px;border:1px solid var(--g2);
  font-family:'Cormorant Garamond',serif;font-size:18px;
  color:var(--g);font-style:italic;
}

/* FOOTER */
footer{padding:60px 24px;border-top:1px solid #0f0f0f;text-align:center}
.footer-motto{
  font-family:'Cormorant Garamond',serif;
  font-size:18px;font-style:italic;color:var(--g2);margin-bottom:20px;line-height:1.6;
}
.footer-links{display:flex;gap:20px;justify-content:center;margin-bottom:20px}
.footer-links a{font-size:12px;color:var(--gr2);text-decoration:none;letter-spacing:1px;font-family:'Inter',sans-serif}
.footer-links a:hover{color:var(--g)}
.footer-links span{color:var(--gr2)}
.footer-copy{font-size:11px;color:#333;letter-spacing:2px;font-family:'Inter',sans-serif}

/* FADE IN */
.fade-in{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}
.fade-in.visible{opacity:1;transform:none}

/* MOBİL */
@media(max-width:768px){
  nav{padding:16px 20px}
  .hamburger{display:flex}
  .nav-links{
    display:none;position:fixed;top:60px;left:0;right:0;
    background:rgba(5,5,5,0.98);flex-direction:column;
    align-items:center;gap:0;padding:20px 0;
    border-bottom:1px solid #111;
  }
  .nav-links.open{display:flex}
  .nav-links li{width:100%;text-align:center}
  .nav-links a{display:block;padding:14px 24px;border-bottom:1px solid #111}
  .nav-satin{display:none}
  .hero-cta{flex-direction:column;align-items:center}
  .btn-primary,.btn-secondary,.btn-gold{width:260px;text-align:center}
  .grid-20{grid-template-columns:1fr}
  .satin-btns{flex-direction:column;align-items:center}
  .mail-form{flex-direction:column}
  .mail-input{border-right:1px solid #1a1a1a;border-bottom:none}
  .mail-btn{padding:14px}
}