/* Yazı tipleri: Archivo + IBM Plex Mono (Google Fonts dosyaları, sunucudan yerel olarak) */
/* vietnamese */
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 400 900;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url(fonts/archivo-400-900-vietnamese.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 400 900;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url(fonts/archivo-400-900-latin-ext.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;
}
/* latin */
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 400 900;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url(fonts/archivo-400-900-latin.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;
}
/* cyrillic-ext */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/ibmplexmono-400-cyrillic-ext.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/ibmplexmono-400-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/ibmplexmono-400-vietnamese.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/ibmplexmono-400-latin-ext.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;
}
/* latin */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/ibmplexmono-400-latin.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;
}
/* cyrillic-ext */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/ibmplexmono-500-cyrillic-ext.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/ibmplexmono-500-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/ibmplexmono-500-vietnamese.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/ibmplexmono-500-latin-ext.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;
}
/* latin */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/ibmplexmono-500-latin.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;
}
/* cyrillic-ext */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/ibmplexmono-600-cyrillic-ext.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/ibmplexmono-600-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/ibmplexmono-600-vietnamese.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/ibmplexmono-600-latin-ext.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;
}
/* latin */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/ibmplexmono-600-latin.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;
}


  :root{
    --bg:#eef1f7;
    --surface:#ffffff;
    --surface-2:#f4f6fb;
    --surface-3:#e7ebf3;
    --ink:#101a2e;
    --ink-soft:#5b6579;
    --ink-faint:#656e82;
    --line:#dfe3ec;
    --line-soft:#e9ecf3;
    --navy:#0d4da4;
    --navy-ink:#0a3d84;
    --navy-soft:#e4edf9;
    --orange:#f3752b;
    --orange-ink:#ae4e16;
    --orange-soft:#fde7d8;
    --shadow-sm:0 1px 2px rgba(16,26,46,.06);
    --shadow-md:0 10px 30px -12px rgba(13,77,164,.25);
    --shadow-lg:0 24px 60px -20px rgba(13,77,164,.35);
    --radius-card:18px;
    --radius-chip:999px;
    --radius-btn:12px;
    --header-h:88px;
    color-scheme: light;
  }

  :root[data-theme="dark"]{
    --bg:#0a1220;
    --surface:#111b2d;
    --surface-2:#0e1728;
    --surface-3:#1a2740;
    --ink:#eef2f9;
    --ink-soft:#a2adc2;
    --ink-faint:#717d94;
    --line:#233150;
    --line-soft:#1b2842;
    --navy:#5b93e0;
    --navy-ink:#7fb0f0;
    --navy-soft:#152743;
    --orange:#ff8c4a;
    --orange-ink:#ffa268;
    --orange-soft:#3a2415;
    --shadow-sm:0 1px 2px rgba(0,0,0,.4);
    --shadow-md:0 10px 30px -12px rgba(0,0,0,.55);
    --shadow-lg:0 24px 60px -20px rgba(0,0,0,.65);
  }

  *{box-sizing:border-box;}
  html{-webkit-text-size-adjust:100%;}
  body{
    margin:0;
    background:var(--bg);
    color:var(--ink);
    font-family:'Archivo',system-ui,-apple-system,'Segoe UI',sans-serif;
    padding-inline:20px;
    -webkit-font-smoothing:antialiased;
  }
  @media (min-width:900px){ body{ padding-inline:40px; } }

  a{color:inherit;text-decoration:none;}
  h1,h2,h3{font-family:'Archivo',system-ui,sans-serif;text-wrap:balance;margin:0;}
  .mono{font-family:'IBM Plex Mono',ui-monospace,monospace;}
  img{max-width:100%;display:block;}
  button{font:inherit;color:inherit;}

  .wrap{max-width:1240px;margin-inline:auto;}

  /* ---------- motion / scroll reveal ---------- */
  @media (prefers-reduced-motion: no-preference){
    html{ scroll-behavior:smooth; }
  }
  [data-reveal]{
    opacity:0;
    transform:perspective(1200px) translateY(30px) translateZ(-70px) rotateX(9deg);
    transform-origin:50% 100%;
    transition:opacity .8s cubic-bezier(.2,.7,.3,1), transform .8s cubic-bezier(.2,.7,.3,1);
    transition-delay:var(--reveal-delay, 0ms);
    will-change:transform, opacity;
  }
  [data-reveal].in-view{ opacity:1; transform:perspective(1200px) translateY(0) translateZ(0) rotateX(0deg); }
  .grid .card[data-reveal]{
    transform:perspective(1100px) translateY(26px) translateZ(-50px) rotateX(12deg) rotateY(-7deg);
  }
  .grid .card[data-reveal]:nth-child(even){
    transform:perspective(1100px) translateY(26px) translateZ(-50px) rotateX(12deg) rotateY(7deg);
  }
  .grid .card[data-reveal].in-view{ transform:perspective(1100px) translateY(0) translateZ(0) rotateX(0) rotateY(0); }
  @media (prefers-reduced-motion: reduce){
    [data-reveal]{ opacity:1 !important; transform:none !important; transition:none !important; }
  }

  /* ---------- header brand logo animation ---------- */
  .brand-anim-holder{
    position:relative; flex:0 0 auto;
    width:140px; height:50px; overflow:hidden; /* %40 küçültüldü (233x83 -> 140x50) */
  }
  .brand-anim-stage{
    position:relative; width:235px; height:84px;
    transform-origin:top left;
    transform:scale(calc(50px / 84px));
  }
  .brand-anim-base{ position:absolute; left:0; top:0; width:235px; height:84px; display:block; }
  .brand-bar-mask{ position:absolute; background:var(--bg); }
  .brand-bar-seg{ position:absolute; }

  /* ---------- header ---------- */
  .site-header{
    position:sticky; top:0; z-index:50;
    background:var(--bg);
    border-bottom:1px solid var(--line-soft);
    margin-inline:-20px; padding-inline:20px;
    transition:box-shadow .25s ease;
  }
  .site-header.scrolled{ box-shadow:0 8px 28px -18px rgba(13,77,164,.4); }
  @media (min-width:900px){ .site-header{ margin-inline:-40px; padding-inline:40px; } }
  .header-row{
    max-width:1240px;margin-inline:auto;
    display:flex; align-items:center; gap:20px;
    padding-block:14px;
  }
  .logo-link{flex:0 0 auto; display:flex; align-items:center;}
  .main-nav{
    display:none; align-items:center; gap:28px; margin-inline:auto;
    font-weight:600; font-size:.92rem;
  }
  @media (min-width:980px){ .main-nav{display:flex;} }
  .main-nav a{color:var(--ink-soft); position:relative; padding-block:4px;}
  .main-nav a:hover{color:var(--navy);}
  .main-nav a.current{color:var(--navy);}
  .main-nav a.current::after{
    content:""; position:absolute; left:0; right:0; bottom:-2px; height:2px;
    background:var(--orange); border-radius:2px;
  }
  .header-actions{display:flex; align-items:center; gap:10px; margin-left:auto;}
  .social-icons{display:none; align-items:center; gap:6px;}
  @media (min-width:980px){ .social-icons{display:flex;} }
  .social-icons a{
    width:34px;height:34px;border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    color:var(--ink-soft); border:1px solid var(--line);
    transition:.15s ease;
  }
  .social-icons a:hover{color:var(--navy); border-color:var(--navy); background:var(--navy-soft);}
  .fav-btn{
    display:flex; align-items:center; gap:6px;
    border:1px solid var(--line); background:var(--surface);
    padding:8px 14px; border-radius:var(--radius-chip);
    font-weight:700; font-size:.85rem; cursor:pointer;
    box-shadow:var(--shadow-sm); white-space:nowrap;
    transition:.15s ease;
  }
  .fav-btn:hover{ color:var(--navy); border-color:var(--navy); background:var(--navy-soft); }
  .fav-label{ font-family:'Archivo',sans-serif; }
  .fav-count{
    color:#fff; background:var(--orange); font-family:'IBM Plex Mono',monospace;
    font-size:.72rem; line-height:1; min-width:18px; height:18px;
    border-radius:999px; display:inline-flex; align-items:center; justify-content:center;
    padding:0 5px;
  }
  .theme-toggle{
    display:flex; align-items:center; justify-content:center; flex:0 0 auto;
    width:38px;height:38px; border-radius:50%; border:1px solid var(--line);
    background:var(--surface); cursor:pointer; color:var(--ink-soft); transition:.15s ease;
  }
  .theme-toggle:hover{ color:var(--navy); border-color:var(--navy); background:var(--navy-soft); }
  .theme-toggle svg{ width:17px; height:17px; }
  .lang-switch{
    display:flex; align-items:center; justify-content:center; flex:0 0 auto;
    width:38px;height:38px; border-radius:50%; border:1px solid var(--line);
    background:var(--surface); transition:.15s ease; overflow:hidden;
  }
  .lang-switch:hover{ border-color:var(--navy); background:var(--navy-soft); }
  .lang-switch svg{ width:20px; height:14px; border-radius:2px; display:block; }
  .ai-shortcut{
    display:flex; align-items:center; justify-content:center; flex:0 0 auto;
    width:38px;height:38px; border-radius:50%; border:1px solid var(--line);
    background:var(--surface); cursor:pointer; color:var(--ink-soft); transition:.15s ease;
  }
  .ai-shortcut:hover{ color:var(--navy); border-color:var(--navy); background:var(--navy-soft); }
  .ai-shortcut svg{ width:17px; height:17px; }
  .nav-toggle{
    display:flex; align-items:center; justify-content:center;
    width:38px;height:38px; border-radius:10px; border:1px solid var(--line);
    background:var(--surface); cursor:pointer;
  }
  @media (min-width:980px){ .nav-toggle{display:none;} }
  @media (max-width:420px){
    .header-row{ gap:12px; }
    .brand-anim-holder{ width:119px; height:43px; }
    .brand-anim-stage{ transform:scale(calc(43px / 84px)); }
    .header-actions{ gap:4px; }
    .fav-btn{ padding:8px 10px; }
    .fav-btn .fav-count{ display:none; }
    .theme-toggle, .ai-shortcut, .nav-toggle, .lang-switch{ width:32px; height:32px; }
    .lang-switch svg{ width:18px; height:13px; }
  }
  .mobile-nav{
    display:none; flex-direction:column; gap:2px; padding-block:10px 16px;
    border-top:1px solid var(--line-soft);
  }
  .mobile-nav.open{display:flex;}
  .mobile-nav a{padding:10px 4px; font-weight:600; color:var(--ink-soft); border-radius:8px;}
  .mobile-nav a:hover{background:var(--surface-2); color:var(--navy);}
  .mobile-nav .social-icons{
    display:flex; gap:10px; margin-top:10px; padding-top:14px;
    border-top:1px solid var(--line-soft);
  }
  .mobile-nav .social-icons a{
    width:34px;height:34px;border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    color:var(--ink-soft); border:1px solid var(--line);
    transition:.15s ease;
  }
  .mobile-nav .social-icons a:hover{ color:var(--navy); border-color:var(--navy); background:var(--navy-soft); }

  /* Yerli/Yabancı seçimi isteğe bağlı bir filtredir; sayfanın devamı her zaman görünür (ajans revizesi, Kasım 2026) */

  /* ---------- Dil filtresi yalnızca Yabancı Sesler seçiminde görünsün ---------- */
  #dilFilterGroup{ display:none; }

  /* ---------- hero banner ---------- */
  .hero-banner{
    position:relative; isolation:isolate; overflow:clip;
    margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw);
    padding-inline:20px; margin-bottom:40px;
  }
  @media (min-width:900px){ .hero-banner{ padding-inline:40px; margin-bottom:56px; } }
  .hero-banner .hero{ max-width:1240px; margin-inline:auto; }
  .hero-banner::before{
    content:""; position:absolute; inset:-4% -4%; z-index:-2;
    background-image:url('img/hero-banner.webp'); background-size:cover; background-position:center 68%;
    transform:scale(1.06) translateY(var(--hero-parallax, 0px));
    will-change:transform;
  }
  .hero-banner::after{
    content:""; position:absolute; inset:0; z-index:-1;
    background:linear-gradient(115deg,
      color-mix(in srgb, var(--navy-ink) 96%, black 10%) 0%,
      color-mix(in srgb, var(--navy) 90%, transparent) 48%,
      color-mix(in srgb, var(--orange) 62%, transparent) 100%);
    opacity:.94;
  }
  .hero-banner .hero h1{ color:#fff; text-shadow:0 2px 18px rgba(0,0,0,.3); }
  .hero-banner .hero h1 em{ color:#ffd9b8; }
  .hero-banner .hero p.lead{ color:rgba(255,255,255,.92); text-shadow:0 1px 12px rgba(0,0,0,.4); }
  .hero-banner .search-card{
    background:rgba(14,23,40,.55); border-color:rgba(255,255,255,.28);
    backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
    box-shadow:0 20px 50px -20px rgba(0,0,0,.55);
  }
  .hero-banner .search-card input[type="text"]{ color:#fff; }
  .hero-banner .search-card input::placeholder{ color:rgba(255,255,255,.62); }

  /* ---------- origin select (yerli / yabanci) ---------- */
  .origin-select{
    position:relative; isolation:isolate;
    margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw);
    display:grid; grid-template-columns:1fr; grid-template-rows:1fr 1fr; margin-bottom:0;
    height:calc(100vh - var(--header-h));
    height:calc(100dvh - var(--header-h));
    min-height:480px;
  }
  @media (min-width:768px){ .origin-select{ grid-template-columns:1fr 1fr; grid-template-rows:1fr; } }
  .origin-half{
    position:relative; overflow:hidden; isolation:isolate;
    display:flex; align-items:flex-end; justify-content:center;
    height:100%; min-height:220px; padding:28px 20px;
    border:none; margin:0; width:100%; font:inherit; cursor:pointer;
    -webkit-tap-highlight-color:transparent;
  }
  @media (min-width:768px){ .origin-half{ padding:32px 24px; } }
  .origin-half::before{
    content:""; position:absolute; inset:0; z-index:-2;
    background-size:cover; background-position:center;
    transform:scale(1.04); transition:transform .5s ease;
  }
  .origin-half:hover::before, .origin-half:focus-visible::before{ transform:scale(1.1); }
  .origin-half::after{ content:""; position:absolute; inset:0; z-index:-1; transition:opacity .2s ease; }
  .origin-yerli::before{ background-image:url('img/origin-yerli.webp'); }
  .origin-yerli::after{ background:color-mix(in srgb, var(--navy) 78%, transparent); }
  .origin-yabanci{ align-items:flex-start; }
  @media (min-width:768px){ .origin-yabanci{ align-items:flex-end; } }
  .origin-yabanci::before{ background-image:url('img/origin-yabanci.webp'); }
  /* mobilde aynı görselin ekrana uygun kırpılmış, daha hafif sürümü */
  @media (max-width:767px){ .origin-yerli::before{ background-image:url('img/origin-yerli-m.webp'); } .origin-yabanci::before{ background-image:url('img/origin-yabanci-m.webp'); } }
  .origin-yabanci::after{ background:color-mix(in srgb, var(--orange) 70%, transparent); }
  .origin-half.active::after{ opacity:.62; }
  .origin-pill{
    display:inline-flex; align-items:center; justify-content:center;
    padding:15px 38px; border:2px solid #fff; border-radius:999px;
    color:#fff; font-weight:700; font-size:1.02rem; letter-spacing:.01em;
    background:rgba(10,20,40,.2); backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px);
    transition:.15s ease; text-shadow:0 1px 8px rgba(0,0,0,.25);
  }
  .origin-half:hover .origin-pill, .origin-half:focus-visible .origin-pill{ background:#fff; color:var(--navy-ink); }
  .origin-yabanci:hover .origin-pill, .origin-yabanci:focus-visible .origin-pill{ color:var(--orange-ink); }
  .origin-half.active .origin-pill{ background:#fff; color:var(--navy-ink); }
  .origin-yabanci.active .origin-pill{ color:var(--orange-ink); }
  .origin-half:focus-visible{ outline:3px solid #fff; outline-offset:-8px; }


  /* ---------- hero ---------- */
  .hero{
    padding-block:56px 40px;
    display:grid; grid-template-columns:1fr; gap:36px;
    align-items:center;
    perspective:1400px;
  }
  @media (min-width:980px){ .hero{gap:56px; padding-block:72px 48px;} }
  .hero h1{
    font-size:clamp(2.1rem, 4.4vw, 3.4rem);
    line-height:1.06; font-weight:700; margin-block:18px 16px; letter-spacing:-.01em;
  }
  .hero h1 em{
    font-style:normal; color:var(--navy);
  }
  .hero p.lead{
    font-size:1.08rem; color:var(--ink-soft); max-width:52ch; line-height:1.6; margin-bottom:26px;
  }

  .search-card{
    background:var(--surface); border:1px solid var(--line); border-radius:20px;
    padding:8px; box-shadow:var(--shadow-md); display:flex; gap:8px; flex-wrap:wrap;
    max-width:640px;
  }
  .search-card input[type="text"]{
    flex:1 1 200px; border:none; background:transparent; padding:12px 14px;
    font-size:.98rem; color:var(--ink); font-family:inherit; min-width:0;
  }
  .search-card input::placeholder{color:var(--ink-faint);}
  .search-card input:focus{outline:none;}
  .search-submit{
    background:var(--navy); color:#fff; border:none; border-radius:14px;
    padding:12px 20px; font-weight:700; font-size:.92rem; cursor:pointer;
    display:flex; align-items:center; gap:8px; transition:.15s ease;
  }
  .search-submit:hover{background:var(--navy-ink);}
  .search-submit svg{width:16px;height:16px;}

  /* ---------- ai tool: ayrı sayfa gibi açılan modal ---------- */
  .ai-modal-overlay{
    position:fixed; inset:0; z-index:2000;
    background:color-mix(in srgb, var(--ink) 55%, transparent);
    display:flex; align-items:flex-start; justify-content:center;
    padding:56px 20px; overflow-y:auto;
    opacity:0; visibility:hidden;
    transition:opacity .25s ease, visibility 0s linear .25s;
  }
  .ai-modal-overlay.open{
    opacity:1; visibility:visible;
    transition:opacity .25s ease, visibility 0s linear 0s;
  }
  .ai-modal-panel{
    position:relative; background:var(--bg); border-radius:20px;
    max-width:980px; width:100%; margin-block:auto; padding:32px 28px;
    box-shadow:var(--shadow-lg);
    transform:translateY(14px); transition:transform .25s ease;
  }
  @media (min-width:640px){ .ai-modal-panel{ padding:40px; } }
  .ai-modal-overlay.open .ai-modal-panel{ transform:translateY(0); }
  .ai-modal-close{
    position:absolute; top:16px; right:16px; z-index:1;
    width:38px; height:38px; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    border:1px solid var(--line); background:var(--surface); cursor:pointer;
    color:var(--ink-soft); transition:.15s ease;
  }
  .ai-modal-close svg{ width:18px; height:18px; }
  .ai-modal-close:hover{ color:var(--navy); border-color:var(--navy); background:var(--navy-soft); }
  body.ai-modal-open{ overflow:hidden; }

  /* ---------- favoriler paneli (sağdan açılan) ---------- */
  .fav-drawer-overlay{
    position:fixed; inset:0; z-index:2100;
    background:color-mix(in srgb, var(--ink) 45%, transparent);
    opacity:0; visibility:hidden; transition:opacity .25s ease, visibility 0s linear .25s;
  }
  .fav-drawer-overlay.open{ opacity:1; visibility:visible; transition:opacity .25s ease, visibility 0s linear 0s; }
  body.fav-drawer-open{ overflow:hidden; }
  .fav-drawer{
    position:fixed; top:0; right:0; z-index:2101;
    width:min(360px, 100vw); height:100%;
    background:var(--surface); box-shadow:-18px 0 50px -20px rgba(13,26,46,.4);
    display:flex; flex-direction:column;
    transform:translateX(100%); transition:transform .3s cubic-bezier(.2,.8,.2,1);
  }
  .fav-drawer-overlay.open .fav-drawer{ transform:translateX(0); }
  .fav-drawer-head{
    display:flex; align-items:center; justify-content:space-between;
    background:var(--navy); color:#fff; padding:16px 18px;
    font-weight:800; letter-spacing:.06em; font-size:.88rem; text-transform:uppercase;
    flex:0 0 auto;
  }
  .fav-drawer-close{
    width:30px; height:30px; border-radius:50%; border:none; cursor:pointer;
    background:rgba(255,255,255,.14); color:#fff;
    display:flex; align-items:center; justify-content:center; transition:.15s ease;
  }
  .fav-drawer-close:hover{ background:rgba(255,255,255,.28); }
  .fav-drawer-close svg{ width:16px; height:16px; }
  .fav-list{ flex:1 1 auto; overflow-y:auto; padding:10px 18px; }
  .fav-empty{
    padding:36px 6px; text-align:center; color:var(--ink-faint); font-size:.92rem;
  }
  .fav-item{ padding:14px 0; border-bottom:1px solid var(--line-soft); }
  .fav-item:last-child{ border-bottom:none; }
  .fav-item-name{
    font-weight:700; font-size:.9rem; color:var(--ink); display:block; margin-bottom:8px;
  }
  .fav-item-name b{ color:var(--navy); font-weight:800; margin-right:4px; }
  .fav-item-actions{ display:flex; align-items:center; gap:8px; }
  .fav-item-actions button, .fav-item-actions a{
    width:28px; height:28px; border-radius:8px; border:1px solid var(--line);
    background:var(--surface-2); color:var(--ink-soft); cursor:pointer;
    display:flex; align-items:center; justify-content:center; transition:.15s ease;
  }
  .fav-item-actions button svg, .fav-item-actions a svg{ width:13px; height:13px; }
  .fav-item-actions .fav-item-play:hover{ background:var(--navy); border-color:var(--navy); color:#fff; }
  .fav-item-actions .fav-item-goto:hover{ background:var(--navy-soft); border-color:var(--navy); color:var(--navy); }
  .fav-item-actions .fav-item-remove:hover{ background:#fbe3e3; border-color:#d94848; color:#b32b2b; }
  .fav-share{ flex:0 0 auto; padding:14px 18px; border-top:1px solid var(--line-soft); }
  .fav-share-label{ font-size:.76rem; font-weight:700; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.04em; display:block; margin-bottom:8px; }
  .fav-share-row{ display:flex; align-items:center; gap:8px; }
  .fav-share-row input{
    flex:1; min-width:0; font-family:'IBM Plex Mono',monospace; font-size:.78rem;
    padding:9px 10px; border-radius:10px; border:1px solid var(--line); background:var(--surface-2); color:var(--ink-soft);
  }
  .fav-share-row button{
    flex:0 0 auto; width:34px; height:34px; border-radius:10px; border:1px solid var(--line);
    background:var(--surface-2); color:var(--ink-soft); cursor:pointer;
    display:flex; align-items:center; justify-content:center; transition:.15s ease;
  }
  .fav-share-row button svg{ width:15px; height:15px; }
  .fav-share-row button:hover{ background:var(--navy-soft); border-color:var(--navy); color:var(--navy); }
  .fav-share-row button.copied{ background:var(--navy); border-color:var(--navy); color:#fff; }
  .fav-drawer-actions{
    flex:0 0 auto; display:flex; align-items:center; justify-content:center; gap:10px;
    padding:14px 18px 18px; border-top:1px solid var(--line-soft); background:var(--surface-2);
  }
  .fav-drawer-actions button{
    width:42px; height:42px; border-radius:50%; border:1px solid var(--line);
    background:var(--surface); color:var(--ink-soft); cursor:pointer;
    display:flex; align-items:center; justify-content:center; transition:.15s ease;
  }
  .fav-drawer-actions button svg{ width:17px; height:17px; }
  .fav-drawer-actions button:hover{ background:var(--navy); border-color:var(--navy); color:#fff; }
  .fav-drawer-actions .fav-act-close:hover{ background:#b32b2b; border-color:#b32b2b; color:#fff; }

  /* ---------- sanatçı detay modalı ---------- */
  .card{ cursor:pointer; }
  .card .player, .card a{ cursor:auto; }
  .artist-modal-overlay{
    position:fixed; inset:0; z-index:2050;
    background:color-mix(in srgb, var(--ink) 55%, transparent);
    display:flex; align-items:flex-start; justify-content:center;
    padding:56px 20px; overflow-y:auto;
    opacity:0; visibility:hidden; transition:opacity .25s ease, visibility 0s linear .25s;
  }
  .artist-modal-overlay.open{ opacity:1; visibility:visible; transition:opacity .25s ease, visibility 0s linear 0s; }
  body.artist-modal-open{ overflow:hidden; }
  .artist-modal-panel{
    position:relative; background:var(--bg); border-radius:20px;
    max-width:760px; width:100%; margin-block:auto;
    box-shadow:var(--shadow-lg); overflow:hidden;
    transform:translateY(14px); transition:transform .25s ease;
  }
  .artist-modal-overlay.open .artist-modal-panel{ transform:translateY(0); }
  .artist-modal-close{
    position:absolute; top:16px; right:16px; z-index:2;
    width:38px; height:38px; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    border:1px solid rgba(255,255,255,.5); background:rgba(255,255,255,.14); color:#fff; cursor:pointer;
    backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px); transition:.15s ease;
  }
  .artist-modal-close:hover{ background:rgba(255,255,255,.3); }
  .artist-modal-close svg{ width:17px; height:17px; }
  .artist-modal-top{ display:grid; grid-template-columns:1fr; }
  @media (min-width:640px){ .artist-modal-top{ grid-template-columns:220px 1fr; align-items:stretch; } }
  .artist-modal-photo{
    position:relative; aspect-ratio:1080/1350; min-height:160px;
    display:flex; align-items:center; justify-content:center;
    background:linear-gradient(150deg, var(--navy), var(--navy-ink));
    color:#fff; font-family:'Archivo',sans-serif; font-weight:800; font-size:2.8rem;
  }
  @media (min-width:640px){ .artist-modal-photo{ aspect-ratio:auto; min-height:275px; } } /* 220px sütunda en az 4:5 dikey oran */
  .artist-modal-photo.female{ background:linear-gradient(150deg, var(--orange), var(--orange-ink)); }
  .artist-modal-photo img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 20%; }
  .artist-modal-info{ padding:26px 26px 18px; }
  @media (min-width:640px){ .artist-modal-info{ padding:28px 32px 20px; } }
  .artist-modal-info h2{ margin:0 0 4px; font-size:clamp(1.25rem,2.4vw,1.6rem); font-family:'Archivo',sans-serif; }
  .artist-modal-info h1{ margin:0 0 4px; font-size:clamp(1.25rem,2.4vw,1.6rem); font-family:'Archivo',sans-serif; }
  .artist-modal-info h1.artist-name-female{ color:var(--orange-ink); }
  .artist-modal-info h1.artist-name-male{ color:var(--navy); }
  .artist-modal-meta{ color:var(--ink-soft); font-weight:600; font-size:.9rem; margin-bottom:14px; }
  .artist-modal-tags{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:18px; }
  .artist-modal-bio{ color:var(--ink-soft); font-size:.92rem; line-height:1.6; margin:0 0 18px; max-width:52ch; }
  .artist-modal-actions{ display:flex; align-items:center; flex-wrap:wrap; gap:10px; }
  .artist-fav-btn{
    display:inline-flex; align-items:center; gap:7px;
    border:1px solid var(--line); background:var(--surface); padding:9px 16px; border-radius:var(--radius-chip);
    font-weight:700; font-size:.85rem; cursor:pointer; color:var(--ink-soft); transition:.15s ease;
  }
  .artist-fav-btn svg{ width:15px; height:15px; }
  .artist-fav-btn:hover{ border-color:var(--orange-ink); color:var(--orange-ink); }
  .artist-fav-btn.active{ background:var(--orange-soft); border-color:var(--orange-ink); color:var(--orange-ink); }
  .artist-fav-btn.active svg{ fill:var(--orange-ink); }
  .artist-modal-sitelink{
    display:inline-flex; align-items:center; gap:6px;
    font-weight:700; font-size:.85rem; color:var(--navy); padding:9px 4px;
  }
  .artist-modal-sitelink:hover{ text-decoration:underline; }
  .artist-modal-demos{ padding:6px 26px 26px; border-top:1px solid var(--line-soft); }
  @media (min-width:640px){ .artist-modal-demos{ padding:6px 32px 32px; } }
  .artist-modal-demos :is(h2,h3){ font-size:.8rem; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-faint); margin:18px 0 12px; }
  .artist-demo-list{ display:flex; flex-direction:column; gap:10px; max-height:320px; overflow-y:auto; }
  .card.modal-demo-row{ background:none; border:none; box-shadow:none; padding:0; border-radius:0; display:block; }
  .card.modal-demo-row:hover{ transform:none; box-shadow:none; border-color:transparent; }
  .modal-demo-row .player{ width:100%; }

  /* ---------- ai tool ---------- */
  .ai-tool{ margin-bottom:0; }
  .ai-tool-head{ max-width:70ch; margin-bottom:22px; }
  .ai-tool-card{
    background:var(--surface); border:1px solid var(--line); border-radius:26px;
    box-shadow:var(--shadow-md); overflow:clip;
    display:grid; grid-template-columns:1fr;
  }
  @media (min-width:940px){ .ai-tool-card{ grid-template-columns:1.15fr 1fr; } }
  .ai-tool-form{ padding:28px; display:flex; flex-direction:column; gap:22px; }
  .ai-step h3{
    display:flex; align-items:center; gap:9px;
    font-family:'Archivo',sans-serif; font-size:.85rem; font-weight:600; color:var(--ink);
    margin-bottom:12px;
  }
  .ai-step h3 .num{
    width:22px; height:22px; border-radius:50%; background:var(--navy); color:#fff;
    font-family:'IBM Plex Mono',monospace; font-size:.72rem; display:flex; align-items:center; justify-content:center;
    flex:0 0 auto;
  }
  .artist-pick-row{ display:flex; flex-wrap:wrap; gap:8px; }
  .artist-pick{
    display:flex; align-items:center; gap:8px;
    border:1.5px solid var(--line); background:var(--surface-2); border-radius:var(--radius-chip);
    padding:6px 12px 6px 6px; cursor:pointer; transition:.15s ease;
  }
  .artist-pick .mini-avatar{
    width:26px; height:26px; border-radius:50%; flex:0 0 auto;
    display:flex; align-items:center; justify-content:center; color:#fff;
    font-family:'Archivo',sans-serif; font-weight:700; font-size:.62rem;
    background:var(--navy);
  }
  .artist-pick .mini-avatar.female{ background:var(--orange); }
  .artist-pick span.name{ font-size:.82rem; font-weight:700; color:var(--ink); }
  .artist-pick span.desc{ font-size:.7rem; color:var(--ink-faint); display:block; }
  .artist-pick:hover{ border-color:var(--navy); }
  .artist-pick.active{ border-color:var(--navy); background:var(--navy-soft); }

  .artist-search-wrap{ position:relative; }
  .artist-search-input-row{
    display:flex; align-items:center; gap:8px;
    border:1.5px solid var(--line); background:var(--surface-2); border-radius:12px;
    padding:10px 14px; transition:.15s ease;
  }
  .artist-search-input-row:focus-within{ border-color:var(--navy); }
  .artist-search-icon{ width:18px; height:18px; color:var(--ink-faint); flex:0 0 auto; }
  .artist-search-input{
    flex:1; min-width:0; border:none; background:transparent; outline:none;
    font-family:inherit; font-size:.92rem; color:var(--ink);
  }
  .artist-search-input::placeholder{ color:var(--ink-faint); }
  .artist-search-clear{
    flex:0 0 auto; width:22px; height:22px; border-radius:50%; border:none;
    background:var(--surface-3); color:var(--ink-faint); cursor:pointer;
    display:flex; align-items:center; justify-content:center;
  }
  .artist-search-clear svg{ width:12px; height:12px; }
  .artist-search-clear:hover{ color:var(--ink); }
  .artist-suggestions{
    position:absolute; left:0; right:0; top:calc(100% + 6px); z-index:5;
    background:var(--surface); border:1.5px solid var(--line); border-radius:14px;
    box-shadow:var(--shadow-md); padding:6px; max-height:280px; overflow-y:auto;
    display:none;
  }
  .artist-suggestions.show{ display:block; }
  .artist-suggestions .artist-pick{
    width:100%; border:none; background:transparent; border-radius:10px;
    padding:8px 10px; text-align:left;
  }
  .artist-suggestions .artist-pick:hover,
  .artist-suggestions .artist-pick.highlighted{ background:var(--navy-soft); }
  .artist-suggestions .artist-no-match{ padding:14px 10px; font-size:.82rem; color:var(--ink-faint); text-align:center; }
  .tone-pick-row{ display:flex; flex-wrap:wrap; gap:8px; }
  .tone-pick{
    border:1.5px solid var(--line); background:var(--surface-2); color:var(--ink-soft);
    border-radius:var(--radius-chip); padding:8px 14px; font-size:.82rem; font-weight:700;
    cursor:pointer; transition:.15s ease;
  }
  .tone-pick:hover{ border-color:var(--orange); color:var(--orange-ink); }
  .tone-pick.active{ border-color:var(--orange); background:var(--orange-soft); color:var(--orange-ink); }
  .ai-textarea{
    width:100%; resize:vertical; min-height:92px; border-radius:14px; border:1.5px solid var(--line);
    background:var(--surface-2); padding:12px 14px; font-family:inherit; font-size:.92rem; color:var(--ink);
  }
  .ai-textarea:focus{ outline:2px solid var(--navy); outline-offset:1px; }
  .ai-textfoot{ display:flex; align-items:center; justify-content:space-between; margin-top:8px; flex-wrap:wrap; gap:8px; }
  .char-count{ font-family:'IBM Plex Mono',monospace; font-size:.75rem; color:var(--ink-faint); }
  .quick-chips{ display:flex; gap:6px; flex-wrap:wrap; }
  .quick-chip{
    font-size:.72rem; font-weight:600; color:var(--ink-soft); background:transparent;
    border:1px dashed var(--line); border-radius:var(--radius-chip); padding:5px 10px; cursor:pointer;
  }
  .quick-chip:hover{ border-color:var(--navy); color:var(--navy); }
  .ai-generate-btn{
    display:flex; align-items:center; justify-content:center; gap:8px;
    background:linear-gradient(120deg, var(--navy), var(--orange)); color:#fff; border:none;
    border-radius:14px; padding:15px 20px; font-weight:700; font-size:.95rem; cursor:pointer;
    box-shadow:var(--shadow-md); transition:.15s ease; text-shadow:0 1px 3px rgba(0,0,0,.28);
  }
  .ai-generate-btn:hover{ filter:brightness(1.06); transform:translateY(-1px); }
  .ai-generate-btn:disabled{ opacity:.5; cursor:not-allowed; transform:none; }

  .ai-tool-result{
    background:var(--surface-2); border-left:1px solid var(--line); padding:28px;
    display:flex; flex-direction:column; gap:18px; justify-content:center;
  }
  @media (max-width:939px){ .ai-tool-result{ border-left:none; border-top:1px solid var(--line); } }
  .ai-result-empty{ text-align:center; color:var(--ink-faint); padding:20px 6px; }
  .ai-result-empty svg{ width:38px; height:38px; margin-bottom:10px; opacity:.5; }
  .ai-result-empty b{ display:block; color:var(--ink); font-family:'Archivo',sans-serif; font-size:.95rem; margin-bottom:6px; }
  .ai-result-empty p{ font-size:.85rem; line-height:1.5; max-width:32ch; margin:0 auto; }
  .ai-result-empty p b.inline{ display:inline; color:var(--navy); }
  .ai-result-loading{ display:none; text-align:center; padding:30px 6px; }
  .ai-result-loading.show{ display:block; }
  .ai-spinner{
    width:34px; height:34px; border-radius:50%; margin:0 auto 14px;
    border:3px solid var(--line); border-top-color:var(--navy);
    animation:spin .8s linear infinite;
  }
  @keyframes spin{ to{ transform:rotate(360deg); } }
  .ai-result-loading p{ font-size:.85rem; color:var(--ink-soft); font-weight:600; }
  .ai-result-ready{ display:none; }
  .ai-result-ready.show{ display:flex; flex-direction:column; gap:16px; }
  .ai-result-top{ display:flex; align-items:center; gap:12px; }
  .ai-result-top .mini-avatar{
    width:44px; height:44px; border-radius:12px; flex:0 0 auto;
    display:flex; align-items:center; justify-content:center; color:#fff;
    font-family:'Archivo',sans-serif; font-weight:700; font-size:.9rem;
    background:var(--navy);
  }
  .ai-result-top .mini-avatar.female{ background:var(--orange); }
  .ai-result-name{ font-family:'Archivo',sans-serif; font-size:.98rem; font-weight:600; color:var(--ink); }
  .ai-result-tone{ font-size:.78rem; color:var(--ink-faint); font-weight:600; }
  .live-pill{
    margin-left:auto; display:flex; align-items:center; gap:5px;
    font-family:'IBM Plex Mono',monospace; font-size:.68rem; font-weight:700; color:var(--orange-ink);
    background:var(--orange-soft); padding:5px 9px; border-radius:var(--radius-chip);
  }
  .live-pill i{ width:6px; height:6px; border-radius:50%; background:var(--orange); animation:blink 1.2s ease-in-out infinite; }
  @keyframes blink{ 0%,100%{opacity:1;} 50%{opacity:.25;} }
  .ai-player{
    display:flex; align-items:center; gap:12px; background:var(--surface); border:1px solid var(--line);
    border-radius:16px; padding:12px 14px;
  }
  .ai-player .play-btn{ width:42px; height:42px; }
  .ai-mini-wave{ flex:1; display:flex; align-items:center; gap:3px; height:30px; min-width:0; overflow:clip; }
  .ai-mini-wave i{ display:block; flex:1; min-width:2px; max-width:4px; border-radius:2px; background:var(--ink-faint); height:25%; }
  .ai-tool-result.playing .ai-mini-wave i{ background:var(--orange); }
  .ai-duration{ font-family:'IBM Plex Mono',monospace; font-size:.78rem; color:var(--ink-faint); flex:0 0 auto; white-space:nowrap; }
  .watermark-box{
    background:var(--navy-soft); border:1px solid color-mix(in srgb, var(--navy) 25%, transparent);
    border-radius:14px; padding:13px 14px; font-size:.78rem; line-height:1.55; color:var(--ink-soft);
  }
  .watermark-box b{ display:block; color:var(--navy); margin-bottom:4px; font-size:.8rem; }
  .whatsapp-btn{
    display:flex; align-items:center; justify-content:center; gap:8px;
    background:#fff; color:var(--ink); border:1.5px solid var(--line); border-radius:14px;
    padding:12px; font-weight:700; font-size:.88rem; cursor:pointer;
  }
  .whatsapp-btn:hover{ border-color:#25D366; color:#128C4A; }
  .whatsapp-btn svg{ width:18px; height:18px; color:#25D366; }

  /* ---------- sticky whatsapp CTA ---------- */
  .whatsapp-fab{
    position:fixed; right:20px; bottom:20px; z-index:60;
    width:58px; height:58px; border-radius:50%;
    background:#25D366; color:#fff;
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 10px 26px -8px rgba(18,140,74,.55), 0 2px 10px rgba(0,0,0,.18);
    transition:transform .18s ease, box-shadow .18s ease;
  }
  .whatsapp-fab:hover{ transform:translateY(-2px) scale(1.05); box-shadow:0 14px 32px -8px rgba(18,140,74,.6), 0 4px 12px rgba(0,0,0,.2); }
  .whatsapp-fab:focus-visible{ outline:2px solid #128C4A; outline-offset:3px; }
  .whatsapp-fab svg{ width:28px; height:28px; }
  @media (prefers-reduced-motion: reduce){ .whatsapp-fab{ transition:none; } }
  @media (max-width:600px){
    .whatsapp-fab{ right:16px; bottom:calc(16px + env(safe-area-inset-bottom)); width:52px; height:52px; }
    .whatsapp-fab svg{ width:25px; height:25px; }
  }

  /* ---------- ana sayfa: arama (solda) + favoriler (sağda) tek satır ---------- */
  .home-search-fav-row{ display:block; }
  .home-search-fav-row .filters,
  .home-search-fav-row .fav-home-panel{ margin-bottom:32px; }
  @media (min-width:980px){
    .home-search-fav-row{
      display:grid; grid-template-columns:1.4fr 1fr; align-items:start; gap:24px;
      margin-bottom:32px;
    }
    .home-search-fav-row .filters,
    .home-search-fav-row .fav-home-panel{ margin-bottom:0; }
  }

  /* ---------- favoriler paneli (ana sayfa, filtrelerin üstünde) ---------- */
  .fav-home-panel{
    background:var(--surface); border:1px solid var(--line); border-radius:24px;
    padding:20px 22px; box-shadow:var(--shadow-sm); margin-bottom:32px;
  }
  .fav-home-head{
    display:flex; align-items:center; justify-content:space-between; gap:12px;
    margin-bottom:16px;
  }
  .fav-home-head h2{
    display:flex; align-items:center; gap:8px; margin:0;
    font-size:1.05rem; font-family:'Archivo',sans-serif;
  }
  .fav-home-head h2 svg{ width:19px; height:19px; color:var(--orange-ink); }
  .fav-home-seeall{
    border:1px solid var(--line); background:transparent; border-radius:var(--radius-chip);
    padding:7px 14px; font-weight:700; font-size:.78rem; cursor:pointer; color:var(--ink-soft);
    transition:.15s ease; white-space:nowrap;
  }
  .fav-home-seeall:hover{ color:var(--navy); border-color:var(--navy); background:var(--navy-soft); }
  .fav-home-list{
    display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:10px;
    padding:0; overflow:visible; flex:none;
  }
  .fav-home-list .fav-item{
    background:var(--bg); border:1px solid var(--line-soft); border-radius:14px;
    padding:12px 14px; display:flex; align-items:center; justify-content:space-between; gap:10px;
  }
  .fav-home-list .fav-item-name{ font-size:.82rem; }
  .fav-home-list .fav-empty{
    grid-column:1/-1; padding:22px 16px; text-align:center;
    color:var(--ink-faint); font-size:.86rem; line-height:1.6;
    border:1px dashed var(--line); border-radius:14px; background:transparent;
  }
  @media (max-width:560px){
    .fav-home-list{ grid-template-columns:1fr; }
  }

  /* ---------- filters ---------- */
  .filters{
    background:var(--surface); border:1px solid var(--line); border-radius:24px;
    padding:6px; box-shadow:var(--shadow-sm); margin-bottom:32px;
    scroll-margin-top:100px;
  }
  .tabs{ display:flex; gap:4px; padding:6px; }
  .expand-filters-btn{
    display:none; width:100%; align-items:center; justify-content:center; gap:8px;
    background:transparent; border:none; cursor:pointer;
    padding:14px 20px; font-weight:700; font-size:.88rem; color:var(--ink-soft);
    transition:.15s ease;
  }
  .expand-filters-btn svg{ width:16px; height:16px; }
  .expand-filters-btn:hover{ color:var(--navy); }
  .filters.search-collapsed .tabs,
  .filters.search-collapsed .filters-body{ display:none; }
  .filters.search-collapsed .expand-filters-btn{ display:flex; }
  .tab-btn{
    flex:1; padding:12px 18px; border:none; background:transparent;
    border-radius:18px; font-weight:700; font-size:.92rem; color:var(--ink-faint);
    cursor:pointer; transition:.15s ease;
  }
  .tab-btn.active{ background:var(--navy); color:#fff; }
  .filters-body{ padding:18px 20px 22px; border-top:1px solid var(--line-soft); }
  .filter-group{ margin-bottom:16px; }
  .filter-group:last-child{ margin-bottom:0; }
  .filter-group h3, .filter-group h2.fg-h{
    font-family:'IBM Plex Mono',monospace; font-size:.7rem; font-weight:600;
    letter-spacing:.1em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:10px;
  }
  .chip-row{ display:flex; flex-wrap:wrap; gap:8px; }
  .chip{
    border:1px solid var(--line); background:var(--surface-2); color:var(--ink-soft);
    padding:8px 14px; border-radius:var(--radius-chip); font-size:.85rem; font-weight:600;
    cursor:pointer; transition:.15s ease; display:inline-flex; align-items:center; gap:6px;
  }
  .chip:hover{ border-color:var(--navy); color:var(--navy); }
  .chip.active{ background:var(--navy); border-color:var(--navy); color:#fff; }
  .chip.active.orange{ background:var(--orange-ink); border-color:var(--orange-ink); }
  .adv-panel{ display:none; }
  .adv-panel.open{ display:block; }
  .filters-foot{
    display:flex; align-items:center; justify-content:space-between; gap:12px;
    padding:14px 20px; border-top:1px solid var(--line-soft); flex-wrap:wrap;
  }
  .reset-link{ font-weight:700; font-size:.85rem; color:var(--ink-faint); cursor:pointer; background:none; border:none; }
  .reset-link:hover{ color:var(--orange); }
  .results-count{ font-size:.88rem; color:var(--ink-soft); }
  .results-count b{ color:var(--ink); font-family:'IBM Plex Mono',monospace; }

  /* ---------- grid ---------- */
  .grid{
    display:grid; grid-template-columns:repeat(2, 1fr);
    gap:18px; margin-bottom:32px;
  }
  @media (max-width:640px){ .grid{ grid-template-columns:1fr; } }
  .card{
    background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-card);
    box-shadow:var(--shadow-sm); display:flex; flex-direction:row; overflow:hidden;
    transition:.18s ease;
  }
  .card:hover{ box-shadow:var(--shadow-md); transform:translateY(-2px); border-color:color-mix(in srgb, var(--navy) 35%, var(--line)); }
  .card-photo{
    flex:0 0 130px;
    display:flex; align-items:center; justify-content:center;
    font-family:'Archivo',sans-serif; font-weight:800; font-size:1.4rem; color:#fff;
    background:linear-gradient(155deg, var(--navy), var(--navy-ink));
  }
  @media (max-width:480px){ .card-photo{ flex-basis:100px; } }
  .card-photo.female{ background:linear-gradient(155deg, var(--orange), var(--orange-ink)); }
  .card-photo{ position:relative; overflow:hidden; }
  .card-photo img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
  .card-body{ flex:1; min-width:0; display:flex; flex-direction:column; gap:14px; padding:16px; }
  .card-top{ display:flex; align-items:flex-start; gap:12px; }
  .card-id{ min-width:0; flex:1; }
  .card-id a{ font-family:'Archivo',sans-serif; font-size:1rem; font-weight:600; color:var(--navy); line-height:1.25; }
  .card-id a:hover{ color:var(--navy-ink); text-decoration:underline; }
  .card-id a.female{ color:var(--orange-ink); }
  .card-id a.female:hover{ color:var(--orange); text-decoration:underline; }
  .card-meta{ font-size:.78rem; color:var(--ink-faint); margin-top:3px; font-weight:600; }
  .fav-heart{
    flex:0 0 auto; width:26px; height:26px; border-radius:8px;
    border:none; background:transparent; cursor:pointer;
    display:flex; align-items:center; justify-content:center; color:var(--ink-faint);
    transition:.15s ease;
  }
  .fav-heart:hover{ color:var(--orange-ink); background:var(--orange-soft); }
  .fav-heart svg{ width:16px; height:16px; transition:.15s ease; }
  .fav-heart.active{ color:var(--orange-ink); }
  .fav-heart.active svg{ fill:var(--orange-ink); }
  .tag-row{ display:flex; flex-wrap:nowrap; align-items:center; gap:6px; min-width:0; }
  .tag-row-tags{
    display:flex; flex-wrap:nowrap; overflow:hidden; gap:6px; min-width:0; flex:1 1 auto;
    -webkit-mask-image:linear-gradient(to right, #000 calc(100% - 22px), transparent 100%);
    mask-image:linear-gradient(to right, #000 calc(100% - 22px), transparent 100%);
  }
  .tag-pill{
    font-size:.72rem; font-weight:700; color:var(--navy); background:var(--navy-soft);
    padding:4px 9px; border-radius:var(--radius-chip); white-space:nowrap; flex:0 0 auto;
  }
  .tag-pill.lehce{ color:var(--orange-ink); background:var(--orange-soft); }
  .tag-row-more{
    font-size:.72rem; font-weight:700; color:#fff; background:var(--navy);
    padding:4px 10px; border-radius:var(--radius-chip); white-space:nowrap; flex:0 0 auto;
    transition:.15s ease;
  }
  .tag-row-more:hover{ background:var(--navy-ink); }

  .player{
    display:flex; align-items:center; gap:10px;
    background:var(--surface-2); border:1px solid var(--line-soft); border-radius:14px;
    padding:8px 10px 8px 8px;
  }
  .play-btn{
    flex:0 0 auto; width:38px; height:38px; border-radius:50%; border:none;
    background:var(--navy); color:#fff; cursor:pointer;
    display:flex; align-items:center; justify-content:center;
  }
  .play-btn:hover{ background:var(--navy-ink); }
  .play-btn svg{ width:15px; height:15px; }
  .mini-wave{ flex:1; display:flex; align-items:center; height:24px; min-width:0; }
  .wave-track{
    position:relative; flex:1; height:4px; border-radius:4px; min-width:0;
    background:var(--line-soft); overflow:hidden;
  }
  .wave-fill{
    position:absolute; inset:0 auto 0 0; width:0%; border-radius:4px;
    background:var(--ink-faint); transition:width .1s linear, background .15s ease;
  }
  .card.playing .wave-fill{ background:var(--orange); }
  .card.loading .play-btn{ animation:playerPulse 1s ease-in-out infinite; }
  .card.loading .wave-track{ animation:playerPulse 1s ease-in-out infinite; }
  .card.play-error .play-btn{ background:var(--orange-ink,#b3401f); }
  @keyframes playerPulse{ 0%,100%{ opacity:1; } 50%{ opacity:.55; } }
  .time-label{
    flex:0 0 auto; font-family:'Archivo',sans-serif; font-size:.72rem; font-weight:700;
    color:var(--navy); background:var(--navy-soft); padding:5px 10px; border-radius:var(--radius-chip);
    white-space:nowrap; max-width:150px; overflow:hidden; text-overflow:ellipsis;
  }
  .variant-select{
    flex:0 0 auto; max-width:110px; font-family:'Archivo',sans-serif; font-size:.72rem;
    font-weight:600; color:var(--ink-soft); background:var(--surface); border:1px solid var(--line);
    border-radius:8px; padding:5px 6px;
  }
  .demo-download-btn{
    flex:0 0 auto; width:32px; height:32px; border-radius:50%; border:1px solid var(--line);
    background:var(--surface); color:var(--ink-soft); cursor:pointer; text-decoration:none;
    display:flex; align-items:center; justify-content:center; transition:.15s ease;
  }
  .demo-download-btn:hover{ background:var(--navy); border-color:var(--navy); color:#fff; }
  .demo-download-btn svg{ width:14px; height:14px; }
  @media (max-width:480px){ .variant-select{ display:none; } .time-label{ max-width:96px; } .demo-download-btn{ width:28px; height:28px; } }

  .card[hidden]{ display:none; }
  .empty-state{
    display:none; text-align:center; padding:60px 20px; color:var(--ink-faint);
    border:1px dashed var(--line); border-radius:20px; margin-bottom:40px;
  }
  .empty-state.show{ display:block; }
  .empty-state b{ display:block; color:var(--ink); font-family:'Archivo',sans-serif; margin-bottom:6px; }

  .pagination{ display:flex; justify-content:center; align-items:center; gap:6px; margin-bottom:64px; flex-wrap:wrap; }
  .pagination button{
    min-width:36px; height:36px; padding:0 10px; border-radius:10px; border:1px solid var(--line);
    background:var(--surface); font-family:'IBM Plex Mono',monospace; font-size:.8rem; font-weight:600;
    color:var(--ink-soft); cursor:pointer;
  }
  .pagination button.active{ background:var(--navy); border-color:var(--navy); color:#fff; }
  .pagination button:hover:not(.active){ border-color:var(--navy); color:var(--navy); }

  /* ---------- sonsuz kaydırma (infinite scroll) ---------- */
  .infinite-scroll-sentinel{
    display:none; align-items:center; justify-content:center;
    padding:20px 0 56px;
  }
  .infinite-scroll-sentinel.show{ display:flex; }
  .scroll-spinner{
    width:30px; height:30px; border-radius:50%;
    border:3px solid var(--line); border-top-color:var(--navy);
    animation:spin .8s linear infinite;
  }

  /* ---------- footer ---------- */
  .site-footer{
    border-top:1px solid var(--line-soft); padding-block:40px 28px;
    margin-inline:-20px; padding-inline:20px; background:var(--surface-2);
  }
  @media (min-width:900px){ .site-footer{ margin-inline:-40px; padding-inline:40px; } }
  .footer-grid{
    max-width:1240px; margin-inline:auto; display:grid; gap:32px;
    grid-template-columns:1fr; margin-bottom:28px;
  }
  @media (min-width:760px){ .footer-grid{ grid-template-columns:1.3fr 1fr 1fr; } }
  .footer-brand img{ height:48px; margin-bottom:12px; }
  .footer-brand p{ color:var(--ink-soft); font-size:.9rem; line-height:1.6; max-width:34ch; }
  .footer-col h4, .footer-col h2.footer-h{
    font-family:'IBM Plex Mono',monospace; font-size:.7rem; letter-spacing:.1em; text-transform:uppercase;
    color:var(--ink-faint); margin-bottom:12px;
  }
  .footer-col a{ display:block; color:var(--ink-soft); font-size:.9rem; font-weight:600; padding-block:5px; }
  .footer-col a:hover{ color:var(--navy); }
  .footer-bottom{
    max-width:1240px; margin-inline:auto; display:flex; justify-content:space-between; align-items:center;
    flex-wrap:wrap; gap:10px; padding-top:20px; border-top:1px solid var(--line);
    font-size:.78rem; color:var(--ink-faint);
  }
  .footer-bottom .social-icons{ display:flex; }
/* ========================================================================
   Çoklu sayfa yapısı için ek stiller (v3 - /isler.php, /neler_yapariz.php,
   /iletisim.php ve /seslendirme-sanatcisi/{slug} sayfaları)
   ======================================================================== */

/* ---- breadcrumb ---- */
.breadcrumb{
  display:flex; flex-wrap:wrap; align-items:center; gap:6px;
  font-size:.82rem; color:var(--ink-faint); font-weight:600;
  margin:18px 0 22px;
}
.breadcrumb a{ color:var(--ink-faint); }
.breadcrumb a:hover{ color:var(--navy); text-decoration:underline; }
.breadcrumb span[aria-current]{ color:var(--ink-soft); }
.breadcrumb .sep{ opacity:.5; }

/* ---- sanatçı detay sayfası (artık modal değil, gerçek sayfa) ---- */
.artist-detail-wrap{ padding-block:8px 60px; }
.artist-detail-panel{
  position:relative; background:var(--surface); border:1px solid var(--line);
  border-radius:20px; box-shadow:var(--shadow-sm); overflow:hidden;
}
.artist-demo-list.full{ max-height:none; overflow:visible; }
.artist-back-link{
  display:inline-flex; align-items:center; gap:6px;
  font-weight:700; font-size:.85rem; color:var(--navy); margin-bottom:4px;
}
.artist-back-link:hover{ text-decoration:underline; }
.artist-back-link svg{ width:15px; height:15px; }

/* ---- ilgili / benzer sanatçılar şeridi ---- */
.related-artists{ margin-top:44px; }
.related-artists :is(h2,h3){
  font-size:.8rem; text-transform:uppercase; letter-spacing:.05em;
  color:var(--ink-faint); margin:0 0 14px;
}
.related-grid{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:14px;
}
.related-card{
  display:flex; align-items:center; gap:12px;
  background:var(--surface); border:1px solid var(--line); border-radius:14px;
  padding:10px 14px; transition:.15s ease;
}
.related-card:hover{ border-color:color-mix(in srgb, var(--navy) 35%, var(--line)); box-shadow:var(--shadow-sm); transform:translateY(-1px); }
.related-card .mini-avatar{ flex:0 0 auto; }
.related-card .related-name{ font-weight:700; font-size:.88rem; color:var(--ink); line-height:1.25; }
.related-card .related-meta{ font-size:.74rem; color:var(--ink-faint); font-weight:600; margin-top:1px; }

/* ---- basit içerik sayfaları: İşlerimiz / Neler Yaparız / Bize Ulaşın ---- */
.page-hero{
  padding:52px 0 36px; border-bottom:1px solid var(--line-soft); margin-bottom:40px;
}
.page-hero h1{ margin:0 0 12px; font-size:clamp(1.7rem,3.4vw,2.4rem); }
.page-hero p{ color:var(--ink-soft); font-size:1.02rem; line-height:1.65; max-width:64ch; margin:0; }
.page-hero .draft-note{
  display:inline-flex; align-items:center; gap:8px; margin-top:16px;
  background:var(--orange-soft); color:var(--orange-ink); border:1px solid color-mix(in srgb, var(--orange) 35%, transparent);
  border-radius:var(--radius-chip); padding:8px 14px; font-size:.8rem; font-weight:700;
}

.content-section{ margin-bottom:56px; }
.content-section h2{ font-size:clamp(1.2rem,2.2vw,1.5rem); margin:0 0 18px; }
.content-section > p.lede{ color:var(--ink-soft); line-height:1.7; max-width:70ch; margin:0 0 24px; }

.service-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:16px; }
.service-card{
  background:var(--surface); border:1px solid var(--line); border-radius:16px;
  padding:20px 20px 18px; box-shadow:var(--shadow-sm);
}
.service-card .service-icon{
  width:42px; height:42px; border-radius:12px; display:flex; align-items:center; justify-content:center;
  background:var(--navy-soft); color:var(--navy); margin-bottom:12px;
}
.service-card.orange .service-icon{ background:var(--orange-soft); color:var(--orange-ink); }
.service-card h3{ font-size:1rem; margin:0 0 6px; }
.service-card p{ font-size:.86rem; color:var(--ink-soft); line-height:1.55; margin:0; }

.process-steps{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:0;
  counter-reset:step; position:relative;
}
.process-step{ position:relative; padding:0 18px 18px 0; }
.process-step .step-num{
  counter-increment:step; content:counter(step);
  display:flex; align-items:center; justify-content:center;
  width:36px; height:36px; border-radius:50%; background:var(--navy); color:#fff;
  font-family:'Archivo',sans-serif; font-weight:800; font-size:.95rem; margin-bottom:12px;
}
.process-step .step-num::before{ content:counter(step); }
.process-step h3{ font-size:.98rem; margin:0 0 6px; }
.process-step p{ font-size:.85rem; color:var(--ink-soft); line-height:1.55; margin:0; }

.work-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:18px; }
.work-card{
  border:1px solid var(--line); border-radius:16px; overflow:hidden; background:var(--surface);
  box-shadow:var(--shadow-sm);
}
.work-card .work-thumb{
  height:130px; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(150deg, var(--navy), var(--navy-ink)); color:#fff;
}
.work-card:nth-child(3n+2) .work-thumb{ background:linear-gradient(150deg, var(--orange), var(--orange-ink)); }
.work-card:nth-child(3n) .work-thumb{ background:linear-gradient(150deg, var(--ink-soft), var(--ink)); }
.work-card .work-thumb svg{ width:34px; height:34px; }
.work-card .work-body{ padding:14px 16px 16px; }
.work-card h3{ font-size:.95rem; margin:0 0 4px; }
.work-card p{ font-size:.82rem; color:var(--ink-faint); margin:0; font-weight:600; }

.lang-cloud{ display:flex; flex-wrap:wrap; gap:8px; }
.lang-cloud span{
  background:var(--surface-2); border:1px solid var(--line-soft); color:var(--ink-soft);
  font-size:.8rem; font-weight:700; padding:7px 13px; border-radius:999px;
}

/* ---- iletişim sayfası ---- */
.contact-grid{ display:grid; grid-template-columns:1fr; gap:32px; }
@media (min-width:860px){ .contact-grid{ grid-template-columns:1fr 1fr; } }
.contact-info-card{
  background:var(--surface); border:1px solid var(--line); border-radius:18px;
  padding:26px; box-shadow:var(--shadow-sm);
}
.contact-row{ display:flex; align-items:flex-start; gap:12px; padding:12px 0; border-bottom:1px solid var(--line-soft); }
.contact-row:last-child{ border-bottom:none; }
.contact-row .ci-icon{
  flex:0 0 auto; width:38px; height:38px; border-radius:10px; background:var(--navy-soft); color:var(--navy);
  display:flex; align-items:center; justify-content:center;
}
.contact-row b{ display:block; font-size:.78rem; text-transform:uppercase; letter-spacing:.04em; color:var(--ink-faint); margin-bottom:2px; }
.contact-row span, .contact-row a{ font-size:.95rem; color:var(--ink); font-weight:600; }
.contact-row a:hover{ color:var(--navy); text-decoration:underline; }
.contact-row .placeholder{ color:var(--ink-faint); font-weight:600; font-style:italic; }

.contact-form-card{
  background:var(--surface); border:1px solid var(--line); border-radius:18px;
  padding:26px; box-shadow:var(--shadow-sm);
}
.contact-form-card h2{ margin-top:0; }
.form-row{ margin-bottom:16px; }
.form-row label{ display:block; font-size:.8rem; font-weight:700; color:var(--ink-soft); margin-bottom:6px; }
.form-row input, .form-row textarea{
  width:100%; border:1px solid var(--line); border-radius:10px; padding:11px 13px;
  font:inherit; font-size:.92rem; color:var(--ink); background:var(--bg);
}
.form-row input:focus, .form-row textarea:focus{ outline:2px solid var(--navy); outline-offset:1px; }
.form-row textarea{ min-height:120px; resize:vertical; }
.contact-submit-btn{
  display:inline-flex; align-items:center; gap:8px;
  background:var(--navy); color:#fff; border:none; border-radius:var(--radius-chip);
  padding:12px 22px; font-weight:700; font-size:.92rem; cursor:pointer; transition:.15s ease;
}
.contact-submit-btn:hover{ background:var(--navy-ink); }
.form-note{ font-size:.78rem; color:var(--ink-faint); margin-top:10px; }

/* ---- uzun varyant etiketleri dar ekranlarda dalga formuyla çakışmasın ---- */
.time-label{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:150px; }
@media (max-width:480px){ .time-label{ max-width:96px; } }

/* ---- ilgili sanatçı mini-avatarları (foto olmadığı için baş harf rozeti) ---- */
.related-card .mini-avatar{
  width:34px; height:34px; border-radius:50%;
  display:flex; align-items:center; justify-content:center; color:#fff;
  font-family:'Archivo',sans-serif; font-weight:700; font-size:.78rem;
  background:linear-gradient(150deg, var(--navy), var(--navy-ink));
}
.related-card .mini-avatar.female{ background:linear-gradient(150deg, var(--orange), var(--orange-ink)); }

/* ========================================================================
   TASARIM v2 — keskin "yayın stüdyosu" dili
   - Köşe yuvarlama yok (border-radius: 0), yumuşak gölge yok
   - İnce çizgi (hairline) ızgaralar, tek vurgu rengi: turuncu
   - Başlık: Archivo (dar genişlik), metin: Archivo, sayılar: IBM Plex Mono
   - Kurumsal renkler korunur: lacivert #0d4da4, turuncu #f3752b
   ======================================================================== */
:root{
  --bg:#f3f4f6;
  --surface:#ffffff;
  --surface-2:#eceef2;
  --surface-3:#e1e4ea;
  --ink:#0b1324;
  --ink-soft:#4a5468;
  --ink-faint:#5f6879;
  --line:#d3d8e0;
  --line-soft:#e3e6ec;
  --line-strong:#0b1324;
  --navy:#0d4da4;
  --navy-ink:#093a7d;
  --navy-deep:#071c3d;
  --navy-soft:#e3ebf7;
  --orange:#f3752b;
  --orange-ink:#a8480f;
  --orange-soft:#fde8da;
  --shadow-sm:none;
  --shadow-md:none;
  --shadow-lg:0 30px 80px -30px rgba(7,28,61,.55);
  --radius-card:18px;
  --radius-chip:999px;
  --radius-btn:12px;
  --font-display:'Archivo', 'Arial Narrow', system-ui, sans-serif;
  --font-body:'Archivo', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono:'IBM Plex Mono', ui-monospace, monospace;
  --ease:cubic-bezier(.2,.7,.2,1);
}
:root[data-theme="dark"]{
  --bg:#070d19;
  --surface:#0d1626;
  --surface-2:#111d31;
  --surface-3:#18263f;
  --ink:#eef2f8;
  --ink-soft:#a7b1c4;
  --ink-faint:#8590a6;
  --line:#22304b;
  --line-soft:#1a2740;
  --line-strong:#eef2f8;
  --navy:#5b93e0;
  --navy-ink:#86b2ee;
  --navy-deep:#030914;
  --navy-soft:#13233d;
  --orange:#ff8a45;
  --orange-ink:#ffa46c;
  --orange-soft:#33200f;
}


/* ---- tipografi ---- */
body{ font-family:var(--font-body); font-size:16px; line-height:1.55; background:var(--bg); }
h1, h2, h3, h4{ font-family:var(--font-display); font-stretch:87.5%; letter-spacing:-.015em; }
.mono, .results-count b, .char-count, .ai-duration{ font-family:var(--font-mono); }
::selection{ background:var(--orange); color:#fff; }
:focus-visible{ outline:2px solid var(--orange); outline-offset:2px; }

/* ---- header: beyaz şerit, alt çizgi, kare kontrol grubu ---- */
.site-header{ background:var(--surface); border-bottom:1px solid var(--line); }
.site-header.scrolled{ box-shadow:none; border-bottom-color:var(--line-strong); }
.header-row{ padding-block:12px; }
.main-nav{ gap:0; font-size:.9rem; font-weight:600; align-self:stretch; }
.main-nav a{
  display:flex; align-items:center; padding:0 18px; color:var(--ink-soft);
  border-left:1px solid transparent; transition:color .15s ease, background .15s ease;
}
.main-nav a:hover{ color:var(--ink); background:var(--surface-2); }
.main-nav a.current{ color:var(--ink); }
.main-nav a.current::after{ left:18px; right:18px; bottom:-13px; height:3px; background:var(--orange); }
.header-actions{ gap:0; }
.header-actions > .ai-shortcut,
.header-actions > .theme-toggle,
.header-actions > .lang-switch,
.header-actions > .nav-toggle{
  width:40px; height:40px; background:var(--surface); border:1px solid var(--line); margin-left:-1px;
  color:var(--ink-soft);
}
.header-actions > .ai-shortcut:hover,
.header-actions > .theme-toggle:hover,
.header-actions > .lang-switch:hover,
.header-actions > .nav-toggle:hover{ position:relative; z-index:1; border-color:var(--ink); color:var(--ink); background:var(--surface); }
.header-actions .social-icons{ gap:0; margin-left:12px; }
.header-actions .social-icons a{ width:40px; height:40px; border:1px solid var(--line); margin-left:-1px; }
.header-actions .social-icons a:hover{ position:relative; z-index:1; border-color:var(--navy); background:var(--navy); color:#fff; }
.lang-switch svg{ width:22px; height:15px; }
.mobile-nav a{ border-bottom:1px solid var(--line-soft); padding:14px 4px; }
.mobile-nav a:hover{ background:transparent; color:var(--navy); }
.mobile-nav .social-icons a{ border:1px solid var(--line); }

/* ---- butonlar ---- */
.search-submit, .contact-submit-btn, .ai-generate-btn{
  background:var(--navy); color:#fff; border:1px solid var(--navy);
  font-family:var(--font-body); font-weight:700; letter-spacing:.01em;
  box-shadow:none; text-shadow:none; transition:background .15s ease, border-color .15s ease;
}
.search-submit:hover, .contact-submit-btn:hover{ background:var(--navy-deep); border-color:var(--navy-deep); }
.ai-generate-btn{ background:var(--orange); border-color:var(--orange); }
.ai-generate-btn:hover{ background:var(--orange-ink); border-color:var(--orange-ink); filter:none; transform:none; }
.search-submit:active, .contact-submit-btn:active, .ai-generate-btn:active{ transform:translateY(1px); }

/* ---- giriş: yerli / yabancı seçimi ---- */
.origin-select{ gap:0; }
.origin-half{ padding:clamp(28px,4vw,56px); }
.origin-yerli::after{ background:linear-gradient(0deg, rgba(7,28,61,.92) 0%, rgba(13,77,164,.72) 55%, rgba(13,77,164,.55) 100%); }
.origin-yabanci::after{ background:linear-gradient(0deg, rgba(120,48,8,.9) 0%, rgba(243,117,43,.74) 55%, rgba(243,117,43,.55) 100%); }
@media (min-width:768px){ .origin-yerli{ border-right:1px solid rgba(255,255,255,.25); } }
.origin-pill{
  gap:14px; padding:18px 26px; border:2px solid #fff; background:transparent;
  font-family:var(--font-display); font-stretch:87.5%; font-size:clamp(1.05rem,1.6vw,1.35rem);
  font-weight:800; letter-spacing:.02em; text-transform:uppercase; text-shadow:none;
  backdrop-filter:none; -webkit-backdrop-filter:none; transition:background .2s ease, color .2s ease;
}
.origin-pill::after{
  content:""; width:22px; height:12px; flex:0 0 auto;
  background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 12'%3E%3Cpath d='M0 5h19l-4-4 1.4-1.4L22 6l-5.6 6.4L15 11l4-4H0z'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 12'%3E%3Cpath d='M0 5h19l-4-4 1.4-1.4L22 6l-5.6 6.4L15 11l4-4H0z'/%3E%3C/svg%3E") center/contain no-repeat;
  transition:transform .25s var(--ease);
}
.origin-half:hover .origin-pill::after{ transform:translateX(5px); }

/* ---- ana sayfa hero ---- */
.hero-banner::after{
  background:linear-gradient(90deg, rgba(7,28,61,.95) 0%, rgba(9,58,125,.86) 45%, rgba(13,77,164,.35) 100%);
  opacity:1;
}
.hero-banner .hero{ border-left:3px solid var(--orange); padding-left:clamp(18px,3vw,36px); }
.hero h1{ font-weight:800; font-size:clamp(2.2rem,4.6vw,3.8rem); line-height:1.02; letter-spacing:-.025em; }
.hero-banner .hero h1{ text-shadow:none; }
.hero-banner .hero h1 em{ color:var(--orange); }
.hero-banner .hero p.lead{ text-shadow:none; color:rgba(255,255,255,.82); }
.search-card{ border-radius:0; padding:0; gap:0; box-shadow:none; flex-wrap:nowrap; }
.hero-banner .search-card{
  background:#fff; border:1px solid #fff; backdrop-filter:none; -webkit-backdrop-filter:none; box-shadow:none;
}
.hero-banner .search-card input[type="text"]{ color:var(--ink); padding:16px 18px; font-size:1rem; }
.hero-banner .search-card input::placeholder{ color:#5f6879; }
.search-submit{ padding:0 26px; font-size:.95rem; }
:root[data-theme="dark"] .hero-banner .search-card{ background:var(--surface); border-color:var(--line); }

/* ---- filtre paneli ---- */
.filters, .fav-home-panel{ background:var(--surface); border:1px solid var(--line); box-shadow:none; padding:0; }
.tabs{ padding:0; gap:0; border-bottom:1px solid var(--line); }
.tab-btn{
  padding:16px 18px; font-size:.9rem; font-weight:700; color:var(--ink-faint);
  border-bottom:3px solid transparent; margin-bottom:-1px; transition:color .15s ease, border-color .15s ease;
}
.tab-btn:hover{ color:var(--ink); }
.tab-btn.active{ background:transparent; color:var(--ink); border-bottom-color:var(--orange); }
.filters-body{ border-top:none; padding:20px 22px 22px; }
.filter-group h3, .filter-group h2.fg-h{ font-family:var(--font-mono); letter-spacing:.12em; font-size:.68rem; color:var(--ink-faint); }
.chip-row{ gap:0; }
.chip{
  margin:0 -1px -1px 0; padding:9px 14px; font-size:.84rem; font-weight:600;
  background:var(--surface); border:1px solid var(--line); color:var(--ink-soft);
  transition:background .15s ease, color .15s ease, border-color .15s ease;
}
.chip:hover{ position:relative; z-index:1; border-color:var(--ink); color:var(--ink); }
.chip.active{ position:relative; z-index:2; background:var(--navy); border-color:var(--navy); color:#fff; }
.chip.orange-group.active, .chip.active.orange{ background:var(--orange); border-color:var(--orange); color:#fff; }
.filters-foot{ border-top:1px solid var(--line); padding:14px 22px; }
.reset-link{ font-size:.82rem; text-decoration:underline; text-underline-offset:3px; }
.expand-filters-btn{ border-top:1px solid var(--line); }
.fav-home-panel{ padding:18px 20px; }
.fav-home-head h2{ font-size:1rem; text-transform:uppercase; letter-spacing:.04em; }
.fav-home-seeall{ border:1px solid var(--line); font-size:.76rem; }
.fav-home-seeall:hover{ background:var(--ink); border-color:var(--ink); color:#fff; }
.fav-home-list .fav-item{ background:var(--surface-2); border:1px solid var(--line-soft); }
.fav-home-list .fav-empty{ border:1px dashed var(--line); }

/* ---- katalog ızgarası: kartlar ince çizgiyle birleşik ---- */
.grid{ gap:0; padding:1px 0 0 1px; margin-bottom:40px; }
.card{
  position:relative; margin:-1px 0 0 -1px; border:1px solid var(--line); box-shadow:none;
  background:var(--surface); transition:border-color .15s ease;
}
.card:not(.modal-demo-row)::after{
  content:""; position:absolute; left:0; right:0; bottom:-1px; height:3px; background:var(--orange);
  transform:scaleX(0); transform-origin:left; transition:transform .3s var(--ease); pointer-events:none;
}
.card:hover{ z-index:2; transform:none; box-shadow:none; border-color:var(--ink); }
.card:not(.modal-demo-row):hover::after, .card.playing:not(.modal-demo-row)::after{ transform:scaleX(1); }
.card-photo{ flex-basis:136px; background:var(--navy); font-family:var(--font-display); font-weight:800; font-size:1.6rem; letter-spacing:.02em; }
.card-photo.female{ background:var(--orange); }
.card-photo img{ transition:transform .5s var(--ease); }
.card:hover .card-photo img{ transform:scale(1.04); }
.card-body{ padding:16px 18px; gap:12px; }
/* müşteri isteği: isimler cinsiyete göre renkli (kadın turuncu, erkek lacivert) */
.card-id a{ font-family:var(--font-display); font-stretch:87.5%; font-size:1.12rem; font-weight:800; letter-spacing:-.01em; color:var(--navy); }
.card-id a.female{ color:var(--orange-ink); }
.card-id a:hover, .card-id a.female:hover{ text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:4px; }
.card-meta{ font-size:.76rem; font-weight:600; color:var(--ink-faint); letter-spacing:.01em; margin-top:4px; }
.fav-heart{ width:32px; height:32px; border:1px solid var(--line); }
.fav-heart:hover{ background:var(--orange-soft); border-color:var(--orange); }
.fav-heart.active{ border-color:var(--orange); background:var(--orange-soft); }

/* etiketler: kare, dolgusuz, okunaklı */
.tag-row, .tag-row-tags{ gap:0; }
.tag-pill{
  font-size:.72rem; font-weight:600; color:var(--ink-soft); background:transparent;
  border:1px solid var(--line); padding:4px 8px; margin-right:-1px;
}
.tag-pill.lehce{ color:var(--orange-ink); background:transparent; border-color:color-mix(in srgb, var(--orange) 45%, var(--line)); }
.tag-row-more{
  margin-left:8px; background:transparent; color:var(--navy); padding:4px 0; font-weight:700;
  border-bottom:1px solid currentColor;
}
.tag-row-more:hover{ background:transparent; color:var(--ink); }
.artist-modal-tags{ gap:0; }
.artist-modal-tags .tag-pill{ margin-bottom:-1px; padding:6px 10px; font-size:.78rem; }

/* oynatıcı */
.player{ background:var(--surface-2); border:1px solid var(--line-soft); padding:0; gap:0; align-items:stretch; }
.play-btn{ width:44px; height:auto; min-height:42px; background:var(--navy); transition:background .15s ease; }
.play-btn:hover{ background:var(--navy-deep); }
.card.playing .play-btn{ background:var(--orange); }
.mini-wave{ padding:0 12px; height:auto; }
.wave-track{ height:2px; background:var(--line); }
.wave-fill{ background:var(--navy); }
.time-label{
  align-self:center; font-family:var(--font-body); font-size:.74rem; font-weight:700; color:var(--ink);
  background:transparent; padding:0 10px; border-left:1px solid var(--line);
}
.variant-select{
  align-self:stretch; height:auto; border:none; border-left:1px solid var(--line); background:var(--surface);
  padding:0 8px; font-family:var(--font-body); font-size:.76rem; color:var(--ink-soft); max-width:120px;
}
.demo-download-btn{ width:42px; height:auto; min-height:42px; border:none; border-left:1px solid var(--line); background:var(--surface); }
.demo-download-btn:hover{ background:var(--ink); color:#fff; }
.player > .fav-heart{ width:42px; height:auto; border:none; border-left:1px solid var(--line); }
@media (max-width:480px){ .demo-download-btn{ width:36px; } }

.empty-state{ border:1px dashed var(--line); background:var(--surface); }
.results-count{ font-size:.84rem; }

/* ---- sanatçı detay sayfası ---- */
.breadcrumb{ font-family:var(--font-mono); font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; font-weight:500; }
.artist-back-link{ font-size:.82rem; text-transform:uppercase; letter-spacing:.05em; }
.artist-detail-panel{ border:1px solid var(--line); box-shadow:none; }
.artist-modal-top{ border-bottom:1px solid var(--line); }
@media (min-width:640px){ .artist-modal-top{ grid-template-columns:260px 1fr; } .artist-modal-photo{ min-height:325px; } }
.artist-modal-photo{ background:var(--navy); font-family:var(--font-display); }
.artist-modal-photo.female{ background:var(--orange); }
.artist-modal-info{ position:relative; }
@media (min-width:640px){ .artist-modal-info{ padding:34px 40px 28px; } }
.artist-modal-info h1{ font-size:clamp(1.8rem,3.6vw,2.8rem); font-weight:800; line-height:1.02; margin-bottom:10px; letter-spacing:-.025em; }
.artist-modal-meta{ margin-top:14px; font-family:var(--font-mono); font-size:.76rem; letter-spacing:.06em; text-transform:uppercase; font-weight:500; }
.artist-modal-bio{ font-size:.98rem; line-height:1.7; color:var(--ink-soft); max-width:62ch; }
.artist-fav-btn{ border:1px solid var(--ink); color:var(--ink); padding:11px 18px; font-size:.84rem; }
.artist-fav-btn:hover{ background:var(--ink); color:#fff; border-color:var(--ink); }
.artist-fav-btn.active{ background:var(--orange); border-color:var(--orange); color:#fff; }
.artist-fav-btn.active svg{ fill:#fff; }
.artist-modal-demos{ border-top:none; background:var(--surface); }
.artist-modal-demos :is(h2,h3){ font-family:var(--font-mono); font-size:.72rem; letter-spacing:.14em; color:var(--ink-faint); margin:24px 0 14px; }
.artist-demo-list{ gap:0; }
.artist-demo-list .card.modal-demo-row{ margin:0 0 -1px 0; }
.artist-demo-list .player{ border:1px solid var(--line); background:var(--surface); }
.artist-demo-list .card.modal-demo-row:hover .player{ position:relative; z-index:1; border-color:var(--ink); }

.related-artists :is(h2,h3){ font-family:var(--font-mono); font-size:.72rem; letter-spacing:.14em; }
.related-grid{ gap:0; padding:1px 0 0 1px; }
.related-card{ margin:-1px 0 0 -1px; border:1px solid var(--line); background:var(--surface); padding:12px 14px; }
.related-card:hover{ position:relative; z-index:1; transform:none; box-shadow:none; border-color:var(--ink); }
.related-card .mini-avatar{ background:var(--navy); font-family:var(--font-display); }
.related-card .mini-avatar.female{ background:var(--orange); }

/* ---- içerik sayfaları ---- */
.page-hero{ padding:48px 0 32px; border-bottom:1px solid var(--line); }
.page-hero h1{ font-size:clamp(2.2rem,5vw,3.6rem); font-weight:800; line-height:1; letter-spacing:-.03em; }
.page-hero .draft-note{ border:1px solid color-mix(in srgb, var(--orange) 45%, transparent); }
.content-section h2{ font-size:clamp(1.4rem,2.6vw,1.9rem); font-weight:800; }
.service-grid{ grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:0; padding:1px 0 0 1px; }
@media (min-width:900px){ .service-grid{ grid-template-columns:repeat(3,1fr); } }
.service-card{ margin:-1px 0 0 -1px; border:1px solid var(--line); box-shadow:none; padding:26px 24px 24px; transition:background .2s ease, color .2s ease; }
.service-card .service-icon{ width:44px; height:44px; background:var(--navy); color:#fff; }
.service-card.orange .service-icon{ background:var(--orange); color:#fff; }
.service-card h3{ font-size:1.15rem; font-weight:800; margin-bottom:8px; }
.service-card:hover{ position:relative; z-index:1; background:var(--navy); border-color:var(--navy); color:#fff; }
.service-card:hover p{ color:rgba(255,255,255,.8); }
.service-card:hover .service-icon{ background:var(--orange); }
.process-steps{ border-top:1px solid var(--line); }
.process-step{ padding:22px 22px 22px 0; }
.process-step .step-num{ width:auto; height:auto; background:transparent; color:var(--orange); font-family:var(--font-mono); font-weight:600; font-size:.8rem; letter-spacing:.1em; justify-content:flex-start; }
.process-step .step-num::before{ content:"0" counter(step); }
.process-step h3{ font-size:1.1rem; font-weight:800; }
.lang-cloud{ gap:0; }
.lang-cloud span{ margin:0 -1px -1px 0; background:var(--surface); border:1px solid var(--line); font-weight:600; padding:9px 14px; }
.contact-info-card, .contact-form-card{ border:1px solid var(--line); box-shadow:none; }
.contact-row .ci-icon{ background:var(--navy); color:#fff; }
.contact-row b{ font-family:var(--font-mono); font-weight:500; letter-spacing:.1em; font-size:.7rem; }
.form-row label{ font-size:.78rem; text-transform:uppercase; letter-spacing:.05em; color:var(--ink); }
.form-row input, .form-row textarea{ background:var(--surface); border:1px solid var(--line); padding:13px 14px; }
.form-row input:focus, .form-row textarea:focus{ outline:none; border-color:var(--navy); box-shadow:inset 0 -2px 0 var(--navy); }
.contact-submit-btn{ padding:14px 26px; }

/* ---- footer ---- */
.site-footer{ background:var(--surface); border-top:3px solid var(--navy); }
.footer-col h4, .footer-col h2.footer-h{ font-family:var(--font-mono); font-weight:500; letter-spacing:.14em; }
.footer-col a{ font-weight:500; }
.footer-col a:hover{ color:var(--orange-ink); }
.footer-bottom{ border-top:1px solid var(--line); font-family:var(--font-mono); font-size:.72rem; }

/* ---- WhatsApp: kare, sade ---- */
.whatsapp-fab{ width:56px; height:56px; box-shadow:0 12px 28px -10px rgba(7,28,61,.45); }
.whatsapp-fab:hover{ transform:none; box-shadow:0 12px 28px -10px rgba(7,28,61,.55); background:#1fb959; }

/* ---- paneller / modallar ---- */
.ai-modal-panel, .artist-modal-panel{ background:var(--bg); }
.ai-tool-card{ border:1px solid var(--line); box-shadow:none; }
.artist-pick, .tone-pick, .quick-chip{ border-width:1px; }
.ai-step h3 .num{ background:var(--orange); }
.watermark-box{ border-left:3px solid var(--navy); }
.fav-drawer{ box-shadow:-20px 0 60px -30px rgba(7,28,61,.6); }
.fav-drawer-head{ background:var(--navy-deep); }

@media (prefers-reduced-motion: reduce){
  .card::after, .card-photo img, .origin-pill::after{ transition:none !important; }
}

/* ---- v2 düzeltmeler: dar ekranda oynatıcı taşmasın, benzer sanatçı kartları ---- */
.player{ min-width:0; overflow:hidden; }
.card-body{ min-width:0; }
@media (max-width:520px){
  .card .mini-wave{ display:none; }
  .card .time-label{ flex:1; min-width:0; max-width:none; border-left:none; padding:0 10px; }
  .play-btn{ width:40px; }
  .demo-download-btn, .player > .fav-heart{ width:38px; }
  .card-body{ padding:14px; }
  .card-id a{ font-size:1.02rem; }
}
.related-card .related-name, .related-card .related-meta{ display:block; }
@media (min-width:900px){ .related-grid{ grid-template-columns:repeat(4,1fr); } }
/* koyu temada da baş harf blokları kurumsal lacivert / turuncu kalsın */
.card-photo, .artist-modal-photo, .related-card .mini-avatar{ background:#0d4da4; }
.card-photo.female, .artist-modal-photo.female, .related-card .mini-avatar.female{ background:#f3752b; }

/* ========================================================================
   Köşe yuvarlamaları eski haline döndü — bitişik (çizgi ızgara) düzenler,
   yuvarlak köşelerle uyumlu aralıklı düzene çevrildi
   ======================================================================== */
.header-actions{ gap:8px; }
.header-actions > .ai-shortcut, .header-actions > .theme-toggle,
.header-actions > .lang-switch, .header-actions > .nav-toggle{ margin-left:0; width:38px; height:38px; }
.header-actions .social-icons{ gap:6px; margin-left:6px; }
.header-actions .social-icons a{ margin-left:0; width:34px; height:34px; }
.main-nav{ gap:6px; }
.main-nav a{ padding:0 12px; }
.main-nav a.current::after{ left:12px; right:12px; }

.chip-row{ gap:8px; }
.chip{ margin:0; }
.tag-row, .tag-row-tags, .artist-modal-tags{ gap:6px; }
.tag-pill{ margin:0; }
.artist-modal-tags .tag-pill{ margin:0; }

.grid{ gap:18px; padding:0; }
.card{ margin:0; overflow:hidden; }
.card:hover{ border-color:color-mix(in srgb, var(--navy) 45%, var(--line)); }
.related-grid{ gap:14px; padding:0; }
.related-card{ margin:0; }
.service-grid{ gap:16px; padding:0; }
.service-card{ margin:0; }
.lang-cloud{ gap:8px; }
.lang-cloud span{ margin:0; }
.artist-demo-list{ gap:10px; }
.artist-demo-list .card.modal-demo-row{ margin:0; }

/* oynatıcı: özgün yuvarlak tuşlu düzen */
.player{ padding:8px 10px 8px 8px; gap:10px; align-items:center; background:var(--surface-2); border:1px solid var(--line-soft); }
.play-btn{ width:38px; height:38px; min-height:0; }
.mini-wave{ padding:0; height:24px; }
.time-label{ align-self:auto; background:var(--navy-soft); color:var(--navy); padding:5px 10px; border-left:none; }
.variant-select{ align-self:auto; border:1px solid var(--line); padding:5px 6px; }
.demo-download-btn{ width:32px; height:32px; min-height:0; border:1px solid var(--line); }
.player > .fav-heart{ width:28px; height:28px; border:none; }
@media (max-width:520px){
  .play-btn{ width:36px; height:36px; }
  .demo-download-btn{ width:30px; height:30px; }
  .player > .fav-heart{ width:28px; }
  .card .time-label{ flex:0 1 auto; padding:5px 10px; }
}

/* ana sayfa arama kutusu: özgün yuvarlak kart düzeni */
.search-card{ padding:8px; gap:8px; }
.search-submit{ padding:12px 20px; }
.hero-banner .search-card input[type="text"]{ padding:12px 14px; }
.hero-banner .hero{ border-left:none; padding-left:0; }
@media (max-width:520px){ .card .time-label{ flex:0 0 auto; max-width:none; margin-right:auto; } }
@media (max-width:520px){
  .card .player{ gap:6px; padding:6px; }
  .card .time-label{ padding:4px 8px; font-size:.7rem; }
  .card .play-btn{ width:34px; height:34px; }
  .card .demo-download-btn{ width:28px; height:28px; }
  .card .player > .fav-heart{ width:26px; height:26px; }
}
@media (max-width:480px){ .card-photo{ flex-basis:96px; } }
.tag-row-more{ border-bottom:none; text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1px; }

/* Logo ekolayzer maskesi: header zemini (surface) ile aynı renk olmalı */
.site-header .brand-bar-mask{ background:var(--surface); }

/* İletişim: adres, harita, form hata mesajları */
.contact-row address.contact-address{ font-style:normal; font-size:.95rem; color:var(--ink); font-weight:600; line-height:1.5; }
.contact-row a.contact-map-link{ display:inline-flex; margin-top:6px; font-size:.82rem; color:var(--orange-ink); font-weight:700; }
.contact-map{ margin-top:14px; border:1px solid var(--line); border-radius:var(--radius-btn, 12px); overflow:hidden; aspect-ratio:16 / 10; background:var(--surface-2); }
.contact-map iframe{ display:block; width:100%; height:100%; border:0; }
.form-err{ display:block; margin-top:6px; font-size:.78rem; font-weight:600; color:#c0392b; }
:root[data-theme="dark"] .form-err{ color:#ff8a7a; }
.form-row input[aria-invalid="true"], .form-row textarea[aria-invalid="true"]{ border-color:#c0392b; }
.form-note.is-ok{ color:var(--ink); font-weight:600; border-left:3px solid #25d366; padding-left:10px; }

/* Ana sayfa: arama kutusu favorilerin altında, aynı kart tarzında */
.home-side-col{ display:grid; gap:24px; align-content:start; min-width:0; }
.home-search-fav-row .home-side-col .fav-home-panel{ margin-bottom:0; }
@media (max-width:979px){ .home-side-col{ margin-bottom:32px; } }
.home-search-panel .fav-home-head{ margin-bottom:14px; }
.home-search-panel .search-card{
  max-width:none; margin:0; padding:6px; gap:6px; flex-wrap:nowrap;
  background:var(--surface-2); border:1px solid var(--line); border-radius:14px; box-shadow:none;
}
.home-search-panel .search-card:focus-within{ border-color:var(--navy); box-shadow:0 0 0 3px color-mix(in srgb, var(--navy) 15%, transparent); }
.home-search-panel .search-card input[type="text"]{ color:var(--ink); padding:10px 12px; font-size:.95rem; flex:1 1 auto; min-width:0; }
.home-search-panel .search-card input::placeholder{ color:var(--ink-faint); }
.home-search-panel .search-submit{ border-radius:10px; padding:10px 16px; flex:none; }

/* Ana sayfa: filtre kartı sağ sütunla aynı yükseklikte, boşluk kalmasın */
@media (min-width:980px){
  .home-search-fav-row .filters:not(.search-collapsed){ align-self:stretch; display:flex; flex-direction:column; }
  .home-search-fav-row .filters:not(.search-collapsed) .filters-body{ flex:1 1 auto; }
  .home-search-fav-row .home-side-col{ align-self:stretch; grid-template-rows:auto 1fr; }
}

  /* ---------- Sesini Bul (vl): sade, gerçek ses önizlemesi ---------- */
  .ai-modal-panel.vl{ max-width:1040px; padding:36px 28px 28px; }
  @media (min-width:640px){ .ai-modal-panel.vl{ padding:44px 44px 40px; } }
  .vl-head{ max-width:62ch; margin-bottom:26px; padding-right:40px; }
  .vl-kicker{ display:block; font-family:'IBM Plex Mono',monospace; font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--orange-ink,#ae4e16); margin-bottom:10px; }
  .vl-head h2{ font-family:'Archivo',sans-serif; font-weight:800; font-size:clamp(1.5rem,2.8vw,2.1rem); line-height:1.1; letter-spacing:-.02em; margin:0 0 10px; color:var(--ink); }
  .vl-head p{ margin:0; color:var(--ink-soft); line-height:1.6; font-size:.95rem; }
  .vl-grid{ display:grid; grid-template-columns:1fr; border:1px solid var(--line); border-radius:22px; overflow:clip; background:var(--surface); }
  @media (min-width:900px){ .vl-grid{ grid-template-columns:1.25fr .9fr; } }
  .vl-form{ padding:24px; display:flex; flex-direction:column; gap:24px; }
  @media (min-width:640px){ .vl-form{ padding:28px; } }
  .vl-step-h{ display:flex; align-items:center; gap:10px; margin-bottom:12px; }
  .vl-step-h h3{ margin:0; font-family:'Archivo',sans-serif; font-size:.9rem; font-weight:700; color:var(--ink); }
  .vl-num{ font-family:'IBM Plex Mono',monospace; font-size:.72rem; color:var(--ink-faint); letter-spacing:.08em; }
  .vl-seg{ margin-left:auto; display:inline-flex; border:1px solid var(--line); border-radius:999px; padding:2px; background:var(--surface-2); }
  .vl-seg button{ border:none; background:transparent; color:var(--ink-soft); font:inherit; font-size:.76rem; font-weight:600; padding:5px 11px; border-radius:999px; cursor:pointer; }
  .vl-seg button.on{ background:var(--surface); color:var(--ink); box-shadow:0 1px 2px rgba(0,0,0,.08); }
  .vl-search{ display:flex; gap:8px; margin-bottom:12px; }
  .vl-search-box{ flex:1 1 auto; display:flex; align-items:center; gap:8px; border:1.5px solid var(--line); background:var(--surface-2); border-radius:12px; padding:0 12px; color:var(--ink-faint); min-width:0; }
  .vl-search-box:focus-within{ border-color:var(--navy); color:var(--navy); }
  .vl-search-box input{ flex:1; min-width:0; border:none; background:transparent; font:inherit; font-size:.9rem; color:var(--ink); padding:10px 0; outline:none; }
  .vl-search-box input::-webkit-search-cancel-button{ -webkit-appearance:none; }
  .vl-search-btn{ border:1.5px solid var(--navy); background:var(--navy); color:#fff; border-radius:12px; padding:0 16px; font:inherit; font-size:.84rem; font-weight:700; cursor:pointer; }
  .vl-search-btn:hover{ background:var(--navy-ink,#06224e); }
  .vl-shuffle{ display:inline-flex; align-items:center; gap:6px; border:1.5px solid var(--line); background:var(--surface); color:var(--ink-soft); border-radius:12px; padding:0 12px; font:inherit; font-size:.82rem; font-weight:600; cursor:pointer; white-space:nowrap; }
  .vl-shuffle:hover{ border-color:var(--navy); color:var(--navy); }
  .vl-artists{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
  .vl-artist{ display:flex; flex-direction:column; align-items:center; gap:8px; padding:12px 8px 10px; border:1.5px solid var(--line); background:var(--surface-2); border-radius:16px; cursor:pointer; text-align:center; transition:border-color .15s ease, background .15s ease, transform .15s ease; min-width:0; }
  .vl-artist img{ width:72px; height:72px; border-radius:50%; object-fit:cover; object-position:50% 18%; flex:0 0 auto; background:var(--navy-deep,#071c3d); }
  .vl-avatar{ width:72px; height:72px; border-radius:50%; background:var(--navy); color:#fff; display:flex; align-items:center; justify-content:center; font-family:'Archivo',sans-serif; font-weight:800; font-style:normal; font-size:1.25rem; letter-spacing:.02em; flex:0 0 auto; }
  .vl-artist span{ font-size:.8rem; font-weight:600; color:var(--ink); line-height:1.2; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
  .vl-artist:hover{ border-color:var(--navy); transform:translateY(-1px); }
  .vl-artist.on{ border-color:var(--navy); background:var(--navy-soft); box-shadow:0 0 0 1px var(--navy) inset; }
  .vl-artist[hidden]{ display:none; }
  .vl-hint{ margin:10px 0 0; font-size:.76rem; color:var(--ink-faint); }
  .vl-hint b{ color:var(--ink-soft); font-weight:600; }
  .vl-muted{ grid-column:1/-1; font-size:.82rem; color:var(--ink-faint); padding:10px 2px; }
  .vl-tones{ display:flex; flex-wrap:wrap; gap:8px; }
  .vl-tone{ border:1.5px solid var(--line); background:var(--surface-2); color:var(--ink-soft); border-radius:999px; padding:8px 14px; font:inherit; font-size:.8rem; font-weight:600; cursor:pointer; transition:.15s ease; }
  .vl-tone:hover{ border-color:var(--navy); color:var(--ink); }
  .vl-tone.on{ border-color:var(--navy); background:var(--navy); color:#fff; }
  .vl-step-sub{ margin-left:auto; font-size:.76rem; font-weight:600; color:var(--ink-faint); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:55%; }
  .vl-orig{ margin-top:10px; }
  .vl-orig[hidden]{ display:none; }
  .vl-orig-btn{ display:inline-flex; align-items:center; gap:7px; border:1px dashed var(--line); background:transparent; color:var(--ink-soft); border-radius:999px; padding:6px 13px; font:inherit; font-size:.78rem; font-weight:600; cursor:pointer; }
  .vl-orig-btn:hover{ border-color:var(--navy); color:var(--navy); }
  .vl-orig-btn.on{ border-style:solid; border-color:var(--orange); color:var(--orange-ink,#ae4e16); }
  .vl-count{ margin-left:auto; font-family:'IBM Plex Mono',monospace; font-size:.74rem; color:var(--ink-faint); }
  .vl-count.over{ color:var(--orange-ink,#ae4e16); }
  .vl-text{ width:100%; resize:vertical; min-height:88px; border-radius:14px; border:1.5px solid var(--line); background:var(--surface-2); padding:12px 14px; font-family:inherit; font-size:.92rem; line-height:1.5; color:var(--ink); }
  .vl-text:focus{ outline:2px solid var(--navy); outline-offset:1px; }
  .vl-samples{ display:flex; gap:6px; flex-wrap:wrap; margin-top:8px; }
  .vl-samples button{ font:inherit; font-size:.72rem; font-weight:600; color:var(--ink-soft); background:transparent; border:1px dashed var(--line); border-radius:999px; padding:5px 11px; cursor:pointer; }
  .vl-samples button:hover{ border-color:var(--navy); color:var(--navy); }
  .vl-samples .vl-random{ border-style:solid; color:var(--navy); display:inline-flex; align-items:center; }
  .vl-over{ margin:10px 0 0; font-size:.82rem; line-height:1.5; color:var(--orange-ink,#ae4e16); }
  .vl-actions{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
  .vl-go{ flex:1 1 180px; border:none; background:var(--navy); color:#fff; border-radius:14px; padding:15px 22px; font:inherit; font-weight:700; font-size:.95rem; cursor:pointer; transition:.15s ease; }
  .vl-go:hover{ background:var(--navy-ink,#06224e); }
  .vl-go:disabled{ opacity:.45; cursor:not-allowed; }
  .vl-go[hidden]{ display:none; }
  .vl-wa{ flex:1 1 180px; display:inline-flex; align-items:center; justify-content:center; gap:8px; border:1.5px solid var(--line); background:var(--surface); color:var(--ink); border-radius:14px; padding:13px 18px; font-weight:700; font-size:.88rem; text-decoration:none; transition:.15s ease; }
  .vl-wa svg{ width:18px; height:18px; color:#25D366; }
  .vl-wa:hover{ border-color:#25D366; color:#128C4A; }
  .vl-wa.solid{ background:#25D366; border-color:#25D366; color:#fff; }
  .vl-wa.solid svg{ color:#fff; }
  .vl-wa.solid:hover{ background:#1fb858; }
  .vl-wa[hidden]{ display:none; }
  .vl-ready .vl-wa, #vlError .vl-wa{ flex:0 0 auto; }
  #vlError .vl-wa{ display:inline-flex; }
  .vl-result{ background:var(--surface-2); border-top:1px solid var(--line); padding:28px 24px; display:flex; flex-direction:column; justify-content:center; min-height:260px; }
  @media (min-width:900px){ .vl-result{ border-top:none; border-left:1px solid var(--line); } }
  .vl-state[hidden]{ display:none; }
  #vlEmpty, #vlLoading, #vlError{ text-align:center; color:var(--ink-faint); font-size:.88rem; line-height:1.55; }
  #vlError p{ color:var(--ink-soft); margin:0 0 14px; }
  #vlLoading p{ margin:0; color:var(--ink-soft); font-weight:600; }
  .vl-ready{ display:flex; flex-direction:column; gap:16px; }
  .vl-ready-top{ display:flex; align-items:center; gap:12px; }
  .vl-ready-top img[hidden]{ display:none; }
  .vl-ready-top img{ width:48px; height:48px; border-radius:14px; object-fit:cover; object-position:50% 20%; background:var(--navy-deep,#071c3d); }
  .vl-ready-top b{ display:block; font-family:'Archivo',sans-serif; font-size:.98rem; font-weight:700; color:var(--ink); }
  .vl-ready-top span{ font-size:.78rem; color:var(--ink-faint); font-weight:600; }
  .vl-player{ display:flex; align-items:center; gap:12px; background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:10px 14px 10px 10px; }
  .vl-play{ width:42px; height:42px; border-radius:50%; border:none; background:var(--navy); color:#fff; display:flex; align-items:center; justify-content:center; cursor:pointer; flex:0 0 auto; }
  .vl-play svg{ width:20px; height:20px; }
  .vl-play:hover{ background:var(--navy-ink,#06224e); }
  .vl-bar{ flex:1; height:6px; border-radius:3px; background:var(--line); overflow:hidden; cursor:pointer; }
  .vl-bar i{ display:block; height:100%; width:0; background:var(--orange); transition:width .1s linear; }
  .vl-time{ font-family:'IBM Plex Mono',monospace; font-size:.76rem; color:var(--ink-faint); white-space:nowrap; }
  .vl-note{ margin:0; font-size:.78rem; line-height:1.5; color:var(--ink-faint); }
  .vl-result.playing .vl-bar i{ background:var(--orange); }
  :root[data-theme="dark"] .vl-seg button.on{ box-shadow:none; }
  @media (max-width:640px){
    .vl-artists{ gap:6px; }
    .vl-artist{ padding:9px 5px 8px; gap:6px; border-radius:12px; }
    .vl-artist img, .vl-avatar{ width:52px; height:52px; }
    .vl-avatar{ font-size:1rem; }
    .vl-artist span{ font-size:.72rem; }
    .vl-search{ flex-wrap:wrap; }
    .vl-search-box{ flex:1 1 100%; }
    .vl-search-btn, .vl-shuffle{ flex:1 1 0; justify-content:center; padding:9px 10px; }
    .vl-head{ padding-right:30px; }
  }

/* ---------- Favori sepeti (+), kart yapay zeka kısayolu (4 Kasım 2026) ---------- */
/* kart: ✦ yapay zeka butonu (indirme butonunun solunda, aynı görünüm) */
.card-ai-btn{
  flex:0 0 auto; width:32px; height:32px; border-radius:50%; border:1px solid var(--line); background:var(--surface);
  color:var(--orange-ink,#ae4e16); cursor:pointer; display:flex; align-items:center; justify-content:center; transition:.15s ease; padding:0;
}
.card-ai-btn svg{ width:14px; height:14px; }
.card-ai-btn:hover{ background:var(--orange); border-color:var(--orange); color:#fff; }
@media (max-width:520px){ .card-ai-btn{ width:30px; height:30px; } }
/* kart: + / ✓ favori */
.fav-heart .ic-check{ display:none; }
.fav-heart.active .ic-plus{ display:none; }
.fav-heart.active .ic-check{ display:block; }
.fav-heart.active svg{ fill:none; }
.player > .fav-heart{ width:32px; height:32px; border:1px solid var(--line); border-radius:50%; color:var(--ink-soft); }
.player > .fav-heart:hover{ color:var(--navy); border-color:var(--navy); background:var(--navy-soft); }
.player > .fav-heart.active{ color:#fff; border-color:var(--navy); background:var(--navy); }
.player > .fav-heart svg{ width:15px; height:15px; }
@media (max-width:520px){ .player > .fav-heart{ width:30px; height:30px; } }
/* header: + favori sepeti ve sayaç (kulakçık) */
.fav-cart{
  position:relative; flex:0 0 auto; display:flex; align-items:center; justify-content:center; padding:0;
  width:38px; height:38px; border-radius:50%; border:1px solid var(--line); background:var(--surface); color:var(--ink-soft); cursor:pointer; margin-left:4px; transition:.15s ease;
}
.fav-cart svg{ width:18px; height:18px; }
.fav-cart:hover{ border-color:var(--navy); color:var(--navy); background:var(--navy-soft); }
.fav-cart-count{
  position:absolute; top:-8px; right:-8px; min-width:19px; height:19px; padding:0 5px; border-radius:999px;
  background:var(--orange); color:#fff; font-family:'IBM Plex Mono',monospace; font-size:.68rem; font-weight:700; line-height:19px; text-align:center;
  box-shadow:0 0 0 2px var(--surface); pointer-events:none;
}
.fav-cart[data-n="0"] .fav-cart-count{ display:none; }
.fav-cart:not([data-n="0"]){ color:var(--navy); border-color:var(--navy); background:var(--navy-soft); }
.fav-cart.bump .fav-cart-count{ animation:favBump .45s ease; }
@keyframes favBump{ 0%{ transform:scale(1); } 35%{ transform:scale(1.45); } 100%{ transform:scale(1); } }
@media (prefers-reduced-motion:reduce){ .fav-cart.bump .fav-cart-count{ animation:none; } }
/* mobil: tema düğmesi hamburger menüye taşınır, yerine + sepet */
.mobile-theme{ display:none; }
@media (max-width:979px){
  .header-actions > .theme-toggle{ display:none; }
  .fav-cart{ margin-left:0; }
  .mobile-theme{
    display:flex; align-items:center; gap:10px; width:100%; padding:14px 4px; border:none; border-bottom:1px solid var(--line-soft);
    background:transparent; color:var(--ink-soft); font:inherit; font-weight:600; cursor:pointer; text-align:left;
  }
  .mobile-theme svg{ width:18px; height:18px; }
  .mobile-theme:hover{ color:var(--navy); }
}
@media (max-width:420px){ .fav-cart-count{ top:-6px; right:-6px; min-width:17px; height:17px; line-height:17px; } }
/* favoriler paneli: mod satırı, yapay zeka denemesi, WhatsApp ile gönder */
.fav-item-mode{ display:block; margin:-4px 0 8px; font-size:.78rem; color:var(--ink-faint); font-weight:600; }
.fav-item-ai{ margin-left:6px; color:var(--orange-ink,#ae4e16); text-decoration:none; font-weight:700; }
.fav-item-ai:hover{ text-decoration:underline; }
.fav-wa-row{ flex:0 0 auto; padding:12px 18px 0; }
.fav-wa-send{
  display:flex; align-items:center; justify-content:center; gap:8px; width:100%; padding:12px 14px; border-radius:12px;
  background:#25D366; color:#fff; font-weight:700; font-size:.88rem; text-decoration:none; transition:background .15s ease;
}
.fav-wa-send:hover{ background:#1fb858; }
/* yapay zeka sonucu: favorilere ekle */
.vl-addfav{
  display:inline-flex; align-items:center; justify-content:center; gap:8px; border:1.5px solid var(--line); background:var(--surface);
  color:var(--ink); border-radius:14px; padding:12px 18px; font:inherit; font-weight:700; font-size:.88rem; cursor:pointer; transition:.15s ease;
}
.vl-addfav:hover{ border-color:var(--navy); color:var(--navy); }
.vl-addfav.on{ background:var(--navy-soft); border-color:var(--navy); color:var(--navy); }
.vl-addfav[hidden]{ display:none; }
.artist-fav-btn .ic-check{ display:none; }
.artist-fav-btn.active .ic-plus{ display:none; }
.artist-fav-btn.active .ic-check{ display:inline-block; }
.artist-fav-btn.active svg{ fill:none; }
/* mobil taşma düzeltmesi: yan sütun (favoriler + ses ara) içeriğe göre genişleyip ekranı aşmasın */
.home-side-col{ grid-template-columns:minmax(0, 1fr); }
.home-side-col > *{ min-width:0; max-width:100%; }
.home-search-panel .search-card{ min-width:0; max-width:100%; }
.home-search-panel .search-card input[type="text"]{ width:100%; }
@media (max-width:359px){
  .header-actions{ gap:4px; }
  .header-actions > .ai-shortcut, .header-actions > .lang-switch, .header-actions > .nav-toggle, .header-actions > .fav-cart{ width:34px; height:34px; }
}
/* ---- mobil kart oynatıcısı: iki satır, tüm ikonlar görünür ve dokunulabilir ----
   (kart gövdesi dar olduğunda — telefon ve tablet) 1. satır: oynat + mod seçimi · 2. satır: demo sayısı + ✦ yapay zeka + indir + favori */
#cardGrid .card .card-body{ container: gicard / inline-size; }
@container gicard (max-width: 430px){
  #cardGrid .card .player{ flex-wrap:wrap; column-gap:6px; row-gap:8px; padding:8px; overflow:visible; }
  #cardGrid .card .player .mini-wave{ display:none; }
  #cardGrid .card .player .play-btn{ order:1; width:36px; height:36px; flex:0 0 36px; }
  #cardGrid .card .player .variant-select{ display:block; order:2; flex:1 1 calc(100% - 42px); min-width:0; max-width:none; height:36px; font-size:.78rem; }
  #cardGrid .card .player .time-label{ order:3; flex:1 1 0; min-width:0; max-width:none; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; padding:5px 8px; font-size:.72rem; }
  #cardGrid .card .player .card-ai-btn{ order:4; }
  #cardGrid .card .player .demo-download-btn{ order:5; }
  #cardGrid .card .player > .fav-heart{ order:6; }
  #cardGrid .card .player .card-ai-btn,
  #cardGrid .card .player .demo-download-btn,
  #cardGrid .card .player > .fav-heart{ width:32px; height:32px; flex:0 0 32px; }
}
@container gicard (max-width: 210px){
  #cardGrid .card .player .time-label{ display:none; }
  #cardGrid .card .player .card-ai-btn{ margin-left:auto; }
}
@container gicard (max-width: 150px){
  #cardGrid .card .player{ column-gap:4px; padding:6px; }
  #cardGrid .card .player .card-ai-btn, #cardGrid .card .player .demo-download-btn, #cardGrid .card .player > .fav-heart{ width:30px; height:30px; flex-basis:30px; }
}
/* akıllı arama: "Bunu mu demek istediniz?" */
.search-suggest{ display:flex; flex-wrap:wrap; align-items:center; gap:6px 8px; margin:0 0 16px; padding:12px 16px; border:1px solid var(--line); border-left:3px solid var(--orange); border-radius:14px; background:var(--surface); font-size:.9rem; color:var(--ink-soft); }
.search-suggest[hidden]{ display:none; }
.search-suggest > span:first-child{ color:var(--ink); font-weight:600; }
.search-suggest-btn{ border:1px solid var(--navy); background:var(--navy-soft); color:var(--navy); border-radius:999px; padding:5px 12px; font:inherit; font-size:.85rem; font-weight:700; cursor:pointer; }
.search-suggest-btn:hover{ background:var(--navy); color:#fff; }
.search-suggest-note{ flex-basis:100%; font-size:.78rem; color:var(--ink-faint); }

@media (max-width:520px){ .artist-modal-actions{ display:grid; grid-template-columns:minmax(0,1fr); } .artist-modal-actions > *{ justify-content:center; width:100%; } }

/* süsleme amaçlı baş harf rozetleri: harfler CSS ile basılır (ekran okuyucuya ad zaten bağlantı metninde gider) */
.related-card .mini-avatar[data-i]::before{ content:attr(data-i); }

/* ---- çerez onay bandı (KVKK / Google Consent Mode) ---- */
.cookie-bar{ position:fixed; left:16px; right:16px; bottom:16px; z-index:80; max-width:760px; margin-inline:auto;
  display:flex; align-items:center; gap:16px 20px; flex-wrap:wrap; padding:16px 18px;
  background:var(--surface); color:var(--ink); border:1px solid var(--line); border-radius:16px;
  box-shadow:0 18px 40px -18px rgba(7,28,61,.45); font-size:.88rem; line-height:1.5; }
.cookie-bar[hidden]{ display:none; }
.cookie-bar p{ margin:0; flex:1 1 320px; color:var(--ink-soft); }
.cookie-bar-btns{ display:flex; gap:10px; flex:0 0 auto; }
.cookie-btn{ font:inherit; font-weight:700; font-size:.84rem; padding:10px 18px; border-radius:999px; cursor:pointer;
  border:1px solid var(--ink); background:transparent; color:var(--ink); white-space:nowrap; }
.cookie-btn:hover{ background:var(--ink); color:var(--surface); }
.cookie-btn-ok{ background:var(--navy); border-color:var(--navy); color:#fff; }
.cookie-btn-ok:hover{ background:var(--ink); border-color:var(--ink); color:var(--surface); }
.cookie-btn:focus-visible, .cookie-pref-link:focus-visible{ outline:2px solid var(--orange-ink); outline-offset:2px; }
@media (max-width:520px){ .cookie-bar{ left:10px; right:10px; bottom:10px; } .cookie-bar-btns{ width:100%; } .cookie-btn{ flex:1; } }
.cookie-pref-link{ background:none; border:0; padding:0; font:inherit; font-size:inherit; color:inherit; cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
.cookie-pref-link:hover{ color:var(--navy); }
:root[data-theme="dark"] .cookie-btn-ok{ background:var(--ink); border-color:var(--ink); color:var(--surface); }
/* alt bilgi sütun başlıkları h4 → h2 (başlık sırası); görünüm h4 ile birebir aynı kalsın */
.footer-col h2.footer-h{ margin:1.33em 0 12px; text-wrap:wrap; }

/* ---- favori listesi: sıra numarası CSS ile basılır (kopyalanan metne girmez); boş mod satırı yer kaplamaz ---- */
.fav-list, .fav-home-list{ counter-reset: fav; }
.fav-item{ counter-increment: fav; }
.fav-item-name::before{ content: counter(fav) ". "; color:var(--navy); font-weight:800; margin-right:4px; }
.fav-item-mode:empty{ display:none; }

/* ---- sanatçı sayfası: e-posta ile teklif al ---- */
.artist-quote-btn{ display:inline-flex; align-items:center; gap:8px; padding:11px 18px; border-radius:var(--radius-chip); background:var(--navy); color:#fff; border:1px solid var(--navy); font-weight:700; font-size:.84rem; text-decoration:none; white-space:nowrap; transition:background .15s ease, transform .1s ease; }
.artist-quote-btn svg{ width:17px; height:17px; flex:none; }
.artist-quote-btn:hover{ background:var(--ink); border-color:var(--ink); color:#fff; }
.artist-quote-btn:active{ transform:translateY(1px); }
.artist-quote-btn:focus-visible{ outline:2px solid var(--orange-ink); outline-offset:3px; }
:root[data-theme="dark"] .artist-quote-btn{ background:var(--ink); border-color:var(--ink); color:var(--surface); }
:root[data-theme="dark"] .artist-quote-btn:hover{ background:var(--navy); border-color:var(--navy); color:#fff; }

/* ---- iletişim: ekip e-postaları ---- */
.contact-mails{ display:flex; flex-direction:column; gap:6px; }
.contact-mail{ display:flex; flex-wrap:wrap; align-items:baseline; gap:2px 10px; font-weight:600; }
.contact-mail .cm-name{ color:var(--ink); }
.contact-mail .cm-name em{ font-style:normal; font-weight:600; font-size:.74rem; color:var(--orange-ink); text-transform:uppercase; letter-spacing:.06em; margin-left:4px; }
.contact-mail .cm-addr{ color:var(--navy); font-weight:600; font-size:.9rem; }
.contact-mail:hover .cm-addr{ text-decoration:underline; }

/* ---- sanatçı sayfası: yer aldığı işler ---- */
.artist-works{ margin-top:44px; }
.artist-works-head{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; flex-wrap:wrap; margin:0 0 14px; }
.artist-works-head h2{ font-family:var(--font-mono); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-faint); margin:0; }
.artist-works-all{ font-size:.82rem; font-weight:700; color:var(--navy); }
.artist-works-all:hover{ text-decoration:underline; }
.artist-works-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:14px; }
.aw-card{ display:flex; flex-direction:column; background:var(--surface); border:1px solid var(--line); border-radius:14px; overflow:hidden; color:inherit; text-decoration:none; transition:border-color .15s ease, transform .15s ease; }
.aw-card:hover{ border-color:var(--navy); transform:translateY(-2px); }
.aw-thumb{ position:relative; display:block; aspect-ratio:16/9; background:linear-gradient(135deg, var(--navy), #071c3d); overflow:hidden; }
.aw-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.aw-play{ position:absolute; left:50%; top:50%; width:38px; height:38px; margin:-19px 0 0 -19px; border-radius:50%; background:rgba(255,255,255,.92); color:var(--navy); display:flex; align-items:center; justify-content:center; box-shadow:0 6px 18px -6px rgba(0,0,0,.5); }
.aw-play svg{ width:18px; height:18px; }
.aw-body{ display:flex; flex-direction:column; gap:3px; padding:10px 12px 12px; }
.aw-title{ font-weight:700; font-size:.86rem; line-height:1.3; color:var(--ink); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.aw-meta{ font-family:var(--font-mono); font-size:.7rem; letter-spacing:.06em; color:var(--ink-faint); text-transform:uppercase; }
@media (max-width:520px){ .artist-works-grid{ grid-template-columns:1fr 1fr; gap:10px; } .aw-body{ padding:8px 10px 10px; } .aw-title{ font-size:.8rem; } }
/* favori listesi: e-posta ile gönder (WhatsApp yeşili yerine lacivert) */
.fav-wa-send.fav-mail-send{ background:var(--navy); }
.fav-wa-send.fav-mail-send:hover{ background:var(--ink); }
:root[data-theme="dark"] .fav-wa-send.fav-mail-send{ background:var(--ink); color:var(--surface); }

/* baş harf rozetleri CSS ile basılır (erişilebilirlik: süsleme metni) */
.card-photo[data-i]::before, .artist-modal-photo[data-i]::before{ content:attr(data-i); }

/* WhatsApp kaldırıldı (Kasım 2026): Sesini Bul e-posta bağlantıları lacivert */
.vl-wa svg{ color:var(--navy); }
.vl-wa:hover{ border-color:var(--navy); color:var(--navy); }
.vl-wa.solid{ background:var(--navy); border-color:var(--navy); color:#fff; }
.vl-wa.solid svg{ color:#fff; }
.vl-wa.solid:hover{ background:var(--ink); border-color:var(--ink); color:#fff; }
:root[data-theme="dark"] .vl-wa.solid{ background:var(--ink); border-color:var(--ink); color:var(--surface); }
:root[data-theme="dark"] .vl-wa.solid svg{ color:var(--surface); }

/* ---- Ana sayfa: son işler (YouTube + Instagram tek model) ---- */
.home-works{ margin:8px 0 34px; }
.hw-head-row{ display:flex; align-items:flex-end; justify-content:space-between; gap:20px; flex-wrap:wrap; margin-bottom:24px; }
.hw-kicker{ margin:0 0 8px; font-family:var(--font-mono); font-weight:500; letter-spacing:.16em; font-size:.72rem; text-transform:uppercase; color:#ad4912; }
:root[data-theme="dark"] .hw-kicker, :root[data-theme="dark"] .hw-brand{ color:#ff9d5c; }
.home-works h2{ margin:0; font-family:var(--font-display); font-stretch:87.5%; font-weight:800; font-size:clamp(1.7rem,3.4vw,2.5rem); letter-spacing:-.03em; line-height:1; color:var(--ink); }
.home-works h2 em{ font-style:normal; color:var(--navy); }
.hw-lead{ margin:10px 0 0; color:var(--ink-soft); max-width:56ch; line-height:1.55; font-size:.95rem; }
.hw-all{
  display:inline-flex; align-items:center; gap:8px; white-space:nowrap;
  font-weight:700; font-size:.9rem; color:var(--navy); text-decoration:none;
  padding:11px 18px; border:1.5px solid var(--navy); border-radius:999px; transition:background .15s ease, color .15s ease;
}
.hw-all svg{ width:16px; height:16px; }
.hw-all:hover{ background:var(--navy); color:#fff; }
.hw-grid{
  display:grid; grid-auto-flow:column; grid-auto-columns:calc((100% - 3 * 18px) / 4); gap:18px;
  overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x mandatory; scroll-behavior:smooth;
  padding:2px 2px 10px; margin:0 -2px; scrollbar-width:none;
}
.hw-grid::-webkit-scrollbar{ display:none; }
.hw-grid:focus-visible{ outline:2px solid var(--navy); outline-offset:4px; }
.hw-card{ scroll-snap-align:start; }
.hw-actions{ display:flex; align-items:center; gap:10px; }
.hw-nav{ display:inline-flex; gap:6px; }
.hw-nav button{
  width:40px; height:40px; border-radius:50%; border:1.5px solid var(--line); background:var(--surface); color:var(--ink);
  display:inline-flex; align-items:center; justify-content:center; cursor:pointer; transition:border-color .15s ease, background .15s ease, color .15s ease;
}
.hw-nav button svg{ width:18px; height:18px; }
.hw-nav button:hover{ border-color:var(--navy); color:var(--navy); }
.hw-nav button:disabled{ opacity:.35; cursor:default; }
@media (max-width:979px){ .hw-grid{ grid-auto-columns:calc((100% - 2 * 16px) / 3); gap:16px; } }
.hw-card{
  display:flex; flex-direction:column; text-decoration:none; color:inherit;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-card); overflow:hidden;
  transition:border-color .15s ease, transform .2s ease;
}
.hw-card:hover{ border-color:color-mix(in srgb, var(--navy) 45%, var(--line)); }
.hw-thumb{ position:relative; display:block; aspect-ratio:16/9; overflow:hidden; background:#0a1426; }
.hw-thumb img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s cubic-bezier(.2,.7,.2,1), filter .3s ease; }
.hw-card:hover .hw-thumb img{ transform:scale(1.04); filter:brightness(.78); }
.hw-noimg{ background:linear-gradient(135deg, var(--navy) 0%, #071c3d 100%); }
.hw-play{
  position:absolute; left:50%; top:50%; width:50px; height:50px; margin:-25px 0 0 -25px; border-radius:50%;
  background:var(--orange); color:#fff; display:flex; align-items:center; justify-content:center;
  opacity:0; transform:scale(.8); transition:opacity .25s ease, transform .25s ease;
}
.hw-play svg{ width:20px; height:20px; margin-left:3px; }
.hw-card:hover .hw-play, .hw-card:focus-visible .hw-play{ opacity:1; transform:none; }
.hw-date{
  position:absolute; left:10px; top:10px; padding:4px 9px; border-radius:999px;
  background:rgba(5,11,24,.72); color:#fff; backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
  font-family:var(--font-mono); font-weight:600; letter-spacing:.08em; font-size:.66rem;
}
.hw-body{ display:flex; flex-direction:column; gap:6px; padding:14px 16px 16px; flex:1; }
.hw-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; min-height:16px; }
.hw-brand{ font-family:var(--font-mono); font-weight:600; font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; color:#ad4912; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.hw-src{ display:inline-flex; width:15px; height:15px; color:var(--ink-faint); flex:0 0 auto; }
.hw-src svg{ width:15px; height:15px; }
.hw-title{ font-family:var(--font-display); font-stretch:87.5%; font-weight:800; font-size:.98rem; line-height:1.3; color:var(--ink); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.hw-artists{ display:flex; flex-wrap:wrap; gap:6px; margin-top:auto; padding-top:4px; }
.hw-artists span{ font-size:.76rem; font-weight:600; color:var(--navy); border:1px solid var(--line); padding:4px 9px; border-radius:999px; }
@media (max-width:640px){
  .home-works{ margin-top:44px; padding-top:30px; }
  .hw-grid{ grid-auto-columns:calc((100% - 12px) / 2); gap:12px; }
  .hw-nav{ display:none; }
  .hw-body{ padding:10px 12px 12px; }
  .hw-title{ font-size:.86rem; }
  .hw-artists{ display:none; }
  .hw-all{ padding:9px 14px; font-size:.84rem; }
}

/* ---- Tek filtre paneli: "Detaylı Arama" (Kasım 2026) ---- */
.filters-head{ display:flex; align-items:center; justify-content:space-between; padding:0 18px; border-bottom:1px solid var(--line); }
.filters-title{ margin:0; padding:16px 0 13px; font-family:var(--font-body); font-size:.9rem; font-weight:700; color:var(--ink); border-bottom:3px solid var(--orange); margin-bottom:-1px; }
.chip.chip-strong{ font-weight:800; color:var(--ink); border-color:color-mix(in srgb, var(--ink) 40%, var(--line)); }
.chip.chip-strong.active{ color:#fff; }
.chip[data-empty]{ color:var(--ink-faint); }

/* ---- Ses Ara altı: en çok işte imzası olan sesler ---- */
.top-voices{ margin-top:22px; padding-top:18px; border-top:1px solid var(--line); }
.top-voices-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; }
.tv-row{
  display:grid; grid-template-columns:44px 1fr; align-items:center; gap:12px;
  padding:8px 6px; margin:0 -6px; border-radius:12px; text-decoration:none; color:inherit;
  transition:background .15s ease;
}
.tv-row:hover, .tv-row:focus-visible{ background:var(--navy-soft, rgba(13,77,164,.08)); }
.tv-avatar{
  width:44px; height:44px; border-radius:50%; overflow:hidden; flex:0 0 auto;
  background:var(--navy); color:#fff; display:flex; align-items:center; justify-content:center;
  font-family:var(--font-display); font-weight:800; font-size:.9rem; letter-spacing:.02em;
}
.tv-avatar img{ width:100%; height:100%; object-fit:cover; object-position:50% 20%; display:block; }
.tv-avatar[data-i]::before{ content:attr(data-i); }
.tv-name{ font-weight:700; font-size:.92rem; color:var(--ink); line-height:1.25; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.tv-row:hover .tv-name{ color:var(--navy); }
@media (max-width:979px){ .top-voices-list{ display:grid; grid-template-columns:1fr 1fr; column-gap:14px; } }
@media (max-width:560px){ .top-voices-list{ grid-template-columns:1fr; } }

/* top-voices: 5'li sayfalar + oklar */
.top-voices{ margin-top:18px; padding-top:14px; }
.tv-track{ position:relative; }
.top-voices-list[hidden]{ display:none; }
.tv-nav{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:8px; padding-top:10px; border-top:1px solid var(--line); }
.tv-nav button{
  width:38px; height:38px; border-radius:50%; border:1.5px solid var(--line); background:var(--surface); color:var(--ink);
  display:inline-flex; align-items:center; justify-content:center; cursor:pointer; transition:border-color .15s ease, color .15s ease, opacity .15s ease;
}
.tv-nav button svg{ width:18px; height:18px; }
.tv-nav button:hover{ border-color:var(--navy); color:var(--navy); }
.tv-dots{ display:inline-flex; gap:6px; }
.tv-dots i{ width:6px; height:6px; border-radius:50%; background:var(--line-strong, var(--line)); transition:background .15s ease, transform .15s ease; }
.tv-dots i.on{ background:var(--navy); transform:scale(1.25); }
@media (max-width:979px){ .top-voices-list{ display:grid; grid-template-columns:1fr 1fr; column-gap:14px; } .top-voices-list[hidden]{ display:none; } }
@media (max-width:560px){ .top-voices-list{ grid-template-columns:1fr; } }

/* ---- Made by All Inn Agency — footer imzası (sitenin yazı tipini ve rengini devralır) ---- */
.footer-bottom .ai-sig{ flex:1 1 100%; display:block; margin:0; padding:6px 0 0; line-height:1; }
.ai-sig[data-align="center"]{ text-align:center }
.ai-sig[data-align="right"]{ text-align:right }
.ai-sig a.ai-sig__link{ all:unset; display:inline-flex; align-items:center; gap:6px; font-size:11px; line-height:1.2; font-weight:400; letter-spacing:.02em; text-transform:none; white-space:nowrap; color:inherit; opacity:.5; cursor:pointer; -webkit-tap-highlight-color:transparent; transition:opacity .25s ease; }
.ai-sig a.ai-sig__link:hover, .ai-sig a.ai-sig__link:focus-visible{ opacity:1 }
.ai-sig a.ai-sig__link:focus-visible{ outline:1px solid currentColor; outline-offset:4px; border-radius:2px }
.ai-sig svg.ai-sig__mark{ width:16px; height:16px; flex:none; display:block; fill:currentColor }
.ai-sig span.ai-sig__name{ font-weight:600 }
@media (prefers-reduced-motion:reduce){ .ai-sig a.ai-sig__link{ transition:none } }

/* ===== Sesini Bul — Motor 2 stüdyo bekleme ekranı ===== */
.vl-tries{ display:flex; align-items:center; gap:8px; margin:10px 0 0; font-size:.8rem; font-weight:600; color:var(--ink-soft); }
.vl-tries[hidden]{ display:none; }
.vl-tries .vl-dots{ display:inline-flex; gap:4px; }
.vl-tries .vl-dots i{ width:8px; height:8px; border-radius:50%; background:var(--line); }
.vl-tries .vl-dots i.on{ background:var(--orange); }
.vl-tries.none{ color:var(--ink-faint); }
#vlLoading:has(.vl-studio){ text-align:left; }
.vl-studio{
  position:relative; overflow:hidden; isolation:isolate; display:flex; flex-direction:column; align-items:center; gap:12px;
  padding:18px 18px 16px; border-radius:20px; color:#fff; text-align:center;
  background:radial-gradient(120% 90% at 50% 0%, #163d7a 0%, #0a1f45 55%, #061229 100%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);
}
.vl-studio::before{ content:""; position:absolute; inset:-40% -20% auto; height:70%; z-index:-1; background:radial-gradient(closest-side, rgba(243,117,43,.22), transparent 70%); animation:vlsGlow 4s ease-in-out infinite alternate; }
.vls-top{ align-self:stretch; display:flex; justify-content:space-between; align-items:center; }
.vls-onair{ display:inline-flex; align-items:center; gap:7px; padding:4px 10px 4px 8px; border-radius:6px; border:1px solid rgba(255,255,255,.18); font-family:'IBM Plex Mono',monospace; font-size:.68rem; font-weight:600; letter-spacing:.16em; color:rgba(255,255,255,.55); }
.vls-onair i{ width:8px; height:8px; border-radius:50%; background:#5a2a20; }
.vl-studio.rec .vls-onair{ color:#fff; border-color:#e5484d; background:rgba(229,72,77,.18); box-shadow:0 0 18px rgba(229,72,77,.35); }
.vl-studio.rec .vls-onair i{ background:#ff4d4f; box-shadow:0 0 8px #ff4d4f; animation:vlsBlink 1.1s steps(2,end) infinite; }
.vls-time{ font-family:'IBM Plex Mono',monospace; font-size:.78rem; color:rgba(255,255,255,.6); }
.vls-stage{ position:relative; width:132px; height:132px; display:grid; place-items:center; margin-top:2px; }
.vls-ring{ position:absolute; inset:14px; border-radius:50%; border:2px solid rgba(243,117,43,.55); animation:vlsRing 2.4s ease-out infinite; }
.vls-ring.r2{ animation-delay:.8s; } .vls-ring.r3{ animation-delay:1.6s; }
.vl-studio:not(.rec) .vls-ring{ border-color:rgba(120,170,255,.35); animation-duration:3.6s; }
.vls-ph{ position:relative; width:96px; height:96px; border-radius:50%; overflow:hidden; background:#0d2a57; box-shadow:0 0 0 4px rgba(255,255,255,.08), 0 12px 30px -10px rgba(0,0,0,.6); }
.vls-ph img{ width:100%; height:100%; object-fit:cover; object-position:50% 20%; display:block; }
.vls-ini{ display:grid; place-items:center; width:100%; height:100%; font-style:normal; font-weight:800; font-size:1.6rem; }
.vl-studio.rec .vls-ph{ animation:vlsBeat 1.6s ease-in-out infinite; }
.vls-mic{ position:absolute; right:12px; bottom:10px; width:34px; height:34px; border-radius:50%; display:grid; place-items:center; background:var(--orange); color:#fff; box-shadow:0 6px 16px -6px rgba(243,117,43,.9); }
.vls-mic svg{ width:18px; height:18px; }
.vls-who b{ display:block; font-family:'Archivo',sans-serif; font-size:1rem; font-weight:800; }
.vls-who span{ font-size:.76rem; color:rgba(255,255,255,.65); font-weight:600; }
.vls-eq{ display:flex; align-items:flex-end; gap:3px; height:34px; width:100%; max-width:240px; }
.vls-eq i{ flex:1; height:var(--h); border-radius:2px; background:linear-gradient(180deg, #ffb27a, var(--orange)); transform-origin:bottom; animation:vlsEq 1.1s ease-in-out var(--d) infinite alternate; opacity:.9; }
.vl-studio:not(.rec) .vls-eq i{ background:rgba(140,180,255,.45); animation-duration:2.2s; transform:scaleY(.25); }
.vls-step{ margin:2px 0 0; min-height:1.4em; font-size:.92rem; font-weight:700; color:#fff; }
.vls-step.in, .vls-tip.in{ animation:vlsIn .45s ease both; }
.vls-bar{ align-self:stretch; height:8px; border-radius:6px; background:rgba(255,255,255,.12); overflow:hidden; }
.vls-bar i{ display:block; height:100%; width:0; border-radius:inherit; background:linear-gradient(90deg, #f3752b, #ffb27a, #f3752b); background-size:200% 100%; animation:vlsShine 1.6s linear infinite; transition:width .3s ease; }
.vls-meta{ align-self:stretch; display:flex; justify-content:space-between; font-family:'IBM Plex Mono',monospace; font-size:.72rem; color:rgba(255,255,255,.65); }
.vls-note{ margin:0; font-size:.78rem; line-height:1.5; color:rgba(255,255,255,.78); max-width:34ch; }
.vls-tip{ margin:0; padding:9px 12px; border-radius:12px; background:rgba(255,255,255,.07); font-size:.76rem; line-height:1.5; color:rgba(255,255,255,.82); min-height:3.1em; align-self:stretch; }
.vls-orig{ border:1px solid rgba(255,255,255,.3); background:transparent; color:#fff; border-radius:999px; padding:8px 14px; font:inherit; font-size:.78rem; font-weight:700; cursor:pointer; transition:background .15s, border-color .15s; }
.vls-orig:hover, .vls-orig.on{ background:rgba(255,255,255,.12); border-color:#fff; }
@keyframes vlsRing{ 0%{ transform:scale(.85); opacity:.9 } 100%{ transform:scale(1.35); opacity:0 } }
@keyframes vlsBeat{ 0%,100%{ transform:scale(1) } 50%{ transform:scale(1.04) } }
@keyframes vlsEq{ 0%{ transform:scaleY(.18) } 100%{ transform:scaleY(1) } }
@keyframes vlsBlink{ 50%{ opacity:.25 } }
@keyframes vlsShine{ to{ background-position:-200% 0 } }
@keyframes vlsGlow{ to{ transform:translateY(12%) scale(1.1); opacity:.7 } }
@keyframes vlsIn{ from{ opacity:0; transform:translateY(6px) } to{ opacity:1; transform:none } }
@media (prefers-reduced-motion:reduce){ .vl-studio *, .vl-studio::before{ animation:none !important; } .vls-eq i{ transform:scaleY(.6); } }
#vlLoading .vl-studio .vls-step{ color:#fff; font-weight:700; margin:2px 0 0; }
#vlLoading .vl-studio .vls-note{ color:rgba(255,255,255,.78); font-weight:500; }
#vlLoading .vl-studio .vls-tip{ color:rgba(255,255,255,.85); font-weight:500; }

/* ---- Sesini Bul: ziyaretçinin ürettiği sesler (30 gün, tarayıcıda) ---- */
.vl-hist{ margin-top:18px; padding-top:14px; border-top:1px solid var(--line); }
.vl-hist[hidden]{ display:none; }
.vl-hist-h{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-bottom:8px; }
.vl-hist-h b{ font-family:'Archivo',sans-serif; font-size:.9rem; color:var(--ink); }
.vl-hist-h span{ font-size:.72rem; color:var(--ink-faint); }
.vl-hist ul{ list-style:none; margin:0; padding:0; display:grid; gap:6px; max-height:260px; overflow:auto; }
.vl-hist li{ display:grid; grid-template-columns:36px 1fr auto auto; align-items:center; gap:10px; padding:8px 8px 8px 6px; border:1px solid var(--line); border-radius:12px; background:var(--surface); }
.vl-hist li.on{ border-color:var(--navy); background:var(--navy-soft, rgba(13,77,164,.06)); }
.vl-hist-play{ width:34px; height:34px; border-radius:50%; border:none; background:var(--navy); color:#fff; display:grid; place-items:center; cursor:pointer; }
.vl-hist-play svg{ width:15px; height:15px; margin-left:2px; }
.vl-hist-t{ min-width:0; display:flex; flex-direction:column; gap:1px; }
.vl-hist-t b{ font-size:.82rem; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.vl-hist-t em{ font-style:normal; font-size:.7rem; color:var(--ink-faint); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.vl-hist-t q{ font-size:.74rem; color:var(--ink-soft); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; quotes:"“" "”"; }
.vl-hist-dl, .vl-hist-del{ width:30px; height:30px; border-radius:50%; display:grid; place-items:center; border:1px solid var(--line); background:transparent; color:var(--ink-soft); cursor:pointer; }
.vl-hist-dl svg, .vl-hist-del svg{ width:14px; height:14px; }
.vl-hist-dl:hover, .vl-hist-del:hover{ border-color:var(--navy); color:var(--navy); }

/* ===== Ana sayfa: sanatçılar 2 sütun + sağda hep duran favoriler + yapışkan "Ses ara" şeridi (müşteri revizesi, 13 Kasım) ===== */
.home-results{ display:grid; grid-template-columns:minmax(0,1fr); gap:24px; align-items:start; }
.home-results-main{ min-width:0; }
.home-fav-aside{ min-width:0; }
.home-fav-aside .fav-home-panel{ margin:0; display:flex; flex-direction:column; }
.home-fav-aside .fav-home-list{ grid-template-columns:minmax(0,1fr); gap:8px; overflow:auto; overscroll-behavior:contain; scrollbar-width:thin; padding-right:2px; }
@media (min-width:980px){
  .home-results{ grid-template-columns:minmax(0,1fr) 320px; }
  .home-results-main .grid{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .home-fav-aside{ position:sticky; top:calc(var(--gi-head, 74px) + 78px); }
  .home-fav-aside .fav-home-panel{ max-height:calc(100vh - var(--gi-head, 74px) - 98px); max-height:calc(100dvh - var(--gi-head, 74px) - 98px); }
  .home-fav-aside .fav-home-list{ flex:1 1 auto; min-height:0; }
}
@media (min-width:1200px){ .home-results{ grid-template-columns:minmax(0,1fr) 340px; } }
@media (max-width:979px){
  .home-fav-aside{ order:-1; }
  .home-fav-aside .fav-home-list{ max-height:300px; }
}

.search-strip{
  position:fixed; left:0; right:0; top:var(--gi-head, 74px); z-index:45;
  background:color-mix(in srgb, var(--surface) 94%, transparent); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line); box-shadow:0 10px 24px -20px rgba(7,28,61,.55);
  transform:translateY(-120%); opacity:0; visibility:hidden; transition:transform .28s ease, opacity .2s ease, visibility 0s linear .28s;
}
.search-strip.show{ transform:none; opacity:1; visibility:visible; transition:transform .28s ease, opacity .2s ease; }
.ss-inner{ max-width:1240px; margin-inline:auto; padding:10px 20px; display:flex; align-items:center; gap:14px; }
.ss-form{ flex:1 1 auto; min-width:0; display:flex; align-items:center; gap:8px; padding:5px 5px 5px 14px; border:1.5px solid var(--line); border-radius:14px; background:var(--surface); }
.ss-form:focus-within{ border-color:var(--navy); box-shadow:0 0 0 3px color-mix(in srgb, var(--navy) 15%, transparent); }
.ss-form svg{ width:18px; height:18px; color:var(--ink-faint); flex:none; }
.ss-form input{ flex:1 1 auto; min-width:0; border:none; background:transparent; font:inherit; font-size:.95rem; color:var(--ink); padding:7px 0; outline:none; }
.ss-form input::placeholder{ color:var(--ink-faint); }
.ss-form button{ flex:none; border:none; border-radius:10px; background:var(--navy); color:#fff; font:inherit; font-weight:700; font-size:.88rem; padding:9px 16px; cursor:pointer; }
.ss-count{ flex:none; font-size:.82rem; color:var(--ink-soft); white-space:nowrap; }
.ss-count b{ color:var(--ink); }
.ss-top{ flex:none; display:inline-flex; align-items:center; gap:6px; border:1.5px solid var(--line); background:var(--surface); color:var(--ink); border-radius:999px; padding:8px 14px; font:inherit; font-size:.82rem; font-weight:700; cursor:pointer; }
.ss-top svg{ width:16px; height:16px; }
.ss-top:hover{ border-color:var(--navy); color:var(--navy); }
@media (max-width:899px){ .ss-inner{ padding:8px 14px; gap:10px; } .ss-count{ display:none; } }
@media (max-width:560px){ .ss-top{ padding:8px 10px; font-size:0; gap:0; } .ss-top svg{ width:18px; height:18px; } .ss-form button{ padding:8px 12px; } }
@media (min-width:900px){ .ss-inner{ padding-inline:40px; } }