@font-face{font-family:Diskopia;src:url(/assets/diskopia.ttf) format("truetype");font-display:swap}
:root{
  --mor:#B967FF; --pembe:#FF8CFB; --mint:#05FFA1; --kirmizi:#D40000;
  --ink:#0B0B0B; --paper:#FFFFFF; --lila:#F4EBFF;
  --bubble:Diskopia,"Archivo Black",sans-serif;
  --wide:"Archivo Black",sans-serif;
  --sans:"Space Grotesk",system-ui,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,Menlo,monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--lila);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
body:before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(circle at 12% 8%,rgba(255,140,251,.45),transparent 40%),radial-gradient(circle at 92% 30%,rgba(5,255,161,.28),transparent 38%),radial-gradient(circle at 40% 100%,rgba(185,103,255,.35),transparent 45%)}

.wrap{position:relative;z-index:2;max-width:1100px;margin:0 auto;padding:22px 20px 70px}
.top{display:flex;justify-content:space-between;align-items:center;font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase}
.top nav a{margin-left:8px;padding:8px 14px;border:2px solid var(--ink);border-radius:99px;background:var(--paper)}
.top nav a.on{background:var(--ink);color:var(--mint)}
.live{display:inline-flex;align-items:center;gap:8px;font-weight:500}
.live:before{content:"";width:9px;height:9px;border-radius:50%;background:var(--kirmizi);animation:blink 1.1s infinite}
@keyframes blink{50%{opacity:.2}}

/* hero */
.hero{position:relative;margin:46px 0 30px;text-align:center}
.hero .duo{width:100%;max-width:980px;display:block;margin:0 auto}
.hero .bub{font-family:var(--bubble);font-size:clamp(20px,3.4vw,34px);margin-top:18px;color:var(--mor);letter-spacing:.02em}
.hero p{margin:14px auto 0;max-width:560px;font-size:18px;line-height:1.5;text-wrap:pretty}
.tags{margin-top:18px;display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.tags b{font-family:var(--wide);font-weight:400;font-size:13px;text-transform:uppercase;padding:8px 14px;border:2px solid var(--ink);border-radius:99px;background:var(--paper)}
.tags b:nth-child(3n+1){background:var(--mint)}.tags b:nth-child(3n+2){background:var(--pembe)}.tags b:nth-child(3n){background:var(--mor);color:#fff}

/* sticker'lar */
.stk{position:absolute;z-index:3;pointer-events:none;filter:drop-shadow(3px 4px 0 rgba(11,11,11,.18));animation:sal 4s ease-in-out infinite alternate}
@keyframes sal{to{transform:translateY(-8px) rotate(var(--r2,6deg))}}

/* çerçeveli video (kit post çerçevesi gibi) */
.reel{position:relative;aspect-ratio:9/16;width:min(100%,400px);margin:0 auto;border:10px solid var(--mor);border-radius:26px;overflow:hidden;background:#1a1020;box-shadow:10px 10px 0 var(--ink)}
.reel video{width:100%;height:100%;object-fit:cover;display:block}
.reel .ph{position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-family:var(--mono);font-size:12px}
.reel .lbl{position:absolute;left:0;right:0;bottom:0;z-index:3;background:var(--paper);font-family:var(--wide);font-size:13px;text-align:center;padding:6px 4px;text-transform:uppercase}
.reel.pembe{border-color:var(--pembe)}.reel.mint{border-color:var(--mint)}
.stage{position:relative;padding:10px 0}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:34px}
.grid .reel{width:100%;border-width:7px;border-radius:20px;box-shadow:6px 6px 0 var(--ink)}
.snd{position:absolute;right:14px;top:14px;z-index:4;font-family:var(--mono);font-size:11px;letter-spacing:.1em;padding:7px 11px;border-radius:99px;background:var(--mint);border:2px solid var(--ink);cursor:pointer}

.cta{display:flex;flex-wrap:wrap;gap:12px;margin:42px 0 0;justify-content:center}
.btn{font-family:var(--wide);font-size:15px;text-transform:uppercase;padding:16px 26px;border-radius:99px;border:3px solid var(--ink);background:var(--paper);box-shadow:4px 4px 0 var(--ink);transition:.15s}
.btn:hover{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--ink)}
.btn.main{background:var(--mint)}
.btn.p{background:var(--pembe)}

/* agency kit */
.big{font-family:var(--bubble);font-weight:400;font-size:clamp(46px,8.6vw,104px);line-height:.95;color:var(--ink)}
.big span{color:var(--mor);-webkit-text-stroke:0}
h2{font-family:var(--bubble);font-weight:400;font-size:clamp(34px,5.5vw,54px);margin:70px 0 18px;display:flex;align-items:center;gap:14px}
h2 i{font-style:normal;font-family:var(--mono);font-size:13px;background:var(--ink);color:var(--mint);padding:6px 10px;border-radius:99px}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.card{border:3px solid var(--ink);border-radius:18px;padding:18px;background:var(--paper);box-shadow:6px 6px 0 var(--mor)}
.card:nth-child(3n+2){box-shadow:6px 6px 0 var(--pembe)}.card:nth-child(3n){box-shadow:6px 6px 0 var(--mint)}
.card .t{font-family:var(--wide);font-size:17px;text-transform:uppercase}
.card .m{font-family:var(--mono);font-size:11px;letter-spacing:.08em;margin-top:6px;opacity:.6;text-transform:uppercase}
.card .dl,.copy{display:inline-block;margin-top:14px;font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;background:var(--ink);color:var(--mint);padding:8px 12px;border-radius:99px;border:0;cursor:pointer}
.photos{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.photos a{position:relative;aspect-ratio:4/5;border-radius:16px;overflow:hidden;border:6px solid var(--mor);background:#222}
.photos a:nth-child(3n+2){border-color:var(--pembe)}.photos a:nth-child(3n){border-color:var(--mint)}
.photos img{width:100%;height:100%;object-fit:cover;display:block;transition:.3s}
.photos a:hover img{transform:scale(1.05)}
.photos a:after{content:"İNDİR ↓";position:absolute;left:8px;bottom:8px;font-family:var(--mono);font-size:10px;font-weight:700;background:var(--paper);padding:5px 8px;border-radius:99px}
.bio{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.bio .card p{margin-top:10px;line-height:1.55;text-wrap:pretty}
.venues{display:flex;flex-wrap:wrap;gap:10px}
.venues b{font-family:var(--wide);font-weight:400;font-size:22px;text-transform:uppercase;padding:10px 18px;border:3px solid var(--ink);border-radius:99px;background:var(--paper)}
.venues b:nth-child(odd){background:var(--pembe)}
.zip{margin-top:50px;text-align:center}
footer{margin-top:70px;padding-top:18px;border-top:3px solid var(--ink);display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase}

@media (max-width:720px){
  .grid{grid-template-columns:1fr 1fr}.grid .reel:nth-child(3){display:none}
  .photos{grid-template-columns:1fr 1fr}.bio{grid-template-columns:1fr}
  .stk{transform:scale(.6)}
}
@media (max-width:720px){
  .stage .stk{display:none}
  .hero .stk{width:64px!important;top:-46px!important}
  .hero .stk:first-child{left:0!important}.hero .stk:nth-child(2){right:0!important}
  .top nav a{padding:7px 10px;font-size:11px}
  .big{font-size:46px}
}
.top nav a.dil{background:var(--pembe)}
html[lang=en] .photos a:after{content:"DOWNLOAD ↓"}
.dk{position:relative;display:inline-block}
.dk:after{content:"";position:absolute;left:50%;background:currentColor}
.dk-dot:after{top:-.02em;width:.19em;height:.19em;border-radius:50%;transform:translateX(-50%)}
.dk-uml:after{top:-.02em;width:.17em;height:.17em;border-radius:50%;box-shadow:.27em 0 0 currentColor;transform:translateX(calc(-50% - .135em))}
.dk-brv:after{top:-.08em;width:.36em;height:.16em;background:none;border:.08em solid currentColor;border-top:0;border-radius:0 0 .3em .3em;transform:translateX(-50%)}
.dk-ced:after{bottom:.02em;width:.14em;height:.2em;border-radius:0 0 .08em .08em;transform:translateX(-50%)}
.photos.extra a{aspect-ratio:9/16}
.photos video{width:100%;height:100%;object-fit:cover;display:block}
@media(min-width:761px){.photos.extra{grid-template-columns:repeat(5,1fr)}}
.photos a.nodl:after{display:none}.photos a.nodl{cursor:default}
.top nav{display:flex;flex-wrap:nowrap;gap:6px}
.top nav a{margin-left:0;white-space:nowrap}
@media (max-width:520px){
  .top{flex-direction:column;align-items:center;gap:12px}
  .top nav a{padding:7px 11px;font-size:11px;letter-spacing:.08em}
  .hero{margin-top:40px}
  .hero .stk{width:42px!important;top:-34px!important}
}
.reel.yatay{aspect-ratio:16/9;width:min(100%,900px)}
.reel .sec{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:rgba(26,16,32,.55)}
.reel .sec[hidden]{display:none}
.reel .sec .q{font-family:var(--wide);color:#fff;font-size:20px;text-transform:uppercase;text-align:center;padding:0 16px}
.reel .sec button{font-family:var(--wide);font-size:18px;text-transform:uppercase;padding:12px 26px;min-width:190px;border:3px solid var(--ink);border-radius:99px;background:var(--mint);cursor:pointer;box-shadow:4px 4px 0 var(--ink)}
.reel .sec button+button{background:var(--pembe)}
.cev{position:absolute;left:14px;top:14px;z-index:4;font-family:var(--mono);font-size:11px;letter-spacing:.1em;padding:7px 11px;border-radius:99px;background:var(--pembe);border:2px solid var(--ink);cursor:pointer}
.snd[hidden],.cev[hidden]{display:none}
.ik{display:inline-block;width:.6em;height:1em;border:.14em solid currentColor;border-radius:.15em;margin-right:.5em;vertical-align:-.12em;box-sizing:border-box}
.ik.y{width:1.1em;height:.65em;vertical-align:.02em}
