:root{
    --bg:#0e0e10;
    --bg-panel:#181818;
    --bg-panel-2:#202020;
    --line:#2a2a2a;
    --text:#ffffff;
    --muted:#b3b3b3;
    --pink:#ff3d81;
    --violet:#8a63ff;
    --amber:#ffb84d;
    --chrome-1:#f2f1f8;
    --chrome-2:#9a96b8;
    --radius:8px;
    --maxw:1180px;
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  @media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto;}
    *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important;}
  }
  body{
    margin:0;
    background:var(--bg);
    color:var(--text);
    font-family:'Inter',-apple-system,'Segoe UI',Roboto,sans-serif;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  a{color:inherit;}
  .wrap{max-width:var(--maxw); margin:0 auto; padding:0 24px;}
  .eyebrow{
    font-family:'Space Mono',monospace;
    text-transform:uppercase;
    letter-spacing:0.14em;
    font-size:11px;
    font-weight:700;
    color:var(--muted);
  }
  h1,h2,h3{font-family:'Inter',-apple-system,'Segoe UI',Roboto,sans-serif; font-weight:800; margin:0; letter-spacing:-0.02em;}

  /* ---------- background texture (cok hafif, dikkat dagitmayacak sekilde) ---------- */
  .noise-bg{
    position:fixed; inset:0; z-index:0; pointer-events:none;
    background:
      radial-gradient(circle at 15% 0%, rgba(138,99,255,0.08), transparent 40%),
      radial-gradient(circle at 85% 0%, rgba(255,61,129,0.06), transparent 45%);
  }
  .scanlines{ display:none; }

  /* ---------- nav ---------- */
  header{
    position:sticky; top:0; z-index:50;
    backdrop-filter:blur(14px);
    background:rgba(10,9,18,0.72);
    border-bottom:1px solid var(--line);
  }
  nav{
    max-width:var(--maxw); margin:0 auto; padding:14px 24px;
    display:flex; align-items:center; justify-content:space-between;
  }
  .logo{
    display:flex; align-items:center; gap:10px;
    font-weight:800; font-size:18px;
    text-decoration:none; color:var(--text);
  }
  .logo .bars{display:flex; gap:2px; align-items:flex-end; height:16px;}
  .logo .bars span{
    width:3px; background:linear-gradient(180deg,var(--pink),var(--violet));
    animation:eq 1.1s ease-in-out infinite;
    border-radius:2px;
  }
  .logo .bars span:nth-child(1){height:40%; animation-delay:0s;}
  .logo .bars span:nth-child(2){height:100%; animation-delay:0.2s;}
  .logo .bars span:nth-child(3){height:65%; animation-delay:0.4s;}
  .logo .bars span:nth-child(4){height:85%; animation-delay:0.1s;}
  @keyframes eq{0%,100%{transform:scaleY(0.4);} 50%{transform:scaleY(1);}}

  .navlinks{display:flex; gap:28px; font-size:14px; font-weight:500;}
  .navlinks a{text-decoration:none; color:var(--muted); transition:color .2s;}
  .navlinks a:hover{color:var(--text);}
  .navlinks a:focus-visible, .btn:focus-visible, .icon-link:focus-visible{outline:2px solid var(--amber); outline-offset:3px;}

  .nav-actions{display:flex; align-items:center; gap:14px;}
  .icon-link{
    width:34px; height:34px; border-radius:50%; display:flex; align-items:center; justify-content:center;
    border:1px solid var(--line); color:var(--muted); text-decoration:none; transition:.2s;
  }
  .icon-link:hover{color:var(--text); border-color:var(--violet); transform:translateY(-2px);}
  .burger{display:none; background:none; border:none; color:var(--text); font-size:22px; cursor:pointer;}

  /* ---------- hero ---------- */
  .hero{
    position:relative; z-index:2;
    padding:32px 24px 20px;
    max-width:var(--maxw); margin:0 auto;
    text-align:center;
  }
  .hero .eyebrow{display:block; margin-bottom:22px;}
  .hero h1{
    font-size:clamp(32px, 6vw, 64px);
    font-weight:900;
    line-height:0.98;
    color:var(--text);
  }
  .hero p.sub{
    max-width:560px; margin:26px auto 0; color:var(--muted); font-size:17px; line-height:1.6;
  }
  .hero-ctas{display:flex; gap:14px; justify-content:center; margin-top:18px; flex-wrap:wrap;}
  .btn{
    font-family:'Inter',sans-serif; font-weight:600; font-size:15px;
    padding:14px 26px; border-radius:999px; text-decoration:none;
    display:inline-flex; align-items:center; gap:8px;
    transition:transform .2s ease, box-shadow .2s ease;
    border:1px solid transparent; cursor:pointer;
  }
  .btn-primary{background:linear-gradient(120deg,var(--pink),var(--violet)); color:#fff; box-shadow:0 10px 30px -8px rgba(255,61,129,0.5);}
  .btn-primary:hover{transform:translateY(-2px); box-shadow:0 14px 34px -6px rgba(255,61,129,0.6);}
  .btn-ghost{border-color:var(--line); color:var(--text); background:rgba(255,255,255,0.02);}
  .btn-ghost:hover{border-color:var(--violet); transform:translateY(-2px);}

  /* ---------- oscillator divider ---------- */
  .oscillator{
    position:relative; z-index:2;
    height:32px; display:flex; align-items:center; justify-content:center; gap:3px;
    max-width:var(--maxw); margin:0 auto; padding:0 24px; overflow:hidden;
  }
  .oscillator span{
    width:4px; min-width:4px; border-radius:2px;
    background:linear-gradient(180deg, var(--amber), var(--pink), var(--violet));
    animation:wave 2.4s ease-in-out infinite;
    opacity:0.75;
  }

  /* ---------- sections ---------- */
  section{position:relative; z-index:2; padding:36px 0;}
  .section-head{margin-bottom:22px; text-align:center;}
  .section-head h2{font-size:clamp(30px,5vw,44px); margin-top:10px;}
  .section-head .eyebrow{justify-content:center; display:block;}

  .reveal{opacity:0; transform:translateY(24px); transition:opacity .7s ease, transform .7s ease;}
  .reveal.in{opacity:1; transform:translateY(0);}

  /* ---------- music grid ---------- */
  .music-grid{
    display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:22px;
  }
  .track-card{
    background:var(--bg-panel);
    border:1px solid var(--line);
    border-radius:var(--radius);
    overflow:hidden;
    transition:transform .25s ease, border-color .25s ease;
  }
  .track-card:hover{transform:translateY(-6px); border-color:var(--violet);}
  .cover{
    aspect-ratio:1/1; position:relative;
    display:flex; align-items:center; justify-content:center;
    font-family:'Space Mono',monospace; font-size:12px; color:rgba(255,255,255,0.55);
  }
  .cover .cover-bars{display:flex; gap:5px; align-items:flex-end; height:38%;}
  .cover .cover-bars span{width:6px; border-radius:3px; background:rgba(255,255,255,0.85); animation:eq 1.4s ease-in-out infinite;}
  .track-card:nth-child(6n+1) .cover{background:radial-gradient(circle at 30% 20%, #ff3d81, #3a1030 70%);}
  .track-card:nth-child(6n+2) .cover{background:radial-gradient(circle at 70% 30%, #8a63ff, #150b30 70%);}
  .track-card:nth-child(6n+3) .cover{background:radial-gradient(circle at 40% 70%, #ffb84d, #2a1b05 70%);}
  .track-card:nth-child(6n+4) .cover{background:radial-gradient(circle at 60% 20%, #3ddad0, #061f1e 70%);}
  .track-card:nth-child(6n+5) .cover{background:radial-gradient(circle at 30% 80%, #ff6a3d, #2a0d05 70%);}
  .track-card:nth-child(6n+6) .cover{background:radial-gradient(circle at 50% 50%, #6a7bff, #0d0f2a 70%);}
  .track-info{padding:16px 18px 18px;}
  .track-info .kind{font-family:'Space Mono',monospace; font-size:11px; color:var(--muted); text-transform:uppercase; letter-spacing:.08em;}
  .track-info h3{font-size:18px; margin:6px 0 12px; font-weight:600; font-family:'Inter',sans-serif;}
  .track-link{
    font-size:13px; font-weight:600; color:var(--amber); text-decoration:none;
    display:inline-flex; align-items:center; gap:6px;
  }
  .track-link:hover{text-decoration:underline;}

  .music-note{
    margin-top:34px; text-align:center; font-size:13px; color:var(--muted);
    font-family:'Space Mono',monospace;
  }
  .cover img{width:100%; height:100%; object-fit:cover; display:block;}
  .platform-links{display:flex; flex-wrap:wrap; gap:8px;}
  .platform-links a{
    font-size:12px; font-weight:600; text-decoration:none; color:var(--text);
    background:rgba(255,255,255,0.06); border:1px solid var(--line);
    padding:6px 12px; border-radius:999px; transition:.2s;
  }
  .platform-links a:hover{border-color:var(--amber); color:var(--amber);}
  .platform-links a.primary{
    background:linear-gradient(120deg,var(--pink),var(--violet)); color:#fff; border-color:transparent;
  }
  .music-empty{
    text-align:center; max-width:480px; margin:0 auto; padding:28px;
    border:1px dashed var(--line); border-radius:var(--radius); color:var(--muted); font-size:14px;
  }
  .music-empty p{margin:0 0 16px;}

  /* ---------- video section ---------- */
  .video-frame-wrap{
    border-radius:var(--radius); overflow:hidden; border:1px solid var(--line);
    background:#000; aspect-ratio:16/9; max-width:900px; margin:0 auto;
  }
  .video-frame-wrap iframe{width:100%; height:100%; border:0; display:block;}
  .video-cta{text-align:center; margin-top:28px;}

  /* ---------- about ---------- */
  .about{
    display:grid; grid-template-columns:1fr 1fr; gap:52px; align-items:center;
  }
  .about-visual{
    aspect-ratio:4/5; border-radius:var(--radius); border:1px solid var(--line);
    background:linear-gradient(160deg, var(--bg-panel-2), var(--bg-panel));
    position:relative; overflow:hidden;
    display:flex; align-items:center; justify-content:center;
  }
  .about-visual .ring{
    width:70%; aspect-ratio:1/1; border-radius:50%;
    border:1px solid var(--line);
    display:flex; align-items:center; justify-content:center;
  }
  .about-visual .ring::before{
    content:''; width:60%; aspect-ratio:1/1; border-radius:50%;
    background:conic-gradient(from 0deg, var(--pink), var(--violet), var(--amber), var(--pink));
    filter:blur(22px); opacity:0.55;
    animation:spin 12s linear infinite;
  }
  @keyframes spin{to{transform:rotate(360deg);}}
  .about p{color:var(--muted); line-height:1.75; font-size:16px; margin:0 0 16px;}
  .about h2{font-size:clamp(28px,4vw,38px); margin-bottom:22px;}

  /* ---------- contact / footer ---------- */
  .contact{text-align:center;}
  .contact-card{
    max-width:640px; margin:0 auto; padding:48px 32px;
    background:linear-gradient(140deg, rgba(255,61,129,0.10), rgba(138,99,255,0.10));
    border:1px solid var(--line); border-radius:24px;
  }
  .contact-card h2{font-size:clamp(26px,4vw,34px); margin-bottom:14px;}
  .contact-card p{color:var(--muted); margin-bottom:26px;}

  footer{
    position:relative; z-index:2;
    border-top:1px solid var(--line);
    padding:40px 24px;
  }
  .footer-inner{
    max-width:var(--maxw); margin:0 auto;
    display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:18px;
  }
  .footer-socials{display:flex; gap:12px;}
  .footer-copy{font-size:13px; color:var(--muted); font-family:'Space Mono',monospace;}

  @media (max-width:760px){
    .navlinks{
      position:fixed; top:64px; left:0; right:0; bottom:0;
      background:rgba(10,9,18,0.98);
      flex-direction:column; align-items:center; justify-content:center; gap:30px;
      font-size:20px;
      transform:translateY(-110%); transition:transform .3s ease;
    }
    .navlinks.open{transform:translateY(0);}
    .burger{display:block;}
    .about{grid-template-columns:1fr;}
    .about-visual{order:-1; max-width:280px; margin:0 auto;}
    /* Dar ekranlarda logo + dil secici + ikonlar sigmayip yaziyi kaydiriyordu - sadelestir */
    .nav-actions .icon-link{display:none;}
    .lang-select{padding:6px 24px 6px 10px; font-size:11px; max-width:92px; background-position:right 8px center;}
    .logo{font-size:15px; gap:6px;}
    nav{padding:12px 14px;}
  }
  @media (max-width:400px){
    .hero h1{font-size:44px;}
    .lang-select{max-width:78px;}
  }
  h1,h2,h3,.track-info h3,.song-hero-info h1{overflow-wrap:anywhere; word-break:break-word;}

/* ================= Dil secici ================= */
.lang-select{
  background:#0f0d1a; color:var(--text); border:1px solid var(--line); border-radius:999px;
  padding:6px 30px 6px 14px; font-size:12px; font-family:'Inter',sans-serif; cursor:pointer;
  appearance:none; -webkit-appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6'><path d='M0 0l5 6 5-6z' fill='%239491a8'/></svg>");
  background-repeat:no-repeat; background-position:right 12px center;
}
[dir="rtl"] .lang-select{ background-position:left 12px center; padding:6px 14px 6px 30px; }

/* ================= Sarki/Album sayfalari ================= */
.page-header{ padding:130px 24px 40px; max-width:var(--maxw); margin:0 auto; }
.back-link{ font-family:'Space Mono',monospace; font-size:13px; color:var(--muted); text-decoration:none; }
.back-link:hover{ color:var(--amber); }

.song-hero{
  display:grid; grid-template-columns:280px 1fr; gap:40px; align-items:center;
  max-width:var(--maxw); margin:0 auto; padding:20px 24px 60px;
}
.song-hero-cover{
  aspect-ratio:1/1; border-radius:var(--radius); overflow:hidden; border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center;
  background:radial-gradient(circle at 30% 20%, var(--pink), #1a0d1e 70%);
}
.song-hero-cover img{ width:100%; height:100%; object-fit:cover; }
.song-hero-info .kind{ font-family:'Space Mono',monospace; color:var(--amber); font-size:12px; text-transform:uppercase; letter-spacing:.08em; }
.song-hero-info h1{ font-size:clamp(32px,6vw,56px); margin:10px 0 8px; }
.song-hero-info .artist-line{ color:var(--muted); font-size:16px; margin-bottom:22px; }
.song-hero-info .artist-line a{ color:var(--text); text-decoration:underline; }

.story-block{
  max-width:820px; margin:0 auto; padding:0 24px 60px;
}
.story-block h2{ font-size:24px; margin-bottom:16px; }
.story-block p{ color:var(--muted); line-height:1.8; font-size:16px; margin:0 0 16px; }

.share-row{ display:flex; gap:10px; flex-wrap:wrap; margin-top:20px; }
.share-row a{
  width:38px; height:38px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  border:1px solid var(--line); color:var(--muted); text-decoration:none; font-size:15px; transition:.2s;
}
.share-row a:hover{ color:var(--text); border-color:var(--violet); transform:translateY(-2px); }

.album-header{
  text-align:center; max-width:640px; margin:0 auto; padding:0 24px 50px;
}
.album-header .cover-strip{
  display:flex; justify-content:center; gap:-10px; margin-bottom:20px;
}
.related-grid{ margin-top:14px; }

@media (max-width:700px){
  .song-hero{ grid-template-columns:1fr; text-align:center; }
  .song-hero-cover{ max-width:260px; margin:0 auto; }
  .share-row{ justify-content:center; }
}

/* ================= RTL destegi ================= */
[dir="rtl"] body{ direction:rtl; }
[dir="rtl"] .hero-ctas, [dir="rtl"] .btn-row, [dir="rtl"] .navlinks,
[dir="rtl"] .footer-inner, [dir="rtl"] .nav-actions{ direction:rtl; }
[dir="rtl"] .song-hero{ direction:rtl; }
[dir="rtl"] .back-link{ direction:rtl; }

/* ================= Platform kabuğu: sidebar + alt sekmeler + mini oynatıcı ================= */
.app-shell{ display:flex; min-height:100vh; }
.sidebar{
  width:230px; flex-shrink:0; position:sticky; top:0; height:100vh; overflow-y:auto;
  padding:22px 16px; border-right:1px solid var(--line); background:rgba(19,17,32,0.5);
  display:flex; flex-direction:column; gap:22px; z-index:40;
}
.sidebar .logo{ padding:0 8px; }
.sidebar-nav{ display:flex; flex-direction:column; gap:2px; }
.sidebar-nav a{
  display:flex; align-items:center; gap:12px; padding:10px 12px; border-radius:10px;
  color:var(--muted); text-decoration:none; font-size:14px; font-weight:500; transition:.15s;
}
.sidebar-nav a:hover, .sidebar-nav a.active{ color:var(--text); background:rgba(255,255,255,0.05); }
.sidebar-nav a .ic{ flex-shrink:0; }
.sidebar-lang{ margin-top:auto; }
.sidebar .icon-link{ margin-top:4px; }

.main-col{ flex:1; min-width:0; }

/* Mobil ustte sadelestirilmis bar zaten mevcut header kurallariyla calisiyor. */
@media (max-width:960px){
  .sidebar{ display:none; }
}

/* Alt sekme cubugu (mobil - Spotify/YouTube uygulamalari gibi) */
.bottom-nav{
  display:none;
  position:fixed; left:0; right:0; bottom:0; z-index:60;
  background:rgba(10,9,18,0.96); backdrop-filter:blur(14px);
  border-top:1px solid var(--line);
  padding:8px 6px calc(8px + env(safe-area-inset-bottom));
  justify-content:space-around;
}
.bottom-nav a{
  display:flex; flex-direction:column; align-items:center; gap:3px;
  color:var(--muted); text-decoration:none; font-size:10px; flex:1; padding:4px 0;
}
.bottom-nav a .ic{ display:block; margin:0 auto; }
.bottom-nav a.active{ color:var(--pink); }
@media (max-width:960px){
  .bottom-nav{ display:flex; }
  body{ padding-bottom:64px; }
  body.has-player{ padding-bottom:130px; }
}

/* Mini oynatici cubugu - karta basinca acilir, gercek Spotify gomulu oynatici icerir */
.mini-player{
  position:fixed; left:0; right:0; bottom:0; z-index:70;
  background:#0d0c17; border-top:1px solid var(--line);
  box-shadow:0 -10px 30px rgba(0,0,0,0.4);
  transform:translateY(110%); transition:transform .3s ease;
}
.mini-player.open{ transform:translateY(0); }
@media (max-width:960px){ .mini-player{ bottom:56px; } }
.mini-player-inner{ display:flex; align-items:center; gap:10px; padding:8px 12px; max-width:var(--maxw); margin:0 auto; }
.mini-player-frame{ flex:1; min-width:0; }
.mini-player-frame iframe{ width:100%; height:80px; border:0; border-radius:10px; display:block; }
.mini-player-close{
  flex-shrink:0; width:30px; height:30px; border-radius:50%; border:1px solid var(--line);
  background:none; color:var(--muted); cursor:pointer; font-size:14px;
}
.mini-player-close:hover{ color:var(--text); border-color:var(--violet); }

/* ================= Play butonu overlay (kart uzerinde) ================= */
.cover{ position:relative; }
.cover > a{ position:absolute; inset:0; display:block; }
.play-overlay{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  background:rgba(10,9,18,0.0); opacity:0; transition:opacity .2s ease; cursor:pointer; border:none; padding:0;
}
.track-card:hover .play-overlay, .track-card:focus-within .play-overlay{
  opacity:1; background:rgba(10,9,18,0.35);
}
.play-overlay .play-btn{
  width:46px; height:46px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(120deg,var(--pink),var(--violet)); color:#fff; font-size:16px;
  box-shadow:0 8px 20px rgba(0,0,0,0.4); transform:translateY(6px); transition:transform .2s ease;
}
.track-card:hover .play-btn{ transform:translateY(0); }
@media (max-width:960px){
  /* Dokunmatikte hover olmadigi icin play butonu hep gorunur */
  .play-overlay{ opacity:1; background:rgba(10,9,18,0.15); }
  .play-overlay .play-btn{ width:38px; height:38px; font-size:13px; transform:none; }
}

/* ================= Yatay kaydirmali raflar (carousel) ================= */
.shelf{ margin-bottom:26px; }
.shelf-head{ display:flex; justify-content:space-between; align-items:baseline; margin-bottom:14px; }
.shelf-head h3{ font-size:18px; }
.shelf-head a{ font-size:12px; color:var(--muted); text-decoration:none; font-family:'Space Mono',monospace; }
.shelf-head a:hover{ color:var(--amber); }
.shelf-scroll{
  display:flex; gap:16px; overflow-x:auto; scroll-snap-type:x proximity; padding-bottom:6px;
  -webkit-overflow-scrolling:touch; scrollbar-width:thin;
}
.shelf-scroll .track-card{ min-width:160px; max-width:160px; scroll-snap-align:start; }
.shelf-scroll::-webkit-scrollbar{ height:6px; }
.shelf-scroll::-webkit-scrollbar-thumb{ background:var(--line); border-radius:3px; }

/* Sidebar aktifken ust bari sadece mobilde goster (desktop'ta sidebar navigasyonu karsiliyor) */
@media (min-width:961px){ header{ display:none; } }

/* ================= Hizli Erisim izgarasi (Spotify/YouTube Music ana ekrani gibi) ================= */
.quick-grid{
  display:grid; grid-template-columns:repeat(2, 1fr); gap:10px; margin-bottom:8px;
}
@media (min-width:640px){
  .quick-grid{ grid-template-columns:repeat(3, 1fr); }
}
.quick-card{
  position:relative; display:flex; align-items:center; gap:0;
  border-radius:6px; overflow:hidden; text-decoration:none;
  background:var(--bg-panel); border:1px solid var(--line); height:56px;
}
.quick-cover{ position:static; width:56px; height:56px; flex-shrink:0; }
.quick-cover img{ width:100%; height:100%; object-fit:cover; display:block; }
.quick-card::after{ content:none; }
.quick-name{
  position:static; z-index:auto;
  color:#fff; font-size:13px; font-weight:700; line-height:1.3;
  padding:0 10px; overflow:hidden; text-overflow:ellipsis;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
  flex:1; min-width:0;
}
.quick-play{
  position:static; flex-shrink:0; margin-right:8px; opacity:0; transition:opacity .15s ease;
}
.quick-card:hover .quick-play, .quick-card:focus-within .quick-play{ opacity:1; }
.quick-play .play-btn{ width:32px; height:32px; font-size:12px; }
@media (max-width:960px){
  /* Dokunmatikte hover olmadigi icin buton hep gorunur ama kucuk */
  .quick-play{ opacity:1; }
}

/* ================= Videolar sayfasi ================= */
.video-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(280px,1fr)); gap:24px; }
.video-card{ background:var(--bg-panel); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; }
.video-card .track-info{ padding:12px 14px; }

/* ================= Hero satiri: sag-sola kaydirmali video vitrini ================= */
.hero-row{
  padding:28px 24px 20px;
}
.hero-video-showcase{ max-width:640px; margin:0 auto; }
.showcase-track{
  display:flex; overflow-x:auto; scroll-snap-type:x mandatory; gap:12px;
  -webkit-overflow-scrolling:touch; scrollbar-width:none; border-radius:var(--radius);
}
.showcase-track::-webkit-scrollbar{ display:none; }
.showcase-slide{
  position:relative; flex:0 0 100%; scroll-snap-align:center;
  aspect-ratio:16/9; border-radius:var(--radius); overflow:hidden;
  background:#000; border:1px solid var(--line);
}
.showcase-slide img{ width:100%; height:100%; object-fit:cover; display:block; }
.showcase-frame{ position:absolute; inset:0; }
.showcase-frame iframe{ width:100%; height:100%; border:0; display:block; }
.showcase-dots{ display:flex; justify-content:center; gap:6px; margin-top:10px; }
.showcase-dot{ width:6px; height:6px; border-radius:50%; background:var(--line); transition:.2s; }
.showcase-dot.active{ background:var(--pink); width:16px; border-radius:3px; }
@media (max-width:760px){
  .hero-row{ padding:16px 16px 14px; }
}


/* ================= Video vitrini: sesi ac butonu ================= */
.showcase-unmute{
  position:absolute; right:10px; bottom:10px; z-index:3;
  width:36px; height:36px; border-radius:50%; border:none; cursor:pointer;
  background:rgba(0,0,0,0.6); color:#fff; font-size:15px;
  display:flex; align-items:center; justify-content:center;
  backdrop-filter:blur(4px);
}
.showcase-unmute:hover{ background:rgba(0,0,0,0.8); }