/* ===========================================================
   Sami İrek — Resmi Site
   Koyu, zarif, modern sanatçı estetiği (Tarkan/Kenan Doğulu ruhu)
   =========================================================== */

:root {
  --bg:        #0d0d10;
  --bg-2:      #14141a;
  --bg-3:      #1b1b22;
  --text:      #ecebe8;
  --text-dim:  #9a978f;
  --accent:    #c9a24b;   /* sıcak altın — akustik/samimi tona uygun */
  --accent-2:  #e8cd85;
  --line:      rgba(255,255,255,.08);
  --serif: "Cormorant Garamond", Georgia, serif;
  --sans:  "Inter", system-ui, -apple-system, sans-serif;
  --maxw: 1180px;
}

* { margin:0; padding:0; box-sizing:border-box; }

html { scroll-behavior:smooth; }

body {
  background:var(--bg);
  color:var(--text);
  font-family:var(--sans);
  font-weight:300;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img { display:block; width:100%; height:100%; object-fit:cover; }

a { color:inherit; text-decoration:none; transition:color .25s ease, opacity .25s ease; }

/* ============ NAV ============ */
.nav {
  position:fixed; top:0; left:0; right:0; z-index:100;
  transition:background .35s ease, backdrop-filter .35s ease, border-color .35s ease;
  border-bottom:1px solid transparent;
}
.nav.scrolled {
  background:rgba(13,13,16,.82);
  backdrop-filter:blur(14px);
  border-bottom-color:var(--line);
}
.nav__inner {
  max-width:var(--maxw); margin:0 auto;
  padding:22px 28px;
  display:flex; align-items:center; justify-content:space-between;
}
.nav__logo {
  font-family:var(--serif);
  font-size:1.35rem; letter-spacing:.22em; font-weight:600;
}
.nav__links { display:flex; gap:34px; }
.nav__links a {
  font-size:.82rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--text-dim); position:relative;
}
.nav__links a::after {
  content:""; position:absolute; left:0; bottom:-6px;
  width:0; height:1px; background:var(--accent); transition:width .3s ease;
}
.nav__links a:hover { color:var(--text); }
.nav__links a:hover::after { width:100%; }

.nav__burger { display:none; background:none; border:0; cursor:pointer; width:28px; height:22px; position:relative; }
.nav__burger span {
  position:absolute; left:0; width:100%; height:2px; background:var(--text);
  transition:.3s ease;
}
.nav__burger span:nth-child(1){ top:0; }
.nav__burger span:nth-child(2){ top:10px; }
.nav__burger span:nth-child(3){ top:20px; }
.nav__burger.open span:nth-child(1){ top:10px; transform:rotate(45deg); }
.nav__burger.open span:nth-child(2){ opacity:0; }
.nav__burger.open span:nth-child(3){ top:10px; transform:rotate(-45deg); }

/* ============ HERO ============ */
.hero {
  position:relative; min-height:100vh;
  display:flex; align-items:center;
  overflow:hidden;
}
.hero__bg {
  position:absolute; inset:0;
  background-size:cover; background-position:center 40%;
  background-repeat:no-repeat;
  transform:scale(1.05);
  animation:heroZoom 18s ease-out forwards;
}
/* Fotosuz hero: sade, zarif koyu doku (yatay foto bulunana kadar) */
.hero--noimg .hero__bg {
  background:
    radial-gradient(1200px 600px at 30% 25%, rgba(201,162,75,.10), transparent 60%),
    radial-gradient(900px 500px at 80% 80%, rgba(201,162,75,.06), transparent 60%),
    linear-gradient(160deg, #16151b 0%, #0d0d10 60%, #08080a 100%);
  animation:none; transform:none;
}
@keyframes heroZoom { to { transform:scale(1); } }
.hero__overlay {
  position:absolute; inset:0;
  background:
    /* üstte menüyü okunur kılan koyu bant */
    linear-gradient(180deg, rgba(13,13,16,.75) 0%, rgba(13,13,16,.15) 18%, rgba(13,13,16,.15) 45%, rgba(13,13,16,.97) 100%),
    /* soldan yazı bloğunu güçlendiren koyuluk */
    linear-gradient(90deg, rgba(13,13,16,.65) 0%, rgba(13,13,16,0) 65%);
}
.hero__content {
  position:relative; z-index:2;
  max-width:var(--maxw); width:100%; margin:0 auto;
  padding:0 28px;
}
.hero__eyebrow {
  font-size:.72rem; letter-spacing:.4em; color:var(--accent);
  text-transform:uppercase; margin-bottom:18px;
}
.hero__title {
  font-family:var(--serif); font-weight:600;
  font-size:clamp(3.5rem, 11vw, 8rem);
  line-height:.95; letter-spacing:.02em; margin-bottom:20px;
}
.hero__tagline {
  font-size:clamp(1rem,2.2vw,1.35rem);
  color:var(--text-dim); max-width:560px; margin-bottom:38px;
}
.hero__cta { display:flex; gap:16px; flex-wrap:wrap; margin-bottom:46px; }
.hero__socials { display:flex; gap:26px; flex-wrap:wrap; }
.hero__socials a {
  font-size:.82rem; letter-spacing:.1em; color:var(--text-dim);
}
.hero__socials a:hover { color:var(--accent); }
/* Pasif link (YouTube — Sami kendi kanalını sonra koyacak) */
.is-disabled { opacity:.45; cursor:default; pointer-events:none; }
.hero__scroll {
  position:absolute; bottom:30px; left:50%; transform:translateX(-50%);
  z-index:2; font-size:1.4rem; color:var(--text-dim);
  animation:bob 2s ease-in-out infinite;
}
@keyframes bob { 0%,100%{ transform:translate(-50%,0);} 50%{ transform:translate(-50%,8px);} }

/* ============ BUTTONS ============ */
.btn {
  display:inline-block; padding:14px 30px;
  font-size:.8rem; letter-spacing:.14em; text-transform:uppercase;
  border:1px solid var(--accent); border-radius:2px;
  transition:.28s ease;
}
.btn--primary { background:var(--accent); color:#15130c; }
.btn--primary:hover { background:var(--accent-2); border-color:var(--accent-2); }
.btn--ghost { color:var(--text); border-color:var(--line); }
.btn--ghost:hover { border-color:var(--accent); color:var(--accent); }

/* ============ SECTIONS ============ */
.section {
  max-width:var(--maxw); margin:0 auto;
  padding:110px 28px;
  border-top:1px solid var(--line);
}
.section__head {
  display:flex; align-items:baseline; gap:18px; margin-bottom:54px;
}
.section__num {
  font-family:var(--serif); font-size:1rem; color:var(--accent); letter-spacing:.2em;
}
.section__title {
  font-family:var(--serif); font-weight:500;
  font-size:clamp(2rem,5vw,3.2rem); letter-spacing:.01em;
}

/* ---- BIO ---- */
.bio__grid { display:grid; grid-template-columns:1fr 1.3fr; gap:56px; align-items:start; }
.bio__photo {
  aspect-ratio:4/5; border-radius:3px; overflow:hidden;
  filter:grayscale(.15) contrast(1.02);
}
.bio__photo img { object-position:center 62%; }
.bio__lead { font-family:var(--serif); font-size:1.5rem; color:var(--text); margin-bottom:24px; line-height:1.4; }
.bio__text p { color:var(--text-dim); margin-bottom:18px; }
.bio__text strong { color:var(--text); font-weight:500; }
.link-arrow { display:inline-block; margin-top:12px; color:var(--accent); letter-spacing:.08em; font-size:.9rem; }
.link-arrow:hover { color:var(--accent-2); }

/* ---- MUSIC ---- */
/* Alt başlık = küçük, harf-aralıklı etiket. "Müzik" ana başlığıyla net hiyerarşi. */
.music__subtitle {
  display:flex; align-items:center; gap:16px;
  font-family:var(--sans); font-weight:500; font-size:.8rem;
  text-transform:uppercase; letter-spacing:.22em;
  color:var(--accent);
  margin:0 0 30px;
}
.music__subtitle::after {
  content:""; flex:1; height:1px; background:var(--line);
}
/* başlık ile bir sonraki grup arasına nefes payı */
.music__subtitle:not(:first-of-type) { margin-top:64px; }
/* auto-fill + minmax: az kart varsa sola hizalı, çoğaldıkça satıra dizilir */
.music__grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(230px, 280px)); gap:36px; }
.release__cover {
  position:relative; aspect-ratio:1; border-radius:3px; overflow:hidden; margin-bottom:18px;
  background:var(--bg-3);
}
.release__cover img { transition:transform .5s ease, filter .5s ease; }
.release:hover .release__cover img { transform:scale(1.06); filter:brightness(.6); }
.release__play {
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  font-size:1.6rem; color:#fff; opacity:0; transition:opacity .3s ease;
}
.release:hover .release__play { opacity:1; }
.release__name { font-family:var(--serif); font-size:1.35rem; font-weight:500; }
.release__meta { color:var(--text-dim); font-size:.85rem; margin:4px 0 12px; letter-spacing:.05em; }
.release__links { display:flex; gap:16px; }
.release__links a { font-size:.8rem; letter-spacing:.08em; color:var(--text-dim); }
.release__links a:hover { color:var(--accent); }

/* ---- VIDEO ---- */
.video__grid { display:grid; grid-template-columns:repeat(2,1fr); gap:34px; }
.video__frame { position:relative; aspect-ratio:16/9; border-radius:3px; overflow:hidden; background:var(--bg-3); }
.video__frame iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }

/* ---- SHOWS ---- */
.shows__list { list-style:none; }
.show {
  display:grid; grid-template-columns:110px 1fr auto; gap:34px; align-items:center;
  padding:28px 0; border-bottom:1px solid var(--line);
  transition:padding-left .3s ease;
}
.show:first-child { border-top:1px solid var(--line); }
.show:hover { padding-left:12px; }

/* Tarih bloğu: büyük gün + küçük ay */
.show__date {
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  border-right:1px solid var(--line); padding-right:20px;
}
.show__day { font-family:var(--serif); font-size:2.6rem; line-height:1; color:var(--accent); }
.show__mon { font-size:.72rem; letter-spacing:.2em; color:var(--text-dim); margin-top:6px; }

/* Orta bilgi bloğu */
.show__info { display:flex; flex-direction:column; gap:6px; }
.show__title { font-family:var(--serif); font-size:1.4rem; font-weight:500; color:var(--text); }
.show__venue { color:var(--text-dim); font-size:.95rem; }
.show__extra { color:var(--text-dim); font-size:.82rem; letter-spacing:.05em; }

.show__cta {
  font-size:.78rem; letter-spacing:.12em; text-transform:uppercase; color:var(--text);
  border:1px solid var(--accent); padding:12px 26px; border-radius:2px;
  white-space:nowrap; transition:.25s ease;
}
.show__cta:hover { background:var(--accent); color:#15130c; }

/* ---- CONTACT ---- */
.contact__grid { display:grid; grid-template-columns:1fr 1fr; gap:56px; }
.contact__block h3 { font-family:var(--serif); font-weight:500; font-size:1.4rem; margin-bottom:16px; }
.contact__mail { font-size:1.15rem; color:var(--accent); letter-spacing:.02em; }
.contact__mail:hover { color:var(--accent-2); }
.contact__socials { display:flex; flex-direction:column; gap:10px; }
.contact__socials a { color:var(--text-dim); letter-spacing:.06em; }
.contact__socials a:hover { color:var(--text); }

/* ============ FOOTER ============ */
.footer {
  text-align:center; padding:60px 28px 48px;
  border-top:1px solid var(--line);
}
.footer__brand { font-family:var(--serif); letter-spacing:.3em; font-size:1.1rem; margin-bottom:12px; }
.footer__copy { color:var(--text-dim); font-size:.82rem; margin-bottom:18px; }
.footer__top { font-size:.78rem; letter-spacing:.12em; text-transform:uppercase; color:var(--accent); }

/* ============ REVEAL ANIM ============ */
.section, .release, .video__frame { opacity:0; transform:translateY(24px); transition:opacity .7s ease, transform .7s ease; }
.section.in, .release.in, .video__frame.in { opacity:1; transform:none; }

/* ============ RESPONSIVE ============ */
@media (max-width:860px) {
  .nav__links {
    position:fixed; inset:0 0 0 auto; width:74%; max-width:320px;
    flex-direction:column; justify-content:center; gap:30px;
    background:var(--bg-2); padding:40px;
    transform:translateX(100%); transition:transform .35s ease;
    border-left:1px solid var(--line);
  }
  .nav__links.open { transform:none; }
  .nav__links a { font-size:1rem; }
  .nav__burger { display:block; z-index:110; }

  .bio__grid { grid-template-columns:1fr; gap:34px; }
  .bio__photo { max-width:340px; }
  .music__grid { grid-template-columns:repeat(2,1fr); gap:22px; }
  .video__grid { grid-template-columns:1fr; }
  .contact__grid { grid-template-columns:1fr; gap:36px; }
  .show { grid-template-columns:80px 1fr; gap:20px; row-gap:16px; }
  .show__cta { grid-column:2; justify-self:start; margin-top:4px; }
  .show__day { font-size:2.1rem; }
  .section { padding:80px 22px; }
}
@media (max-width:480px) {
  .music__grid { grid-template-columns:1fr; }
  .hero__cta { flex-direction:column; }
  .btn { text-align:center; }
}
