:root{
  --bg:#08080a; --bg2:#101014; --fg:#f2f2f2; --muted:#9a9aa5; --line:#26262e;
  --green:#39ff88; --purple:#9b5cff; --red:#ff6b7a;
  --display:'Anton',Impact,sans-serif; --body:'Space Grotesk',system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:72px}
body{background:var(--bg);color:var(--fg);font-family:var(--body);line-height:1.6;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{display:block}
:focus-visible{outline:2px solid var(--green);outline-offset:3px}

.grain{position:fixed;inset:0;pointer-events:none;z-index:50;opacity:.07;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}
.progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:60;transform-origin:left;transform:scaleX(var(--p,0));
  background:linear-gradient(90deg,var(--green),var(--purple))}

.nav{position:fixed;top:0;left:0;right:0;z-index:40;display:flex;justify-content:space-between;align-items:center;gap:16px;
  padding:16px clamp(16px,4vw,48px);backdrop-filter:blur(10px);background:rgba(8,8,10,.6)}
.logo{font-family:var(--display);font-size:1.6rem;letter-spacing:.08em;flex-shrink:0}
.nav nav{display:flex;align-items:center;gap:clamp(12px,2.2vw,32px)}
.nav nav a{font-size:.85rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);transition:color .2s;white-space:nowrap}
.nav nav a:hover{color:var(--green)}
.nav nav a.nav-cta{color:var(--green)}

/* Hero */
.hero{min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;text-align:center;padding:90px clamp(16px,4vw,48px) 20px;position:relative;overflow:hidden;
  background:radial-gradient(45% 70% at 50% 25%,#0b1a8c,transparent 100%),
             radial-gradient(50% 50% at 90% 85%,rgba(57,255,136,.14),transparent 70%),
             radial-gradient(50% 60% at 8% 30%,rgba(155,92,255,.26),transparent 70%),var(--bg)}
.hero-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 12%;user-select:none;pointer-events:none;will-change:transform}
.hero-shade{position:absolute;inset:0;background:linear-gradient(0deg,var(--bg) 2%,rgba(8,8,10,.86) 28%,rgba(8,8,10,.15) 62%,rgba(8,8,10,.35) 100%)}
.wave{position:absolute;left:0;top:-20px;width:100%;height:40px;pointer-events:none}
.hero-inner{position:relative;width:100%}
.hero-foot{position:relative;width:100%;display:flex;justify-content:space-between;align-items:center;gap:16px 24px;flex-wrap:wrap;margin-top:34px;padding-top:24px;text-align:left}
.booking-label{display:block;font-size:.78rem;font-weight:500;text-transform:uppercase;letter-spacing:.16em;color:#fff;margin-bottom:2px}
.booking-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.booking-row a{font-weight:500;font-size:clamp(1.1rem,1.9vw,1.4rem);line-height:1.3;color:#fff;overflow-wrap:anywhere;transition:color .2s}
.booking-row a:hover{color:var(--green)}
.copy{background:#fff;border:1px solid #fff;color:#08080a;font:inherit;font-size:.75rem;font-weight:700;padding:4px 11px;border-radius:2px;cursor:pointer;transition:.2s}
.copy:hover{background:var(--green);border-color:var(--green)}
.socials{display:flex;gap:12px}
.socials a{width:52px;height:52px;display:grid;place-items:center;border-radius:50%;background:#fff;color:#08080a;box-shadow:0 6px 22px rgba(0,0,0,.45);transition:.2s}
.socials a:hover{background:var(--green);transform:translateY(-3px);box-shadow:0 0 24px rgba(57,255,136,.55)}
.socials svg{width:24px;height:24px}
.yt-play{fill:#fff;transition:fill .2s}
.socials a:hover .yt-play{fill:var(--green)}
@media(min-aspect-ratio:1/1){
  .hero-photo{left:50%;width:auto;height:100%;translate:-50% 0;object-fit:contain;
    -webkit-mask-image:linear-gradient(90deg,transparent,#000 22%,#000 78%,transparent);mask-image:linear-gradient(90deg,transparent,#000 22%,#000 78%,transparent)}
}
.hero-title{position:relative;font-family:var(--display);font-weight:400;font-size:clamp(4.5rem,min(26vw,27vh),20rem);line-height:.95;letter-spacing:.02em;
  animation:rise 1s cubic-bezier(.2,.8,.2,1) both}
.hero-title span{display:block;padding:.05em .02em}
.t-base{color:transparent;-webkit-text-stroke:2px #fff}
.t-fill{position:absolute;inset:0;color:transparent;background:linear-gradient(100deg,var(--green),#f2f2f2 55%,var(--purple));
  -webkit-background-clip:text;background-clip:text;
  -webkit-mask-image:radial-gradient(circle clamp(90px,17vw,270px) at var(--mx,50%) var(--my,50%),#000 55%,transparent 100%);
  mask-image:radial-gradient(circle clamp(90px,17vw,270px) at var(--mx,50%) var(--my,50%),#000 55%,transparent 100%)}
.hero-sub{font-size:clamp(1rem,2.4vw,1.4rem);font-weight:500;margin-top:6px}
.hero-cta{display:flex;gap:14px;margin-top:24px;flex-wrap:wrap;justify-content:center}
@keyframes rise{from{opacity:0;transform:translateY(40px) scale(.97)}}

.btn{display:inline-block;background:var(--green);color:#000;font:inherit;font-weight:700;text-transform:uppercase;letter-spacing:.1em;
  padding:14px 30px;border:2px solid var(--green);border-radius:2px;cursor:pointer;transition:.2s}
.btn:hover{background:transparent;color:var(--green);box-shadow:0 0 24px rgba(57,255,136,.4)}
.btn:disabled{opacity:.6;cursor:wait}
.btn.ghost{background:rgba(8,8,10,.5);color:var(--fg);border-color:var(--purple)}
.btn.ghost:hover{background:var(--purple);color:#fff;box-shadow:0 0 24px rgba(155,92,255,.5)}

.marquee{border-block:1px solid var(--line);background:#000;overflow:hidden;white-space:nowrap;position:relative;z-index:1}
.marquee-track{display:inline-flex;will-change:transform}
.marquee span{font-family:var(--display);font-size:1.3rem;letter-spacing:.2em;color:var(--purple);padding:10px 0}

/* Ortak bölüm */
.section{padding:clamp(70px,10vw,130px) clamp(16px,6vw,96px);position:relative}
.section-title{font-family:var(--display);font-weight:400;font-size:clamp(2.6rem,7vw,5.5rem);line-height:1.1;text-transform:uppercase;display:inline-block}
.section-title::after{content:"";display:block;height:5px;width:60%;margin-top:6px;background:linear-gradient(90deg,var(--green),var(--purple))}
.section-note{color:var(--muted);margin-top:16px;max-width:48ch}
.js .reveal{opacity:0;transform:translateY(30px);transition:opacity .7s,transform .7s}
.js .reveal.in{opacity:1;transform:none}

/* Yeni çıkanlar */
.releases{overflow:hidden;overflow:clip}
.backdrop{position:absolute;inset:0;z-index:-1;background:var(--bg)}
.backdrop i{position:absolute;inset:-15%;background-size:cover;background-position:center;filter:blur(70px) saturate(1.4);opacity:0;transition:opacity 1s}
.backdrop i.on{opacity:.3}
.backdrop::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,var(--bg),transparent 25%,transparent 75%,var(--bg))}
.section-head{margin-bottom:44px}
.player{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(28px,5vw,72px);align-items:start}
.deck{position:relative;width:100%;max-width:560px;aspect-ratio:1/.72;perspective:900px}
.sleeve{position:absolute;left:0;top:0;width:72%;aspect-ratio:1;z-index:2;display:block;box-shadow:0 18px 50px rgba(0,0,0,.6);background:#15151a;transition:transform .2s}
.sleeve-img{width:100%;height:100%;object-fit:cover}
.vinyl{position:absolute;top:2.8%;left:30%;width:68%;aspect-ratio:1;z-index:1;transition:left .32s cubic-bezier(.5,0,.2,1);touch-action:pan-y;cursor:grab}
.vinyl.grab{cursor:grabbing}
.deck.swap .vinyl{left:3%}
.disc{position:absolute;inset:0;border-radius:50%;display:grid;place-items:center;will-change:transform;
  background:repeating-radial-gradient(circle,#0b0b0d 0 2px,#17171b 2px 4px);box-shadow:0 12px 40px rgba(0,0,0,.65),inset 0 0 0 2px #000}
.label{width:38%;aspect-ratio:1;border-radius:50%;object-fit:cover;box-shadow:0 0 0 3px #000;pointer-events:none;user-select:none}
.sheen{position:absolute;inset:0;border-radius:50%;pointer-events:none;
  background:conic-gradient(from 40deg,transparent 0 12%,rgba(255,255,255,.13) 17%,transparent 23% 62%,rgba(255,255,255,.09) 67%,transparent 73%)}
.now{margin-top:20px;display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.now-state{font-size:.75rem;text-transform:uppercase;letter-spacing:.2em;color:var(--muted)}
.now.playing .now-state{color:var(--green)}
.now-title{font-family:var(--display);font-weight:400;font-size:1.8rem;letter-spacing:.03em}
.embed{margin-top:14px;max-width:560px;min-height:152px;border-radius:12px;background:rgba(255,255,255,.04)}
.embed iframe{display:block;width:100%;border:0;border-radius:12px}
.embed-wait{padding:62px 16px;text-align:center;color:var(--muted);font-size:.9rem}

.tracks{list-style:none;border-top:1px solid var(--line)}
.tracks li{border-bottom:1px solid var(--line);display:flex;align-items:stretch;position:relative}
.track{flex:1;min-width:0;display:grid;grid-template-columns:34px 52px 1fr 22px;align-items:center;gap:14px;padding:12px 8px;background:none;border:0;color:inherit;font:inherit;text-align:left;cursor:pointer;position:relative;overflow:hidden}
.track::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(57,255,136,.2),rgba(155,92,255,.2));transform:scaleX(0);transform-origin:left;transition:transform .3s}
.track:hover::before,.track[aria-current=true]::before{transform:none}
.t-num{font-family:var(--display);color:var(--muted);font-size:1.05rem}
.t-cover{width:52px;height:52px;object-fit:cover;background:#15151a}
.t-text{min-width:0}
.t-name{display:block;font-family:var(--display);font-size:clamp(1.25rem,2.4vw,1.7rem);letter-spacing:.03em;line-height:1.2;transition:transform .2s,color .2s}
.track:hover .t-name{transform:translateX(5px)}
.track[aria-current=true] .t-name{color:var(--green)}
.t-sub{display:block;font-size:.78rem;color:var(--muted)}
.t-sub.trend{display:inline-block;margin-top:3px;padding:0 7px;border:1px solid rgba(57,255,136,.55);border-radius:20px;font-size:.68rem;line-height:1.5;color:var(--green)}
.tt-hint{margin-top:16px;font-size:.88rem;color:var(--muted)}
.tt-hint a{color:var(--fg);text-decoration:underline;text-underline-offset:3px;transition:color .2s}
.tt-hint a:hover{color:var(--green)}
.eq{display:flex;align-items:flex-end;gap:2px;height:16px;visibility:hidden}
.eq i{width:4px;height:100%;background:var(--green);transform-origin:bottom;animation:eq .8s ease-in-out infinite alternate}
.eq i:nth-child(2){animation-delay:-.3s}.eq i:nth-child(3){animation-delay:-.55s}
.track.playing .eq{visibility:visible}
@keyframes eq{from{transform:scaleY(.2)}to{transform:scaleY(1)}}
.t-link{display:flex;align-items:center;padding:0 10px;font-size:.75rem;color:var(--muted);white-space:nowrap;transition:color .2s}
.t-link:hover{color:var(--green)}

/* Şimdi video çek */
.shoot{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:clamp(28px,6vw,88px);align-items:center;background:var(--bg2)}
.photo{position:relative;aspect-ratio:4/5;overflow:hidden;background:#000;border:1px solid var(--line)}
.photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 70%}
.photo-mono{filter:grayscale(1) contrast(1.1) brightness(.75)}
.photo-color{-webkit-mask-image:radial-gradient(ellipse 48% 38% at var(--mx,58%) var(--my,46%),#000 50%,transparent 100%);
  mask-image:radial-gradient(ellipse 48% 38% at var(--mx,58%) var(--my,46%),#000 50%,transparent 100%)}
.sounds{list-style:none;margin-top:28px;border-top:1px solid var(--line)}
.sounds li{border-bottom:1px solid var(--line)}
.sound{display:grid;grid-template-columns:60px minmax(0,1fr) auto;align-items:center;gap:16px;padding:14px 8px;transition:background .2s}
.sound:hover{background:linear-gradient(90deg,rgba(57,255,136,.14),rgba(155,92,255,.14))}
.sound-cover{width:60px;height:60px;object-fit:cover;background:#15151a}
.sound-head{display:flex;align-items:center;flex-wrap:wrap;gap:2px 10px}
.sound-name{font-family:var(--display);font-size:clamp(1.3rem,2.6vw,1.8rem);letter-spacing:.03em;line-height:1.2}
.sound-trend{display:inline-flex;align-items:center;gap:5px;padding:0 8px;border:1px solid rgba(57,255,136,.55);border-radius:20px;font-size:.68rem;font-weight:500;line-height:1.6;color:var(--green);white-space:nowrap}
.sound-trend::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--green);animation:pulse 1.6s ease-in-out infinite}
@keyframes pulse{50%{opacity:.25}}
.sound-count{display:block;font-size:.9rem;color:var(--muted)}
.sound-count b{color:var(--fg);font-weight:700}
.sound-go{font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--green);white-space:nowrap}

/* Bülten */
.newsletter{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(32px,6vw,88px);align-items:center;
  background:radial-gradient(50% 60% at 85% 50%,rgba(155,92,255,.2),transparent 75%),var(--bg)}
.news-form{display:grid;gap:18px;margin-top:32px;max-width:520px}
.field label{display:block;font-size:.8rem;text-transform:uppercase;letter-spacing:.14em;color:var(--muted);margin-bottom:6px}
.field input[type=text],.field input[type=email],.field input[type=tel]{width:100%;background:#000;border:1px solid #33333d;color:var(--fg);padding:14px;font:inherit;font-size:1rem;border-radius:2px;transition:border-color .2s,box-shadow .2s}
.field input:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(57,255,136,.18)}
.field input[aria-invalid=true]{border-color:var(--red)}
.err{color:var(--red);font-size:.85rem;margin-top:5px}
.err:empty{display:none}
.check label{display:flex;gap:10px;align-items:flex-start;text-transform:none;letter-spacing:0;font-size:.88rem;line-height:1.45;color:#c4c4cc;margin:0;cursor:pointer}
.check input{width:18px;height:18px;margin-top:2px;flex-shrink:0;accent-color:var(--green)}
.field input::placeholder{color:#5c5c66}
.legal{font-size:.85rem;color:var(--muted)}
.legal a{color:var(--fg);text-decoration:underline;text-underline-offset:3px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.news-form .btn{justify-self:start}
.status{font-size:.92rem;color:var(--muted)}
.status:empty{display:none}
.status.ok{color:var(--green)}
.status.bad{color:var(--red)}

.card-wrap{perspective:1000px;display:flex;justify-content:center}
.member{position:relative;width:min(100%,400px);aspect-ratio:1.5/1;padding:clamp(16px,4%,24px);display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;border-radius:14px;
  border:1px solid rgba(255,255,255,.14);background:linear-gradient(135deg,#1b1030,#0a0a0e 55%,#07301c);box-shadow:0 26px 70px rgba(0,0,0,.65);transition:transform .2s,box-shadow .5s}
.member-sheen{position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 60% 80% at var(--mx,30%) var(--my,20%),rgba(57,255,136,.28),rgba(155,92,255,.18) 45%,transparent 75%)}
.member-top{position:relative;display:flex;justify-content:space-between;align-items:center}
.member-logo{font-family:var(--display);font-size:1.5rem;letter-spacing:.08em}
.member-kind{font-size:.72rem;text-transform:uppercase;letter-spacing:.22em;color:var(--green)}
.member-disc{position:absolute;right:-18%;bottom:-32%;width:62%;aspect-ratio:1;border-radius:50%;opacity:.55;
  background:radial-gradient(circle,var(--purple) 0 15%,#000 15.5% 18%,transparent 18.5%),repeating-radial-gradient(circle,#0b0b0d 0 2px,#1d1d23 2px 4px)}
.member-info{position:relative;min-width:0;padding-right:36%}
.m-name{display:block;font-family:var(--display);font-weight:400;font-size:clamp(1.3rem,4.4vw,1.8rem);letter-spacing:.03em;line-height:1.15;overflow-wrap:anywhere}
.m-city{display:block;font-size:.78rem;letter-spacing:.18em;color:#c4c4cc;margin-top:3px;overflow-wrap:anywhere}
.member-stamp{position:absolute;top:44%;left:50%;transform:translate(-50%,-50%) rotate(-10deg) scale(1.6);opacity:0;padding:4px 16px;border:3px solid var(--green);color:var(--green);
  font-family:var(--display);font-size:1.7rem;letter-spacing:.1em;text-transform:uppercase;background:rgba(0,0,0,.45);transition:opacity .25s,transform .35s cubic-bezier(.3,1.6,.5,1)}
.member.joined{box-shadow:0 0 60px rgba(57,255,136,.35)}
.member.joined .member-stamp{opacity:1;transform:translate(-50%,-50%) rotate(-10deg)}

/* Konser şeridi */
.shows-strip{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;padding:20px clamp(16px,6vw,96px);border-top:1px solid var(--line);color:var(--muted);font-size:.92rem}
.shows-strip h2{font-size:.78rem;font-weight:500;text-transform:uppercase;letter-spacing:.2em}
.shows-strip a{color:var(--fg)}
.shows-strip a:hover{color:var(--green)}

/* Aydınlatma metni */
.doc-body{max-width:720px;margin:0 auto;padding:40px 16px 72px}
.doc-body h1{font-family:var(--display);font-weight:400;font-size:clamp(2rem,6vw,3.2rem);line-height:1.15;margin:24px 0 8px}
.doc-body h2{font-size:1.05rem;margin-top:26px;color:var(--green)}
.doc-body p{color:#cfcfd6;margin-top:6px}
.doc-body ul{margin:6px 0 0 20px;color:#cfcfd6}
.doc-body li{margin-top:4px}
.doc-body .doc-date{margin-top:32px;color:var(--muted);font-size:.85rem}

.footer .social{flex-wrap:wrap}
.footer{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding:24px clamp(16px,6vw,96px);padding-bottom:max(24px,env(safe-area-inset-bottom));color:var(--muted);font-size:.85rem;border-top:1px solid var(--line)}
.social{display:flex;gap:18px}
.social a:hover{color:var(--green)}

/* Mini oynatıcı */
.mini{position:fixed;right:16px;bottom:16px;z-index:45;display:flex;align-items:center;gap:10px;max-width:calc(100vw - 32px);padding:7px 16px 7px 7px;border-radius:40px;border:1px solid rgba(57,255,136,.45);
  background:rgba(8,8,10,.92);backdrop-filter:blur(10px);color:var(--fg);font:inherit;cursor:pointer;box-shadow:0 10px 30px rgba(0,0,0,.5)}
.mini[hidden]{display:none}
.mini-disc{width:36px;height:36px;border-radius:50%;overflow:hidden;flex-shrink:0;animation:spin 3s linear infinite}
.mini-disc img{width:100%;height:100%;object-fit:cover}
.mini-title{font-family:var(--display);letter-spacing:.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mini-action{font-size:.72rem;text-transform:uppercase;letter-spacing:.12em;color:var(--green)}
@keyframes spin{to{transform:rotate(360deg)}}

@media(max-width:860px){
  .player,.shoot,.newsletter{grid-template-columns:minmax(0,1fr)}
  .deck,.embed{max-width:none}
  .photo{max-width:440px}
  .newsletter{row-gap:20px}
  .news-copy{display:contents}
  .news-copy .section-title{order:1;justify-self:start}
  .news-copy .section-note{order:2;margin-top:0}
  .card-wrap{order:3;margin-block:8px}
  .news-form{order:4;margin-top:0;max-width:none}
  .member{width:min(100%,340px)}
}
@media(max-width:560px){
  .nav nav a{font-size:.7rem;letter-spacing:.08em}
  .logo{font-size:1.35rem}
  .t-base{-webkit-text-stroke-width:1.5px}
  .hero-cta{flex-wrap:nowrap;gap:10px;margin-top:18px}
  .hero-cta .btn{flex:1;padding:14px 8px;font-size:.85rem;white-space:nowrap}
  .socials a{width:48px;height:48px}
  .track{grid-template-columns:22px 44px 1fr 18px;gap:10px}
  .t-cover{width:44px;height:44px}
  .sound{grid-template-columns:48px minmax(0,1fr) auto;gap:12px}
  .sound-cover{width:48px;height:48px}
  .sound-verb{display:none}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .hero-title,.eq i,.mini-disc,.sound-trend::before{animation:none}
  .js .reveal{opacity:1;transform:none;transition:none}
  .t-fill{-webkit-mask-image:none;mask-image:none}
}