/* ==========================================================================
   apicloud — "apicloud design" yeniden giydirme katmanı (v3400)
   Temel: enhance-apicloud-project-design template'i (DM Sans + Manrope,
   #f9f9f9 zemin, #eaeaea çizgi, mono-koyu aksan). Yalnızca panel (body.shell)
   kapsamlıdır; landing / giriş / kayıt sayfaları mevcut tasarımında kalır.
   Kural: iş mantığı yok, yalnız görünüm. app.css SONRASI yüklenir.
   ========================================================================== */

/* ---------- 1. FONTLAR (self-hosted, CSP 'self') ---------- */
@font-face{
  font-family:"DM Sans"; font-style:normal; font-weight:100 1000; font-display:swap;
  src:url("/fonts/dmsans-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;
}
@font-face{
  font-family:"DM Sans"; font-style:normal; font-weight:100 1000; font-display:swap;
  src:url("/fonts/dmsans-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-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:"Manrope"; font-style:normal; font-weight:200 800; font-display:swap;
  src:url("/fonts/manrope-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;
}
@font-face{
  font-family:"Manrope"; font-style:normal; font-weight:200 800; font-display:swap;
  src:url("/fonts/manrope-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-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* ---------- 2. TOKEN YENİDEN EŞLEME (template -> mevcut değişkenler) ---------- */
body:has(.shell){
  /* yüzeyler */
  --canvas:#f9f9f9;
  --surface:#ffffff;
  --surface-2:#fcfcfc;
  --surface-3:#f4f4f4;
  --inset:#ffffff;
  --inset-hover:#fafafa;

  /* metin — template gri basamakları */
  --ink-1:#262626;
  --ink-2:#5b5b5b;
  --ink-3:#8e8e8e;
  --ink-4:#a6a6a6;

  /* çizgiler — template solid hex */
  --line:#eaeaea;
  --line-soft:#f0f0f0;
  --line-strong:#dcdcdc;
  --line-focus:#b7b7b7;

  /* aksan — mono koyu (#202020) */
  --signal:#202020;
  --signal-strong:#000000;
  --signal-soft:#f4f4f4;
  --signal-softer:#fafafa;
  --signal-on:#ffffff;
  --signal-ring:rgba(0,0,0,.14);

  /* anlamsal — yumuşak, template ruhunda */
  --ok:#16a34a;      --ok-soft:#f0faf4;   --ok-ring:rgba(22,163,74,.22);
  --warn:#b45309;    --warn-soft:#fdf6ec; --warn-ring:rgba(180,83,9,.2);
  --danger:#c22a1e;  --danger-soft:#fdf1f0;--danger-ring:rgba(194,42,30,.2);

  /* derinlik — template kartlar çizgi tanımlı, gölge yalnız yüzen katmanda */
  --shadow-xs:0 0 0 1px #f2f2f2;
  --shadow-sm:0 1px 2px rgba(0,0,0,.03);
  --shadow-md:0 8px 24px rgba(0,0,0,.06);
  --shadow-lg:0 20px 80px rgba(40,40,40,.16);
  --card-shadow:var(--shadow-sm);

  /* tipografi — DM Sans taban + Manrope başlık; template 13px taban */
  --font-sans:"DM Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-head:"Manrope",var(--font-sans);
  --fs-100:10px; --fs-200:11px; --fs-300:12px; --fs-400:13px;
  --fs-500:14px; --fs-600:16px; --fs-700:20px; --fs-800:24px; --fs-900:30px;

  /* yarıçap — template cömert */
  --r-xs:5px; --r-sm:8px; --r-md:12px; --r-lg:16px; --r-xl:20px;

  font-family:var(--font-sans);
  color:#313131;
  font-size:13px;
}

/* panelde yalnız açık tema (kapsam kararı: light only) */
html[data-theme="dark"] body:has(.shell){
  --canvas:#f9f9f9; --surface:#ffffff; --surface-2:#fcfcfc; --surface-3:#f4f4f4;
  --inset:#ffffff; --inset-hover:#fafafa;
  --ink-1:#262626; --ink-2:#5b5b5b; --ink-3:#8e8e8e; --ink-4:#a6a6a6; --ink-inv:#ffffff;
  --line:#eaeaea; --line-soft:#f0f0f0; --line-strong:#dcdcdc; --line-focus:#b7b7b7;
  --signal:#202020; --signal-strong:#000; --signal-soft:#f4f4f4; --signal-softer:#fafafa;
  --signal-on:#ffffff; --signal-ring:rgba(0,0,0,.14);
  color-scheme:light;
}
html[data-theme="dark"] body:has(.shell) .btn.primary:hover{ background:var(--signal-strong); }
html[data-theme="dark"] body:has(.shell) select.input{ background:var(--surface); color:var(--ink-1); }
html[data-theme="dark"] body:has(.shell) .notice.signal{ color:var(--ink-2); }
html[data-theme="dark"] body:has(.shell) .modal-overlay{ background:rgba(37,37,37,.36); }

/* ---------- 3. ODAK — template imzası: 3px #b7b7b7 outline ---------- */
body:has(.shell) :focus-visible{ outline:3px solid #b7b7b7; outline-offset:3px; border-radius:4px; }
body:has(.shell) .input:focus-visible,
body:has(.shell) select.input:focus-visible{ outline:none; border-color:#bdbdbd; box-shadow:0 0 0 3px rgba(0,0,0,.05); }

/* ---------- 4. İSKELET: SIDEBAR ---------- */
body:has(.shell) .sidebar{
  background:var(--surface);
  border-right:1px solid var(--line);
  box-shadow:none;
}
body:has(.shell) .side-brand{
  font-family:var(--font-head);
  font-size:24px; font-weight:800; letter-spacing:-.6px;
  color:#202020; gap:8px; padding:10px var(--sp-2) var(--sp-5);
}
body:has(.shell) .side-brand .mark{ width:26px; height:26px; }
body:has(.shell) .side-brand .brand-light{ color:#9d9d9d; font-weight:800; }
body:has(.shell) .pro-badge{
  font-family:var(--font-sans); font-size:8px; font-weight:700; letter-spacing:.08em;
  color:#8e8e8e; border:1px solid var(--line); border-radius:4px;
  padding:2px 5px; margin-left:2px; transform:translateY(-6px);
}
/* çalışma alanı kartı (renderApp ekler) */
body:has(.shell) .workspace{
  display:flex; align-items:center; gap:10px;
  border:1px solid var(--line); border-radius:10px;
  padding:10px 12px; margin:0 0 var(--sp-4);
  background:var(--surface-2); min-width:0; cursor:default;
}
body:has(.shell) .workspace .ws-av{ width:27px; height:27px; font-size:10px; flex:none; }
body:has(.shell) .workspace .ws-meta{ min-width:0; display:flex; flex-direction:column; }
body:has(.shell) .workspace strong{ font-size:11.5px; font-weight:700; color:#313131; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
body:has(.shell) .workspace small{ font-size:10px; color:#8e8e8e; }
body:has(.shell) .nav-group{
  font-size:10px; font-weight:600; letter-spacing:.1em; text-transform:uppercase;
  color:#b3b3b3; padding:2px 4px var(--sp-2);
}
body:has(.shell) .nav-item{
  font-size:12px; color:#8e8e8e; font-weight:500;
  padding:10px 12px; border-radius:8px; gap:11px;
  box-shadow:none; background:transparent;
}
body:has(.shell) .nav-item .ic{ width:15px; height:15px; }
body:has(.shell) .nav-item:hover{ background:#f4f4f4; color:#313131; }
body:has(.shell) .nav-item[aria-current="page"]{
  background:#f4f4f4; color:#202020; font-weight:700; box-shadow:none;
}
body:has(.shell) .nav-item[aria-current="page"] .ic{ color:#202020; }
/* PRO yükseltme kartı */
body:has(.shell) .upgrade-card{
  margin:var(--sp-4) 2px 0; border:1px solid var(--line); border-radius:12px;
  padding:14px; background:var(--surface-2);
}
body:has(.shell) .upgrade-card h4{ font-family:var(--font-head); font-size:12px; font-weight:800; color:#202020; }
body:has(.shell) .upgrade-card p{ font-size:10.5px; color:#8e8e8e; line-height:1.6; margin:6px 0 10px; }
body:has(.shell) .side-foot{ border-top:1px solid var(--line-soft); padding-top:var(--sp-4); margin-top:var(--sp-4); }
body:has(.shell) .side-user{ padding:6px 4px; }
body:has(.shell) .side-user:hover{ background:transparent; }
body:has(.shell) .avatar{ background:#202020; color:#fff; }

/* ---------- 5. TOPBAR ---------- */
body:has(.shell) .topbar{
  background:var(--surface);
  border-bottom:1px solid var(--line-soft);
  box-shadow:none; height:62px;
}
body:has(.shell) .topbar .crumb{
  font-family:var(--font-sans); font-size:12px; color:#b3b3b3; font-weight:500; letter-spacing:0;
}
body:has(.shell) .topbar .crumb svg{ width:11px; height:11px; vertical-align:-1px; }
body:has(.shell) .topbar h1{
  font-family:var(--font-head); font-size:15px; font-weight:800; letter-spacing:-.3px; color:#202020;
}
body:has(.shell) .topbar .icon-btn{
  border-radius:8px; color:#8e8e8e;
}
body:has(.shell) .topbar .icon-btn:hover{ background:#f4f4f4; color:#313131; }

/* ---------- 6. KARTLAR ---------- */
body:has(.shell) .card{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  box-shadow:var(--card-shadow);
}
body:has(.shell) .card-head{ padding:18px 20px 0; }
body:has(.shell) .card-head h3{
  font-family:var(--font-head); font-size:13px; font-weight:800; letter-spacing:-.2px; color:#202020;
}
body:has(.shell) .card-head p{ font-size:11px; color:#8e8e8e; }
body:has(.shell) .card-body{ padding:16px 20px 20px; }

/* ---------- 7. BUTONLAR ---------- */
body:has(.shell) .btn{
  background:#f4f4f4; color:#313131;
  border:1px solid transparent; border-radius:8px;
  font-size:11px; font-weight:600; padding:9px 12px;
  box-shadow:none;
}
body:has(.shell) .btn:hover{ background:#ececec; }
body:has(.shell) .btn.primary{ background:#202020; color:#fff; }
body:has(.shell) .btn.primary:hover{ background:#000; }
body:has(.shell) .btn.quiet{ background:transparent; border-color:var(--line); color:#5b5b5b; }
body:has(.shell) .btn.quiet:hover{ background:#fafafa; }
body:has(.shell) .btn.danger{ background:#fdf1f0; color:#c22a1e; }
body:has(.shell) .btn.danger:hover{ background:#fbe4e2; }
body:has(.shell) .btn.sm{ padding:7px 10px; font-size:10.5px; border-radius:7px; }
body:has(.shell) .btn.block{ width:100%; }

/* ---------- 8. FORM ---------- */
body:has(.shell) .input,
body:has(.shell) select.input,
body:has(.shell) textarea.input{
  background:#fff; border:1px solid #e7e7e7; border-radius:8px;
  color:#313131; font-size:12px; padding:9px 11px;
  box-shadow:none;
}
body:has(.shell) .input::placeholder{ color:#b3b3b3; }
body:has(.shell) .field > .label,
body:has(.shell) label.label{ font-size:11px; font-weight:600; color:#6b6b6b; }
body:has(.shell) .hint{ font-size:10px; color:#a6a6a6; }

/* ---------- 9. TABLOLAR ---------- */
body:has(.shell) table{ border-collapse:collapse; }
body:has(.shell) th{
  font-size:10px; font-weight:600; color:#a6a6a6; text-align:left;
  padding:10px 14px; border-bottom:1px solid var(--line-soft); background:transparent;
}
body:has(.shell) td{
  font-size:12px; color:#313131; padding:13px 14px;
  border-bottom:1px solid #f5f5f5;
}
body:has(.shell) tbody tr{ transition:background .12s; }
body:has(.shell) tbody tr:hover{ background:#fafafa; }
body:has(.shell) .num-cell{ font-family:var(--font-mono); font-size:11px; }

/* ---------- 10. ROZET / DURUM ---------- */
body:has(.shell) .badge{
  background:#f4f4f4; color:#6b6b6b; border:none;
  font-size:10px; font-weight:600; padding:4px 9px; border-radius:999px; gap:6px;
}
body:has(.shell) .badge .dot{ width:6px; height:6px; background:#a3a3a3; }
body:has(.shell) .badge.ok{ background:#f0faf4; color:#15803d; }
body:has(.shell) .badge.ok .dot{ background:#16a34a; }
body:has(.shell) .badge.warn{ background:#fdf6ec; color:#b45309; }
body:has(.shell) .badge.warn .dot{ background:#d97706; }
body:has(.shell) .badge.danger{ background:#fdf1f0; color:#c22a1e; }
body:has(.shell) .badge.danger .dot{ background:#dc2626; }

/* ---------- 11. MINI METRİKLER ---------- */
body:has(.shell) .mini-metrics{ gap:13px; }
body:has(.shell) .mini-metric{
  background:#fff; border:1px solid var(--line); border-radius:14px;
  padding:16px 17px; box-shadow:none;
}
body:has(.shell) .mini-metric .k{ font-size:11px; color:#8e8e8e; font-weight:500; gap:7px; }
body:has(.shell) .mini-metric .k svg{ width:14px; height:14px; }
body:has(.shell) .mini-metric .v{
  font-family:var(--font-head); font-size:23px; font-weight:800; letter-spacing:-.5px; color:#202020;
}
body:has(.shell) .mini-metric .s{ font-size:10px; color:#a6a6a6; }

/* ---------- 12. BİLDİRİM (notice) ---------- */
body:has(.shell) .notice{ border-radius:10px; font-size:12px; border:1px solid transparent; }
body:has(.shell) .notice.warn{ background:#fdf6ec; border-color:#f3e3c3; color:#7a5206; }
body:has(.shell) .notice.danger{ background:#fdf1f0; border-color:#f5cfcb; color:#a3251b; }
body:has(.shell) .notice.signal{ background:#f6f7f8; border-color:#e8eaee; color:#4a5561; }
body:has(.shell) .notice .n-body b{ font-weight:700; }

/* ---------- 13. ÖLÇÜ ALETİ (meter) ---------- */
body:has(.shell) .meter-rail{ background:#f0f0f0; border-radius:999px; }
body:has(.shell) .meter-fill{ background:#202020; border-radius:999px; }
body:has(.shell) .meter.warn .meter-fill{ background:#d97706; }
body:has(.shell) .meter.over .meter-fill{ background:#dc2626; }
body:has(.shell) .meter-pct{ color:#8e8e8e; }

/* ---------- 14. MODAL / TOAST / STATE ---------- */
body:has(.shell) .modal-overlay{ background:rgba(37,37,37,.36); backdrop-filter:blur(5px); }
body:has(.shell) .modal{
  background:#fff; border:1px solid #efefef; border-radius:16px;
  padding:28px; box-shadow:0 20px 80px rgba(40,40,40,.16);
}
body:has(.shell) .modal h2{ font-family:var(--font-head); font-size:20px; font-weight:800; letter-spacing:-.4px; color:#202020; }
body:has(.shell) .toast{
  background:#202020; color:#fff; border:none; border-radius:10px;
  box-shadow:0 12px 40px rgba(0,0,0,.25); font-size:12px;
}
body:has(.shell) .state .glyph{ background:#f4f4f4; color:#8e8e8e; }
body:has(.shell) .state h4{ font-family:var(--font-head); color:#202020; }
body:has(.shell) .state p{ color:#8e8e8e; }

/* ---------- 15. SEKME / SWITCH / CODEBLOCK ---------- */
body:has(.shell) .role-tabs{
  background:#f4f4f4; border-radius:9px; padding:3px; border:none;
}
body:has(.shell) .role-tabs button{ border-radius:7px; color:#8e8e8e; font-size:11px; }
body:has(.shell) .role-tabs button[aria-selected="true"], 
body:has(.shell) .role-tabs button.active{ background:#fff; color:#202020; font-weight:700; box-shadow:var(--shadow-xs); }
body:has(.shell) .switch input:checked + .switch-track{ background:#202020; }
body:has(.shell) .codeblock, body:has(.shell) pre{
  background:#181818; color:#cbcbcb; border:1px solid #303030; border-radius:10px; font-size:11px;
}
body:has(.shell) .side-scroll, body:has(.shell) #content{ scrollbar-width:thin; scrollbar-color:#e0e0e0 transparent; }

/* ---------- 16. KARŞILAMA BANNERI (template imzası) ---------- */
body:has(.shell) .welcome-banner{
  position:relative; overflow:hidden;
  border:1px solid var(--line); border-radius:var(--r-lg);
  background:linear-gradient(135deg,#fdfdfd 0%,#f5f5f5 100%);
  min-height:186px; padding:26px 30px;
  display:flex; flex-direction:column; justify-content:center;
}
body:has(.shell) .welcome-banner .eyebrow{
  font-size:9px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:#a6a6a6; margin-bottom:8px;
}
body:has(.shell) .welcome-banner h2{
  font-family:var(--font-head); font-size:25px; font-weight:800; letter-spacing:-.7px;
  color:#202020; margin:0; line-height:1.25; max-width:62%;
}
body:has(.shell) .welcome-banner p{
  font-size:11.5px; color:#8e8e8e; line-height:1.7; margin-top:8px; max-width:56%;
}
body:has(.shell) .banner-chips{ display:flex; gap:8px; margin-top:16px; flex-wrap:wrap; }
body:has(.shell) .b-chip{
  background:#fff; border:1px solid var(--line); border-radius:8px;
  padding:7px 11px; font-size:11px; color:#8e8e8e;
}
body:has(.shell) .b-chip b{ color:#202020; font-weight:700; }
body:has(.shell) .b-chip .num{ color:#202020; font-weight:700; }
body:has(.shell) .banner-version{
  position:absolute; top:14px; right:16px;
  font-family:var(--font-mono); font-size:9px; color:#c3c3c3; letter-spacing:.04em;
}
body:has(.shell) .welcome-banner .head-actions{
  position:absolute; top:14px; right:16px; display:flex; gap:8px; align-items:center;
}
body:has(.shell) .welcome-banner .head-actions .banner-version{ position:static; }

/* orbital hero-art — saf CSS */
body:has(.shell) .hero-art{ position:absolute; right:34px; top:50%; transform:translateY(-50%); width:290px; height:290px; pointer-events:none; }
body:has(.shell) .hero-art .orbital{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); border:1px solid rgba(0,0,0,.06); border-radius:50%; }
body:has(.shell) .hero-art .orbital-one{ width:132px; height:132px; }
body:has(.shell) .hero-art .orbital-two{ width:196px; height:196px; border-color:rgba(0,0,0,.045); }
body:has(.shell) .hero-art .orbital-three{ width:262px; height:262px; border-color:rgba(0,0,0,.035); }
body:has(.shell) .hero-art .art-grid{
  position:absolute; inset:30px; border-radius:50%;
  background-image:linear-gradient(rgba(0,0,0,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.035) 1px,transparent 1px);
  background-size:22px 22px; opacity:.5;
  -webkit-mask-image:radial-gradient(circle,black 30%,transparent 70%);
  mask-image:radial-gradient(circle,black 30%,transparent 70%);
}
body:has(.shell) .hero-art .art-center{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:54px; height:54px; background:#202020; color:#fff;
  border-radius:16px; display:grid; place-items:center;
  box-shadow:0 10px 30px rgba(0,0,0,.18);
}
body:has(.shell) .hero-art .art-center svg{ width:24px; height:24px; }
body:has(.shell) .hero-art .art-node{
  position:absolute; width:38px; height:38px; background:#fff;
  border:1px solid var(--line); border-radius:10px; color:#5b5b5b;
  display:grid; place-items:center; box-shadow:0 1px 3px rgba(0,0,0,.06);
}
body:has(.shell) .hero-art .art-node svg{ width:17px; height:17px; }
body:has(.shell) .hero-art .node-one{ top:8%; left:14%; }
body:has(.shell) .hero-art .node-two{ top:16%; right:8%; }
body:has(.shell) .hero-art .node-three{ bottom:12%; left:22%; }
body:has(.shell) .hero-art .node-four{ bottom:4%; right:20%; }
body:has(.shell) .hero-art .art-line{ position:absolute; height:1px; background:rgba(0,0,0,.07); transform-origin:left center; }
body:has(.shell) .hero-art .line-one{ width:88px; top:26%; left:24%; transform:rotate(24deg); }
body:has(.shell) .hero-art .line-two{ width:74px; top:58%; left:38%; transform:rotate(-18deg); }
body:has(.shell) .hero-art .line-three{ width:96px; top:40%; left:52%; transform:rotate(9deg); }
body:has(.shell) .hero-art .art-dot{ position:absolute; width:7px; height:7px; border-radius:50%; background:#d4d4d4; }
body:has(.shell) .hero-art .dot-one{ top:20%; left:52%; }
body:has(.shell) .hero-art .dot-two{ bottom:26%; left:12%; background:#202020; }
body:has(.shell) .hero-art .dot-three{ top:48%; right:6%; }

@media(max-width:1100px){
  body:has(.shell) .hero-art{ right:-60px; opacity:.55; }
}
@media(max-width:820px){
  body:has(.shell) .hero-art{ display:none; }
  body:has(.shell) .welcome-banner h2,
  body:has(.shell) .welcome-banner p{ max-width:100%; }
  body:has(.shell) .welcome-banner{ padding:22px; min-height:0; }
}

/* ---------- 17. SAYFA BAŞLIĞI (banner dışı view başları) ---------- */
body:has(.shell) .page-head h2{
  font-family:var(--font-head); font-size:19px; font-weight:800; letter-spacing:-.4px; color:#202020;
}
body:has(.shell) .page-head p{ font-size:11.5px; color:#8e8e8e; }

/* ---------- 18. RÖTÜŞLAR ---------- */
body:has(.shell) hr{ border-color:var(--line-soft); }
body:has(.shell) .split{ align-items:start; }
body:has(.shell) a{ text-underline-offset:3px; }
body:has(.shell) ::selection{ background:#202020; color:#fff; }
body:has(.shell) .vh{ position:absolute!important; clip:rect(0 0 0 0); }

/* ==========================================================================
   v3401 — EKRAN DİLİMİ DÜZELTMELERİ (breadcrumb, banner-art, kod bloğu)
   ========================================================================== */

/* --- 1. Topbar breadcrumb: tek satır, küçük ok, taşma yok --- */
body:has(.shell) .topbar .crumb-wrap{
  display:flex; align-items:center; gap:8px; min-width:0; flex:1 1 auto;
}
body:has(.shell) .topbar .crumb-wrap .svgic{
  width:12px; height:12px; flex:none; color:#c9c9c9;
}
body:has(.shell) .topbar .crumb-wrap .crumb{
  flex:none; white-space:nowrap;
}
body:has(.shell) .topbar h1{
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}

/* --- 2. Banner sanatı: çakışma ve katman düzeni --- */
body:has(.shell) .hero-art{
  width:250px; height:250px; right:14px; opacity:.92;
}
body:has(.shell) .hero-art .art-node{
  background:rgba(255,255,255,.94);
}
body:has(.shell) .hero-art .node-one{ top:10%; left:12%; }
body:has(.shell) .hero-art .node-two{ top:24%; right:9%; }
body:has(.shell) .hero-art .node-three{ bottom:14%; left:18%; }
body:has(.shell) .hero-art .node-four{ bottom:6%; right:16%; }
/* banner metinleri sanatın üstünde */
body:has(.shell) .welcome-banner .eyebrow,
body:has(.shell) .welcome-banner h2,
body:has(.shell) .welcome-banner p,
body:has(.shell) .welcome-banner .banner-chips{
  position:relative; z-index:2;
}
/* sağ üst aksiyon kutusu: beyaz hap, sanattan bağımsız okunur */
body:has(.shell) .welcome-banner .head-actions{
  z-index:3; background:rgba(255,255,255,.92);
  border:1px solid var(--line); border-radius:10px;
  padding:6px 8px; backdrop-filter:blur(3px);
}
/* sürüm etiketi sağ alta, okunur zeminde */
body:has(.shell) .welcome-banner .banner-version{
  top:auto; bottom:12px; right:16px; z-index:2;
  background:rgba(255,255,255,.85); padding:2px 8px; border-radius:6px;
}

/* --- 3. Kod bloğu: koyu zeminde OKUNUR token renkleri --- */
body:has(.shell) .codeblock{
  background:#181818; color:#d6d6d6;
  border:none; box-shadow:none;
}
body:has(.shell) .codeblock .c-str{ color:#8fe3b0; }
body:has(.shell) .codeblock .c-key{ color:#ececec; }
body:has(.shell) .codeblock .c-com{ color:#8f8f8f; }
body:has(.shell) .codeblock .c-pun{ color:#a8a8a8; }
body:has(.shell) .codeblock .c-num{ color:#f2c07e; }
body:has(.shell) .codeblock a{ color:#bfd7ff; }
body:has(.shell) pre:not(.codeblock){
  background:#181818; color:#d6d6d6; border-color:#303030;
}

/* ==========================================================================
   v3402 — GENİŞLİK UYUMU (mini-metrik sarma + banner/sanat çakışması)
   ========================================================================== */

/* 5 kartlık metrik dizisi: sonda tek kart kalırsa tam genişliğe büyüsün
   (grid auto-fit'in "4+1 + boşluk" kırılması yerine flex-grow) */
body:has(.shell) .mini-metrics{
  display:flex; flex-wrap:wrap; gap:13px; background:none; border-radius:0; overflow:visible;
}
body:has(.shell) .mini-metric{
  flex:1 1 158px; min-width:0;
}

/* banner: geniş ekranda metin alanı sağda sanatla çakışmasın */
@media(min-width:1201px){
  body:has(.shell) .welcome-banner{ padding-right:330px; }
  body:has(.shell) .welcome-banner h2,
  body:has(.shell) .welcome-banner p{ max-width:100%; }
  body:has(.shell) .welcome-banner .banner-chips{ max-width:100%; padding-right:40px; }
}
/* 1200px ve altında sanat tamamen gizlenir: metin/rozetler serbest */
@media(max-width:1200px){
  body:has(.shell) .hero-art{ display:none !important; }
  body:has(.shell) .welcome-banner h2,
  body:has(.shell) .welcome-banner p{ max-width:100%; }
}

/* ==========================================================================
   v4400 — ROUTEWAY STANDARDI (landing + auth)
   Referans: routeway.ai görsel dili — birebir tasarım kopyası, içerik bizim.
   • Zemin #0a0a0a + indigo glow + yıldız canvas + dikey ışık çizgileri
   • Buz-mavi wordmark (#bdeffd) + camgöbeği CTA (#67e8f9) + mavi vurgu (#4468f5)
   • Yüzen eğik kartlar (görsel + token kartları)
   • Manrope (self-hosted) · kartlar #141419 · border #26262e
   Panel (shell) bu katmandan ETKİLENMEZ (sahip kararları saklı).
   ========================================================================== */

/* ---------- 1. TOKEN KÖPRÜSÜ (landing + auth) ---------- */
body:has(.landing),
body:has(.auth-split){
  --canvas:#0a0a0a;
  --surface:#141419;
  --surface-2:#101014;
  --surface-3:#1b1b21;
  --inset:#0d0d11; --inset-hover:#15151b;

  --ink-1:#f2f2f5; --ink-2:#9c9ca6; --ink-3:#6f6f7a; --ink-4:#585862;

  --line:#26262e; --line-soft:#1c1c22; --line-strong:#34343e; --line-focus:#8ff0fc;

  --signal:#67e8f9; --signal-strong:#8ff0fc;
  --signal-soft:#10262b; --signal-softer:#0c1d21;
  --signal-on:#06262b; --signal-ring:rgba(103,232,249,.35);

  --ok:#4ade80;    --ok-soft:#10241a;
  --warn:#e0a83c;  --warn-soft:#2a2008;
  --danger:#f2726a;--danger-soft:#2b1210;

  --shadow-xs:0 0 0 1px #23232b;
  --shadow-sm:0 1px 2px rgba(0,0,0,.5);
  --shadow-md:0 12px 40px rgba(0,0,0,.55);

  --font-sans:"Manrope",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-head:"Manrope",var(--font-sans);

  color-scheme:dark;
  font-family:var(--font-sans);
  color:var(--ink-2);
}
/* tema tercihi ne olursa olsun landing/auth bu eksende kalır (referans koyu) */
html[data-theme="light"] body:has(.landing),
html[data-theme="light"] body:has(.auth-split){ color-scheme:dark; }

/* ---------- 2. ODAK / SEÇİM ---------- */
body:has(.landing) :focus-visible,
body:has(.auth-split) :focus-visible{ outline:2px solid var(--line-focus); outline-offset:3px; border-radius:4px; }
body:has(.landing) ::selection,
body:has(.auth-split) ::selection{ background:#67e8f9; color:#06262b; }

/* ---------- 3. NAV ---------- */
body:has(.landing) .lnav{ background:rgba(10,10,10,.72); backdrop-filter:blur(12px); border-bottom-color:transparent; }
body:has(.landing) .lnav.stuck{ border-bottom-color:var(--line-soft); }
body:has(.landing) .brand{ color:#fff; font-weight:800; }
body:has(.landing) .lnav-links a{ color:#b9b9c3; }
body:has(.landing) .lnav-links a:hover{ color:#fff; background:rgba(255,255,255,.06); }
body:has(.landing) .lnav-cta .btn.quiet{ background:transparent; color:#d6d6de; }
body:has(.landing) .lnav-cta .btn.quiet:hover{ background:rgba(255,255,255,.07); color:#fff; }
body:has(.landing) .lnav-cta .btn.primary{ background:#fff; color:#0a0a0a; border-radius:10px; }
body:has(.landing) .lnav-cta .btn.primary:hover{ background:#e8e8ee; }

/* ---------- 4. HERO ---------- */
body:has(.landing) .hero.rw{
  position:relative; overflow:hidden; text-align:center;
  background:
    radial-gradient(1100px 520px at 50% -18%, rgba(64,58,255,.52), rgba(30,28,120,.22) 46%, transparent 72%),
    radial-gradient(700px 300px at 12% 4%, rgba(64,58,255,.20), transparent 60%),
    radial-gradient(700px 300px at 88% 4%, rgba(64,58,255,.20), transparent 60%),
    #0a0a0a;
  padding:clamp(72px,10vw,128px) 0 clamp(64px,8vw,110px);
}
/* dikey ışık çizgileri */
body:has(.landing) .hero.rw::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:repeating-linear-gradient(90deg, rgba(255,255,255,.05) 0 1px, transparent 1px 96px);
  -webkit-mask-image:linear-gradient(180deg, #000 0%, rgba(0,0,0,.5) 55%, transparent 90%);
  mask-image:linear-gradient(180deg, #000 0%, rgba(0,0,0,.5) 55%, transparent 90%);
}
body:has(.landing) canvas.stars{ position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
body:has(.landing) .hero-in{ position:relative; z-index:2; grid-template-columns:1fr; justify-items:center; }
body:has(.landing) .hero-copy{ max-width:880px; display:flex; flex-direction:column; align-items:center; }

body:has(.landing) .wordmark{
  font-family:var(--font-head);
  font-size:clamp(64px,11.5vw,164px);
  line-height:.98; letter-spacing:-.02em; font-weight:300;
  color:#bdeffd;
  text-shadow:0 0 24px rgba(143,240,252,.28), 0 0 90px rgba(103,232,249,.22);
  margin:0 0 var(--sp-4);
}
body:has(.landing) .hero-lead{ color:#9c9ca6; font-size:clamp(15px,1.4vw,18px); max-width:56ch; margin:0 auto var(--sp-7); }
body:has(.landing) .hero-cta{ justify-content:center; margin-bottom:var(--sp-9); }
body:has(.landing) .hero-cta .btn{ border-radius:999px; }
body:has(.landing) .hero-cta .btn.primary{
  background:#67e8f9; color:#06262b; font-weight:700;
  box-shadow:0 0 0 1px rgba(103,232,249,.4), 0 8px 40px -6px rgba(103,232,249,.45);
}
body:has(.landing) .hero-cta .btn.primary:hover{ background:#8ff0fc; }
body:has(.landing) .hero-cta .btn:not(.primary){
  background:#17171c; color:#f2f2f5; border:1px solid #2a2a31;
}
body:has(.landing) .hero-cta .btn:not(.primary):hover{ background:#1f1f26; }

/* stat kartları */
body:has(.landing) .hero-stats{ display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }
body:has(.landing) .stat-card{
  width:290px; text-align:left;
  background:rgba(13,13,17,.72); border:1px solid #232329; border-radius:14px;
  padding:22px 24px; display:flex; flex-direction:column; gap:2px;
  backdrop-filter:blur(6px);
}
body:has(.landing) .stat-card .k{ font-size:10px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:#8a8a93; margin-bottom:8px; }
body:has(.landing) .stat-card .v{ font-size:44px; font-weight:800; letter-spacing:-.02em; color:#fff; line-height:1; }
body:has(.landing) .stat-card .s{ font-size:14px; font-weight:600; color:#e6e6ec; margin-top:4px; }
body:has(.landing) .stat-card .s2{ font-size:11.5px; color:#77777f; margin-top:6px; }

/* ---------- 5. YÜZEN KARTLAR ---------- */
body:has(.landing) .rw-float{ position:absolute; z-index:1; pointer-events:none; }
body:has(.landing) .rw-float img{
  display:block; width:250px; height:250px; object-fit:cover;
  border-radius:20px; border:1px solid #2a2a2e;
  box-shadow:0 30px 80px -20px rgba(0,0,0,.8);
}
body:has(.landing) .f-cosmos{ top:64px; left:4%; transform:rotate(-8deg); }
body:has(.landing) .f-wave{ bottom:26px; right:3%; transform:rotate(7deg); }
body:has(.landing) .tokcard{
  width:280px; padding:14px 16px; border-radius:14px;
  background:linear-gradient(160deg,#e3e3e3,#c9c9cb);
  color:#3c3c40; box-shadow:0 24px 60px -18px rgba(0,0,0,.75);
}
body:has(.landing) .tokcard p{
  font-size:11.5px; line-height:1.55; color:#4a4a4f; margin:0 0 10px;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}
body:has(.landing) .tokcard .tk-row{ display:flex; justify-content:space-between; gap:8px; font-size:10.5px; color:#6d6d72; }
body:has(.landing) .f-tok-a{ top:96px; right:6%; transform:rotate(6deg); }
body:has(.landing) .f-tok-b{ bottom:120px; left:5%; transform:rotate(-7deg); }
@media (max-width:1200px){
  body:has(.landing) .f-cosmos{ left:-70px; } body:has(.landing) .f-wave{ right:-70px; }
  body:has(.landing) .f-tok-a{ right:-40px; } body:has(.landing) .f-tok-b{ left:-40px; }
}
@media (max-width:900px){ body:has(.landing) .rw-float{ display:none; } }

/* ---------- 6. LOGO DUVARI ---------- */
body:has(.landing) .logos-sec{ padding:clamp(56px,7vw,88px) 0; background:#0a0a0a; }
body:has(.landing) .logo-wall{ display:flex; flex-direction:column; gap:26px; align-items:center; margin-bottom:clamp(40px,5vw,64px); }
body:has(.landing) .lw-row{ display:flex; gap:clamp(28px,4vw,56px); align-items:center; justify-content:center; flex-wrap:wrap; }
body:has(.landing) .lw-ic{ display:inline-flex; filter:grayscale(1) brightness(1.9); opacity:.55; transition:opacity .2s, filter .2s; }
body:has(.landing) .lw-ic:hover{ opacity:.95; filter:grayscale(0) brightness(1); }
body:has(.landing) .lw-ic svg{ width:22px; height:22px; }
body:has(.landing) .sec-head.center{ text-align:center; margin-inline:auto; }
body:has(.landing) .sec-head.center h2{ color:#fff; }

/* ---------- 7. BÖLÜMLER ---------- */
body:has(.landing) .sec{ background:#0a0a0a; }
body:has(.landing) .sec.alt{ background:#0b0b0e; border-block:1px solid var(--line-soft); }
body:has(.landing) .glow-purple{
  background:
    radial-gradient(1000px 560px at 50% 42%, rgba(84,62,255,.22), transparent 70%),
    #0b0b0e;
}
body:has(.landing) .sec-head h2{ color:#fff; }
body:has(.landing) .sec-head p{ color:#9c9ca6; }
body:has(.landing) .eyebrow{ color:#8ff0fc; }

/* masonry (referansın tanıklık ızgarası) */
body:has(.landing) .masonry{ columns:3; column-gap:16px; }
@media (max-width:1100px){ body:has(.landing) .masonry{ columns:2; } }
@media (max-width:760px){ body:has(.landing) .masonry{ columns:1; } }
body:has(.landing) .m-card{
  break-inside:avoid; margin:0 0 16px;
  background:rgba(20,20,26,.78); border:1px solid #26262e; border-radius:14px;
  padding:20px 20px 22px;
}
body:has(.landing) .m-card h3{ color:#f2f2f5; font-size:15px; font-weight:800; margin:12px 0 6px; }
body:has(.landing) .m-card p{ color:#9c9ca6; font-size:13px; line-height:1.65; }
body:has(.landing) .feat-ic{
  width:36px; height:36px; border-radius:10px;
  background:rgba(103,232,249,.10); color:#8ff0fc; display:grid; place-items:center;
}
body:has(.landing) .feat-ic .svgic{ width:17px; height:17px; }

/* ---------- 8. SHIP (console) BÖLMESİ ---------- */
body:has(.landing) .ship{ align-items:center; }
body:has(.landing) .ship-copy h2{ font-size:clamp(28px,3.4vw,40px); font-weight:800; letter-spacing:-.03em; color:#fff; margin-bottom:var(--sp-4); }
body:has(.landing) .ship-copy h2 .accent{ color:#8ff0fc; text-decoration:none; }
body:has(.landing) .ship-copy > p{ color:#9c9ca6; font-size:14.5px; line-height:1.7; margin-bottom:var(--sp-6); max-width:46ch; }
body:has(.landing) .checks{ list-style:none; display:flex; flex-direction:column; gap:14px; margin:0; padding:0; }
body:has(.landing) .checks li{ display:flex; gap:12px; align-items:flex-start; }
body:has(.landing) .checks li > .svgic{ flex:none; width:18px; height:18px; color:#4ade80; margin-top:2px; }
body:has(.landing) .checks b{ display:block; color:#f2f2f5; font-size:13.5px; font-weight:700; }
body:has(.landing) .checks li > div > span{ display:block; color:#8a8a93; font-size:12.5px; margin-top:2px; }

/* konsol kartı — koyu zemin cila */
body:has(.landing) .console{ background:#101014; border-color:#26262e; border-radius:16px; box-shadow:0 30px 90px -30px rgba(0,0,0,.9); }
body:has(.landing) .con-head{ background:#0c0c10; border-bottom-color:#1e1e25; }
body:has(.landing) .con-title{ color:#9c9ca6; }
body:has(.landing) .con-live{ color:#77777f; }
body:has(.landing) .con-line .m{ color:#e8e8ee; }
body:has(.landing) .con-line .tk{ color:#8ff0fc; }
body:has(.landing) .con-foot{ background:#0c0c10; border-top-color:#1e1e25; }
body:has(.landing) .con-count .v{ color:#fff; }

/* ---------- 9. KART / TABLO / FİYAT BANDI ---------- */
body:has(.landing) .card,
body:has(.landing) .band{ background:#101014; border:1px solid #232329; box-shadow:none; }
body:has(.landing) .band-row:not(.head):hover{ background:#17171c; }
body:has(.landing) .band-row .num{ color:#f2f2f5; }
body:has(.landing) .band-row .resmi{ color:#6f6f7a; }
body:has(.landing) .band-row .bizde{ color:#8ff0fc; }
body:has(.landing) .band-note{ color:#77777f; }
body:has(.landing) .band-chip{ background:#17171c; color:#c9c9d2; }
body:has(.landing) .card-head h3{ color:#f2f2f5; }

/* model kolonları */
body:has(.landing) .model-cols .model-col{ background:#101014; border-color:#232329; }
body:has(.landing) .model-row{ border-color:#1c1c22; }
body:has(.landing) .model-row:hover{ background:#17171c; }

/* ---------- 10. PAKETLER: ortadaki mavi vurgulu ---------- */
body:has(.landing) .pack{ background:#101014; border:1px solid #232329; border-radius:16px; }
body:has(.landing) .pack-grid{ align-items:stretch; }
body:has(.landing) .pack-grid .pack:nth-child(2){
  position:relative; border-color:#4468f5;
  box-shadow:0 0 0 1px #4468f5, 0 24px 80px -24px rgba(68,104,245,.55);
}
body:has(.landing) .pack-grid .pack:nth-child(2)::before{
  content:"En çok tercih"; position:absolute; top:-12px; left:50%; transform:translateX(-50%);
  background:#4468f5; color:#fff; font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase;
  padding:4px 12px; border-radius:999px;
}
body:has(.landing) .pack .btn.primary{ background:#4468f5; color:#fff; }
body:has(.landing) .pack .btn.primary:hover{ background:#5a7bff; }

/* ---------- 11. HESAPLAYICI / FORM ---------- */
body:has(.landing) .calc-big{ color:#fff; }
body:has(.landing) input[type="range"]{ accent-color:#67e8f9; }
body:has(.landing) .input,
body:has(.auth-split) .input{
  background:#0d0d11; border:1px solid #26262e; border-radius:10px; color:#f2f2f5; box-shadow:none;
}
body:has(.landing) .input:focus-visible,
body:has(.auth-split) .input:focus-visible{ outline:none; border-color:#8ff0fc; box-shadow:0 0 0 3px rgba(103,232,249,.18); }
body:has(.landing) label.label,
body:has(.auth-split) label.label{ color:#9c9ca6; }
body:has(.landing) .notice.signal{ background:#101014; border-color:#26262e; color:#9c9ca6; }

/* ---------- 12. KOD BLOĞU ---------- */
body:has(.landing) .codeblock{ background:#0d0d11; border:1px solid #26262e; color:#d6d6d6; border-radius:12px; }
body:has(.landing) .codeblock .c-str{ color:#8fe3b0; }
body:has(.landing) .codeblock .c-key{ color:#ececec; }
body:has(.landing) .codeblock .c-com{ color:#8f8f8f; }
body:has(.landing) .codeblock .c-pun{ color:#a8a8a8; }
body:has(.landing) .codeblock .c-num{ color:#f2c07e; }

/* ---------- 13. SSS ---------- */
body:has(.landing) .faq{ background:#101014; border:1px solid #232329; border-radius:12px; }
body:has(.landing) .faq summary{ color:#e6e6ec; font-weight:600; }
body:has(.landing) .faq details[open] summary{ color:#fff; }
body:has(.landing) .faq .badge{ background:#17171c; color:#9c9ca6; }

/* ---------- 14. WHATSAPP / ÜYE OL ---------- */
body:has(.landing) .su-copy h2{ color:#fff; }
body:has(.landing) .su-ic{ background:#17171c; color:#8ff0fc; }
body:has(.landing) .auth-card, body:has(.landing) .su-card{ background:#101014; border-color:#232329; }

/* ---------- 15. FİNAL CTA ---------- */
body:has(.landing) .cta-final{ position:relative; overflow:hidden; background:
  radial-gradient(900px 420px at 50% 118%, rgba(64,58,255,.4), transparent 70%), #0a0a0a; }
body:has(.landing) .cta-final .container{ background:transparent; border:none; box-shadow:none; padding:clamp(64px,9vw,120px) 24px; }
body:has(.landing) .cta-final .container::before{ content:none; }
body:has(.landing) .cta-final h2{ color:#fff; }
body:has(.landing) .cta-final p{ color:#9c9ca6; }
body:has(.landing) .cta-final .btn{ border-radius:999px; }
body:has(.landing) .cta-final .btn.primary{ background:#67e8f9; color:#06262b; font-weight:700; box-shadow:0 8px 40px -6px rgba(103,232,249,.45); }
body:has(.landing) .cta-final .btn.primary:hover{ background:#8ff0fc; }
body:has(.landing) .cta-final .btn:not(.primary){ background:#17171c; color:#f2f2f5; border:1px solid #2a2a31; }

/* ---------- 16. FOOTER ---------- */
body:has(.landing) .lfoot{ background:#050507; border-top:1px solid #1c1c22; }
body:has(.landing) .lfoot a, body:has(.landing) .lfoot button{ color:#8a8a93; }
body:has(.landing) .lfoot a:hover, body:has(.landing) .lfoot button:hover{ color:#fff; }
body:has(.landing) .copy{ color:#6f6f7a; }

/* ---------- 17. GİRİŞ / KAYIT ---------- */
body:has(.auth-split) .auth-main{ background:#0a0a0a; }
body:has(.auth-split) .auth-aside{ background:#0a0a0a; border-right:1px solid #1c1c22; }
body:has(.auth-split) .auth-card{ background:#101014; border:1px solid #232329; border-radius:16px; box-shadow:var(--shadow-md); padding:26px; }
body:has(.auth-split) h2, body:has(.auth-split) .auth-head h1{ color:#fff; }
body:has(.auth-split) .auth-quote{ color:#9c9ca6; }
body:has(.auth-split) .auth-quote h2{ color:#bdeffd; }
body:has(.auth-split) .auth-head p{ color:#77777f; }
body:has(.auth-split) .auth-alt{ color:#77777f; }
body:has(.auth-split) .auth-alt button{ color:#8ff0fc; }
body:has(.auth-split) .role-tabs{ background:#17171c; }
body:has(.auth-split) .role-tabs button{ color:#8a8a93; }
body:has(.auth-split) .role-tabs button[aria-selected="true"],
body:has(.auth-split) .role-tabs button.active{ background:#23232b; color:#fff; }
body:has(.auth-split) .btn.primary{ background:#67e8f9; color:#06262b; font-weight:700; }
body:has(.auth-split) .btn.primary:hover{ background:#8ff0fc; }
body:has(.auth-split) .eco-chip{ background:#141419; border-color:#26262e; }
body:has(.auth-split) .eco-name{ color:#9c9ca6; }
body:has(.auth-split) .eco-cap{ color:#6f6f7a; }
body:has(.auth-split) .pw-toggle{ color:#77777f; }
body:has(.auth-split) .pw-toggle:hover{ background:#1b1b21; color:#fff; }
body:has(.auth-split) .auth-top-r{ color:#6f6f7a; }
body:has(.auth-split) .btn.ghost{ background:transparent; border:1px solid #2a2a31; color:#d6d6de; }

/* ---------- 18. REVEAL + HAREKET AZALTMA ---------- */
.rv{ opacity:0; translate:0 14px; transition:opacity .35s cubic-bezier(.23,1,.32,1), translate .35s cubic-bezier(.23,1,.32,1); }
.rv-in{ opacity:1; translate:0 0; }
@media (prefers-reduced-motion: reduce){
  .rv{ opacity:1; translate:0 0; transition:none; }
  body:has(.landing) .con-line{ animation:none; }
}

/* ---------- 19. v4400 ek: bilgi sayfaları (lpage) + WhatsApp ---------- */
body:has(.landing) .lpage-h{ color:#fff; }
body:has(.landing) .lpage h2{ color:#f2f2f5; margin:28px 0 8px; }
body:has(.landing) .lpage p, body:has(.landing) .lpage li{ color:#9c9ca6; line-height:1.7; }
body:has(.landing) .lpage a{ color:#8ff0fc; }
body:has(.landing) .lpage .dim{ color:#6f6f7a; }
body:has(.landing) .wa-panel h3{ color:#fff; }
body:has(.landing) .wa-panel .btn.primary,
body:has(.landing) .wa-block .btn.primary{ background:#1faf54; color:#fff; }
body:has(.landing) .wa-panel .btn.primary:hover,
body:has(.landing) .wa-block .btn.primary:hover{ background:#25d366; }