/* NS2 (kullanici 31.10): satilik nick kartlari (Masaustu 4nick-satis.html; Won / EP keseli iki kart, gorseller public/img/ns, Cinzel yerel). */
@font-face { font-family: 'Cinzel'; font-style: normal; font-display: swap; font-weight: 400 900; src: url('../fonts/site/cinzel-latin-ext-wght-normal.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Cinzel'; font-style: normal; font-display: swap; font-weight: 400 900; src: url('../fonts/site/cinzel-latin-wght-normal.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
  /* kart listesi */
  .ns-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px 18px;justify-items:center}
  @media (max-width:1200px){.ns-grid{grid-template-columns:repeat(3,1fr)}}
  @media (max-width:900px){.ns-grid{grid-template-columns:repeat(2,1fr)}}
  @media (max-width:560px){.ns-grid{grid-template-columns:1fr}}
  .ns-card.ns-dar .ns-bitis{font-size:3.3cqw}

  .ns-card{
    position:relative;width:100%;max-width:640px;aspect-ratio:1228/662;
    container-type:inline-size;
    background:url('../img/ns/kart-won.webp') center/100% 100% no-repeat;
    filter:drop-shadow(0 10px 26px rgba(0,0,0,.6));
    transition:transform .3s ease, filter .3s ease;
  }
  .ns-card:hover{transform:translateY(-5px);filter:drop-shadow(0 0 22px rgba(154,40,54,.75)) drop-shadow(0 14px 30px rgba(0,0,0,.7))}

  /* ---------- NICK: ışıklı, dikkat çekici ---------- */
  .ns-nick-wrap{position:absolute;left:50.8%;top:35.3%;transform:translate(-50%,-50%);white-space:nowrap}
  .ns-nick{
    display:block;font-family:'Cinzel',serif;font-weight:800;
    font-size:8.6cqw;line-height:1.05;letter-spacing:.03em;
    /* 1. katman: üzerinden geçen keskin ışık bandı, 2. katman: canlı altın */
    background:
      linear-gradient(105deg, transparent 0 42%, rgba(255,248,230,.95) 48%, rgba(255,248,230,.95) 50%, transparent 56% 100%),
      linear-gradient(180deg, #fff3d6 0%, #f0d9a0 30%, #d6b46e 58%, #b8904a 78%, #e2c387 90%, #a07a3c 100%);
    background-size:300% 100%, 100% 100%;
    background-repeat:no-repeat;
    -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
    filter:
      drop-shadow(0 0 0.7px #1a0a0c) drop-shadow(0 0 0.7px #1a0a0c)
      drop-shadow(0 2px 1px rgba(0,0,0,.95))
      drop-shadow(0 0 6px rgba(214,180,110,.5));
    animation:ns-sweep 3.4s ease-in-out infinite, ns-glow 2.6s ease-in-out infinite;
  }
  @keyframes ns-sweep{0%{background-position:130% 0,0 0}60%,100%{background-position:-30% 0,0 0}}
  @keyframes ns-glow{
    0%,100%{filter:drop-shadow(0 0 .6px #1a0a0c) drop-shadow(0 0 .6px #1a0a0c) drop-shadow(0 2px 1px rgba(0,0,0,.95)) drop-shadow(0 0 5px rgba(214,180,110,.4))}
    50%{filter:drop-shadow(0 0 .6px #1a0a0c) drop-shadow(0 0 .6px #1a0a0c) drop-shadow(0 2px 1px rgba(0,0,0,.95)) drop-shadow(0 0 11px rgba(230,195,120,.8))}
  }

  /* nick çevresinde çakan yıldızlar */
  .ns-star{position:absolute;width:3.2cqw;aspect-ratio:1;transform:translate(-50%,-50%) scale(0);pointer-events:none;
    background:
      radial-gradient(circle closest-side,#fff8e8 0 12%,rgba(230,200,140,.9) 20%,transparent 45%),
      radial-gradient(ellipse 50% 5% at 50% 50%,rgba(213,214,214,.95),transparent),
      radial-gradient(ellipse 5% 50% at 50% 50%,rgba(213,214,214,.95),transparent);
    animation:ns-star 2.6s ease-in-out infinite}
  @keyframes ns-star{0%,100%{transform:translate(-50%,-50%) scale(0) rotate(0);opacity:0}
    40%{transform:translate(-50%,-50%) scale(1) rotate(45deg);opacity:1}
    70%{transform:translate(-50%,-50%) scale(.2) rotate(90deg);opacity:0}}

  /* bitiş tarihi */
  .ns-bitis{position:absolute;left:50.6%;top:55.3%;transform:translate(-50%,-50%);white-space:nowrap;
    font-family:'Cinzel',serif;font-weight:700;font-size:2.55cqw;letter-spacing:0;color:var(--text2);
    text-shadow:0 1px 3px #000}

  /* fiyat: kesenin soluna sağa yaslı */
  .ns-fiyat{position:absolute;right:37.8%;top:74.6%;transform:translateY(-50%);white-space:nowrap;
    font-family:'Cinzel',serif;font-weight:800;font-size:5.4cqw;line-height:1;
    background:linear-gradient(180deg,#fff3dc 10%,#efe5dc 45%,#cbb280);
    -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
    filter:drop-shadow(0 2px 2px rgba(0,0,0,.85))}

  /* fiyat kutusu = satın al butonu */
  .ns-buy{position:absolute;left:27.6%;width:45.4%;top:66.2%;height:16.4%;border-radius:4px;transition:box-shadow .25s, background .25s}
  .ns-buy::after{content:"";position:absolute;inset:0;border-radius:inherit;
    background:linear-gradient(100deg,transparent 30%,rgba(255,220,200,.22) 50%,transparent 70%) -200% 0/200% 100% no-repeat;
    animation:ns-shine 4s ease-in-out infinite;mix-blend-mode:screen}
  @keyframes ns-shine{0%,55%{background-position:-200% 0}100%{background-position:200% 0}}
  .ns-buy:hover{background:rgba(255,200,180,.06);box-shadow:0 0 20px rgba(154,40,54,.85),inset 0 0 14px rgba(203,178,128,.3)}

  /* süresi dolan kart */
  .ns-card.ns-bitti{filter:grayscale(.6) brightness(.75)}
  .ns-card.ns-bitti .ns-nick,.ns-card.ns-bitti .ns-star{animation:none}
  .ns-card.ns-bitti .ns-ns-star{display:none}
  .ns-card.ns-bitti .ns-buy{pointer-events:none}
  .ns-card.ns-bitti::after{content:"SÜRESİ DOLDU";position:absolute;left:50.4%;top:74.6%;transform:translate(-50%,-50%);
    font-size:4.4cqw;font-weight:700;letter-spacing:.08em;color:var(--gold-light);white-space:nowrap;
    background:var(--bordo);padding:1.5cqw 5cqw;border:1px solid var(--bronze);border-radius:4px}

  .ns-card.ep{background-image:url('../img/ns/kart-ep.webp')}
  /* yildiz yerleri (CSP: satir ici style yok) */
  .ns-star.y1{left:26%;top:24%;animation-delay:0.40s}
  .ns-star.y2{left:76%;top:26%;animation-delay:1.10s}
  .ns-star.y3{left:29%;top:46%;animation-delay:1.80s}
  .ns-star.y4{left:73%;top:46%;animation-delay:2.40s}
  .ns-star.y5{left:52%;top:18%;animation-delay:0.75s}
  .ns-star.y6{left:22%;top:36%;animation-delay:2.10s}
  .ns-star.y7{left:80%;top:37%;animation-delay:1.50s}
  .ns-grid .ns-card{--panel:#0e0e13;--bordo:#42151a;--bronze:#8a6c38;--gold:#b69f73;--gold-light:#cbb280;--text:#efe5dc;--text2:#c4b99b}
  @media (prefers-reduced-motion:reduce){.ns-card *{animation:none!important}}
