/* ============================================================
   RaportAI Landing — Aurora arka plan + Liquid Glass kart/buton
   (React aurora-background + liquid-glass bileşenlerinin Vanilla CSS portu)
   ============================================================ */

/* ---------- AURORA ARKA PLAN ---------- */
/* Body-level .aurora div'i kullanılmıyor (sticky hero ile çakışıyordu);
   aurora page-stack'in İÇİNE, kartların arkasına yerleştiriliyor. */
.aurora{ display:none; }

/* page-stack OPAK kalır → sticky hero'yu örter */
.page-stack{ position:relative; background:var(--bg); }

/* Hafif köşe glow'ları (login orb'larının statik karşılığı) */
.page-stack::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(620px 520px at 12% 6%, rgba(58,139,245,.08), transparent 70%),
    radial-gradient(480px 480px at 92% 40%, rgba(0,204,240,.05), transparent 70%);
}
html[data-theme="light"] .page-stack::before{
  background:
    radial-gradient(620px 520px at 12% 6%, rgba(20,96,216,.10), transparent 70%),
    radial-gradient(480px 480px at 92% 40%, rgba(0,144,192,.07), transparent 70%);
}

/* ── LOGIN TILE-GRID: 56px kare ızgara + fareyle bırakılan İZ (login ile birebir) ──
   #raportai-tiles landing-tiles.js ile page-stack içine kurulur. Sticky + margin
   hilesi ile viewport'a sabitlenir, akış alanı kaplamaz, içeriğin arkasında kalır.
   Kareler fare geçince yanar, sonra 2.2sn'de sönerek İZ bırakır (login davranışı). */
.page-stack{
  --ltile-border:rgba(255,255,255,.05);
  --ltile-hover:rgba(58,139,245,.40);
  --ltile-ambient:rgba(58,139,245,.06);
}
html[data-theme="light"] .page-stack{
  --ltile-border:rgba(20,96,216,.10);
  --ltile-hover:rgba(20,96,216,.30);
  --ltile-ambient:rgba(20,96,216,.06);
}
#raportai-tiles{
  position:sticky; top:0; height:100vh; margin-bottom:-100vh; z-index:0;
  display:grid; pointer-events:none; overflow:hidden; contain:strict;
}
.tiles-tile{
  width:56px; height:56px; background:transparent;
  border-right:1px solid var(--ltile-border);
  border-bottom:1px solid var(--ltile-border);
  transition:background-color 2.2s ease; contain:strict;
}
.tiles-tile.tiles-glow-hover{ background-color:var(--ltile-hover) !important; transition:background-color 0s !important; }
.tiles-tile.tiles-glow-ambient{ background-color:var(--ltile-ambient); transition:background-color 1.8s ease; }

.page-stack > *{ position:relative; z-index:1; }

/* ---------- LIQUID GLASS — KARTLAR ---------- */
/* .glass zaten landing-v2.css'te var; burada zenginleştiriyoruz */
.glass,
.stat, .feat, .demo-card, .price, .doc, .auth-card, .contact-card{
  position:relative;
  background:rgba(255,255,255,.085);
  border:1px solid rgba(255,255,255,.16);
  -webkit-backdrop-filter:blur(7px) saturate(1.35);
          backdrop-filter:blur(7px) saturate(1.35);
  box-shadow:
    0 8px 24px rgba(3,7,18,.30),
    0 1px 0 rgba(255,255,255,.10),
    inset 2px 2px 1px 0 rgba(255,255,255,.42),
    inset -1px -1px 1px 1px rgba(255,255,255,.28);
  overflow:hidden;
  isolation:isolate;
}
/* PERF: kartların ikinci backdrop-filter katmanı (::before blur) KALDIRILDI.
   Her kartta iki blur geçişi vardı (kart blur(7px) + ::before blur(2px)); ikincisi
   gereksiz maliyet ve neredeyse görünmez etkiydi. Tek geçiş (kart) kaldı. */
/* üst parıltı çizgisi */
.glass::after,
.stat::after, .feat::after, .demo-card::after,
.price::after, .doc::after, .auth-card::after, .contact-card::after{
  content:""; position:absolute; left:0; right:0; top:0; height:40%;
  border-radius:inherit;
  background:linear-gradient(180deg, rgba(255,255,255,.18), transparent);
  pointer-events:none;
}
/* açık temada cam dokusu */
html[data-theme="light"] .glass,
html[data-theme="light"] .stat, html[data-theme="light"] .feat,
html[data-theme="light"] .demo-card, html[data-theme="light"] .price,
html[data-theme="light"] .doc, html[data-theme="light"] .auth-card,
html[data-theme="light"] .contact-card{
  background:rgba(255,255,255,.55);
  border-color:rgba(255,255,255,.75);
  box-shadow:
    0 8px 24px rgba(15,36,64,.12),
    inset 2px 2px 1px 0 rgba(255,255,255,.85),
    inset -1px -1px 1px 1px rgba(255,255,255,.6);
}

/* fiyat kartı vurgulananı koru */
.price.pop{ border:1.5px solid var(--accent); }

/* ---------- LIQUID GLASS — BUTONLAR ---------- */
.btn{
  position:relative;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.22);
  -webkit-backdrop-filter:blur(8px) saturate(1.4);
          backdrop-filter:blur(8px) saturate(1.4);
  box-shadow:
    0 4px 14px rgba(3,7,18,.22),
    inset 1.5px 1.5px 1px 0 rgba(255,255,255,.5),
    inset -1px -1px 1px 1px rgba(255,255,255,.30);
  overflow:hidden;
  transition:transform .5s cubic-bezier(0.175,0.885,0.32,2.2), border-color .25s, color .25s, box-shadow .3s;
}
.btn::after{
  content:""; position:absolute; left:0; right:0; top:0; height:50%;
  background:linear-gradient(180deg, rgba(255,255,255,.28), transparent);
  pointer-events:none;
}
.btn:hover{
  transform:translateY(-1px) scale(1.03);
  border-color:var(--accent);
  box-shadow:
    0 8px 22px rgba(3,7,18,.30),
    inset 1.5px 1.5px 1px 0 rgba(255,255,255,.6),
    inset -1px -1px 1px 1px rgba(255,255,255,.35);
}
/* dolu (accent) buton — cam parlaklığı eklenmiş accent */
.btn--solid{
  background:
    linear-gradient(180deg, rgba(255,255,255,.30), rgba(255,255,255,0) 55%),
    var(--accent);
  color:var(--accent-ink);
  border-color:var(--accent);
}
.btn--solid:hover{ color:var(--accent-ink); filter:brightness(1.06); }

/* nav cam zaten var; parlaklık artır */
.nav{ box-shadow:inset 0 1px 0 rgba(255,255,255,.12); }
/* LIGHT tema: nav bar %55 saydamdı → koyu hero + tile ızgara sızıp çamurlu gri
   oluyordu. Temiz, opak açık bar yap (hem hero hem içerik üstünde net). */
html[data-theme="light"] .nav{
  background:rgba(240,246,254,.95) !important;
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(15,36,64,.10);
  box-shadow:0 6px 24px rgba(15,36,64,.07);
}

/* Logo renk düzeltmesi: SVG <use> shadow DOM'una CSS var fill geçmiyor.
   fill'i use elementine set edince symbol path'leri inherit alır. */
.brand-logo{ fill:var(--logo1); }
.brand-logo .t1{ fill:var(--logo1) !important; }
.brand-logo .t2{ fill:var(--logo2) !important; }

/* ---------- DOCS TAB SİSTEMİ ---------- */
.docs-tab-bar{
  display:flex; justify-content:center; gap:.4rem;
  margin:0 auto 2rem; width:fit-content;
  background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.12);
  border-radius:999px; padding:.3rem;
}
.docs-tab-btn{
  padding:.55rem 1.4rem; border-radius:999px; border:none; cursor:pointer;
  font-family:var(--sans); font-size:.88rem; font-weight:600;
  background:transparent; color:var(--fg-dim); transition:all .2s ease;
}
.docs-tab-btn.active{
  background:rgba(55,201,232,.18); color:var(--accent);
  box-shadow:0 2px 10px rgba(0,0,0,.25);
}
.docs-tab-btn:hover:not(.active){ background:rgba(255,255,255,.08); color:var(--fg); }

.docs-panel{ display:none; }
.docs-panel.active{ display:block; }

.docs-step-grid{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:.85rem; margin-bottom:1.5rem;
}
.docs-step-card{
  background:rgba(255,255,255,.055); border-radius:14px;
  border:1px solid rgba(255,255,255,.14);
  -webkit-backdrop-filter:blur(10px) saturate(1.2); backdrop-filter:blur(10px) saturate(1.2);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08), 0 8px 24px rgba(3,7,18,.35);
  padding:1rem 1.2rem; display:flex; gap:1rem; align-items:flex-start;
  transition:border-color .2s, transform .2s;
}
.docs-step-card:hover{ border-color:var(--accent); transform:translateY(-2px); }
/* LIGHT: koyu-cam yerine temiz beyaz kart (light-mavi zeminde net görünsün) */
html[data-theme="light"] .docs-step-card{
  background:#ffffff; border-color:rgba(15,36,64,.10);
  box-shadow:0 6px 20px rgba(15,36,64,.08);
}
.docs-step-number{
  min-width:30px; height:30px; border-radius:50%; flex-shrink:0; margin-top:1px;
  background:linear-gradient(135deg,var(--accent),#0a9ea8);
  color:#070a10; font-weight:700; font-size:.82rem;
  display:flex; align-items:center; justify-content:center;
}
.docs-step-content h3{ font-size:1rem; font-weight:700; color:var(--fg); margin-bottom:.3rem; }
.docs-step-content p{ font-size:.92rem; color:var(--fg); opacity:.82; margin:0; line-height:1.6; }
.docs-step-content a{ color:var(--accent); font-weight:600; }
.docs-step-content strong{ color:var(--fg); }

.docs-note{
  font-size:.84rem; color:var(--fg-dim); line-height:1.6;
  padding:.85rem 1.2rem; border-radius:10px;
  background:rgba(55,201,232,.07); border:1px solid rgba(55,201,232,.2);
}
.docs-note a{ color:var(--accent); font-weight:600; }

.docs-p{ font-size:.9rem; color:var(--fg-dim); line-height:1.6; margin:0 0 .9rem; }

/* ikon hizalama */
.docs-section-title > i,.docs-pacs-subtitle > i,.docs-highlight-badge > i{ color:var(--accent); }
.docs-info-box > i{ color:var(--accent); margin-right:.15rem; }
.docs-warn-box > i{ color:#f0aa5a; margin-right:.15rem; }
.docs-note > i{ color:var(--accent); margin-right:.15rem; }
.docs-collapsible-btn > i:first-child{ color:var(--accent); }
.docs-tab-btn > i{ margin-right:.1rem; }

/* bölüm başlığı */
.docs-section-title{
  font-family:var(--serif); font-weight:400; font-size:1.25rem; color:var(--fg);
  margin:2rem 0 .9rem; padding-bottom:.55rem; border-bottom:1px solid var(--rule);
  display:flex; align-items:center; gap:.55rem;
}

/* method badge + endpoint */
.docs-method-badge{
  display:inline-block; font-family:var(--sans); font-size:.72rem; font-weight:700;
  letter-spacing:.04em; padding:.25rem .6rem; border-radius:6px;
  background:var(--accent); color:#070a10; margin-right:.5rem;
}
.docs-method-badge.get{ background:#4ade80; }
.docs-endpoint{ font-family:'Courier New',monospace; font-size:.85rem; color:var(--fg); opacity:.9; }
code{ font-family:'Courier New',monospace; font-size:.85em; background:rgba(255,255,255,.08); padding:.1em .4em; border-radius:5px; color:var(--accent); }

/* collapsible */
.docs-collapsible-btn{
  display:flex; align-items:center; gap:.5rem; width:100%; text-align:left;
  font-family:var(--sans); font-size:.85rem; font-weight:600; color:var(--fg);
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1);
  border-radius:10px; padding:.7rem 1rem; cursor:pointer; margin:.6rem 0 0; transition:border-color .2s;
}
.docs-collapsible-btn:hover{ border-color:var(--accent); }
.docs-collapsible-btn .chevron{ margin-left:auto; transition:transform .25s; }
.docs-collapsible-btn.open .chevron{ transform:rotate(180deg); }
.docs-collapsible-content{ display:none; margin-top:.5rem; }
.docs-collapsible-content.open{ display:block; }

/* kod blokları */
.docs-code-block{
  background:#0a0e16; border:1px solid rgba(255,255,255,.1);
  border-radius:10px; overflow:hidden; margin:.6rem 0;
}
.docs-code-label{
  font-family:var(--sans); font-size:.72rem; font-weight:600; letter-spacing:.04em;
  color:var(--fg-dim); padding:.55rem .9rem; border-bottom:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
}
.docs-code-block pre{
  margin:0; padding:1rem; overflow-x:auto;
  font-family:'Courier New',monospace; font-size:.82rem; line-height:1.6; color:#d6e2f0;
}
.docs-code-block .comment{ color:#5f7488; }
.docs-code-block .str{ color:#7fd6a0; }
.docs-code-block .val{ color:#f0b95f; }
.docs-code-block .kw{ color:#c08aff; }

/* öne çıkan kart */
.docs-highlight-card{
  background:linear-gradient(180deg, rgba(55,201,232,.08), rgba(55,201,232,.02));
  border:1px solid rgba(55,201,232,.28); border-radius:16px; padding:1.6rem; margin:1.6rem 0;
}
.docs-highlight-card h3{ font-family:var(--serif); font-weight:400; font-size:1.35rem; color:var(--fg); margin:.5rem 0 .6rem; }
.docs-highlight-card p{ font-size:.9rem; color:var(--fg-dim); line-height:1.65; margin-bottom:1rem; }
.docs-highlight-badge{
  display:inline-block; font-family:var(--sans); font-size:.74rem; font-weight:700;
  color:var(--accent); border:1px solid var(--accent); border-radius:100px; padding:.3rem .8rem;
}

/* tablolar */
.docs-table{
  width:100%; border-collapse:collapse; margin:.8rem 0; font-size:.84rem;
  background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.1); border-radius:10px; overflow:hidden;
}
.docs-table th,.docs-table td{ text-align:left; padding:.6rem .85rem; border-bottom:1px solid rgba(127,140,160,.16); color:var(--fg); vertical-align:top; }
.docs-table td:last-child{ color:var(--fg-dim); }
.docs-table th{ font-family:var(--sans); font-weight:700; color:var(--fg); background:rgba(127,140,160,.10); }
.docs-table tr:last-child td{ border-bottom:none; }
.docs-table .sut-code{ font-family:'Courier New',monospace; color:var(--accent); font-weight:600; }
.docs-table .required-yes{ color:#4ade80; font-weight:600; }
.docs-table .required-no{ color:var(--fg-dim); }

/* rate kartları */
.docs-rate-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:.85rem; margin:.9rem 0; }
.docs-rate-card{
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1);
  border-radius:12px; padding:1.1rem; text-align:center;
}
.docs-rate-val{ font-family:var(--serif); font-size:1.7rem; color:var(--accent); line-height:1; }
.docs-rate-label{ font-size:.76rem; color:var(--fg-dim); margin-top:.5rem; }

/* info / warn kutuları */
.docs-info-box,.docs-warn-box{ font-size:.84rem; line-height:1.6; padding:.85rem 1.1rem; border-radius:10px; margin:.8rem 0; }
.docs-info-box{ color:var(--fg-dim); background:rgba(55,201,232,.07); border:1px solid rgba(55,201,232,.2); }
.docs-info-box strong,.docs-warn-box strong{ color:var(--fg); }
.docs-info-box code,.docs-warn-box code{ font-size:.8em; }
.docs-warn-box{ color:var(--fg-dim); background:rgba(240,170,90,.08); border:1px solid rgba(240,170,90,.28); }

/* placeholder listesi + alt başlık */
.docs-pacs-subtitle{ font-family:var(--sans); font-weight:700; font-size:.95rem; color:var(--fg); margin:1.3rem 0 .7rem; display:flex; align-items:center; gap:.5rem; }
.docs-placeholder-list{ list-style:none; font-size:.85rem; line-height:2; color:var(--fg-dim); margin:.5rem 0; }
.docs-placeholder-list li::before{ content:"▹ "; color:var(--accent); }

/* ===== LIGHT TEMA: docs kapları temiz beyaz kart, yazılar okunur ===== */
html[data-theme="light"] .docs-tab-bar{ background:#fff; border-color:rgba(15,36,64,.10); box-shadow:0 4px 16px rgba(15,36,64,.06); }
html[data-theme="light"] .docs-tab-btn.active{ background:rgba(20,96,216,.12); color:var(--accent); }
html[data-theme="light"] .docs-tab-btn:hover:not(.active){ background:rgba(15,36,64,.05); color:var(--fg); }
html[data-theme="light"] .docs-table{ background:#fff; border-color:rgba(15,36,64,.10); box-shadow:0 4px 16px rgba(15,36,64,.06); }
html[data-theme="light"] .docs-table th{ background:#eaf1fb; }
html[data-theme="light"] .docs-table th,html[data-theme="light"] .docs-table td{ border-bottom-color:rgba(15,36,64,.08); }
html[data-theme="light"] .docs-rate-card{ background:#fff; border-color:rgba(15,36,64,.10); box-shadow:0 4px 14px rgba(15,36,64,.05); }
html[data-theme="light"] .docs-collapsible-btn{ background:#fff; border-color:rgba(15,36,64,.12); color:var(--fg); }
html[data-theme="light"] .docs-note{ background:rgba(20,96,216,.06); border-color:rgba(20,96,216,.22); }
html[data-theme="light"] code{ background:rgba(20,96,216,.09); }
/* kod blokları her iki temada da KOYU kalır (standart) — sadece kenarı yumuşat */
html[data-theme="light"] .docs-code-block{ border-color:rgba(15,36,64,.12); box-shadow:0 6px 18px rgba(15,36,64,.08); }

@media(max-width:680px){
  .docs-tab-bar{ flex-direction:column; border-radius:16px; width:calc(100% - 2rem); }
  .docs-tab-btn{ border-radius:10px; }
  .docs-step-grid{ grid-template-columns:1fr; }
  .docs-table{ font-size:.78rem; }
  .docs-code-block pre{ font-size:.74rem; }
}

/* ---------- HERO — PROFESYONEL BOLD TİPOGRAFİ ---------- */
/* süslü serif/italik kaldırıldı → Inter ağır weight, kurumsal görünüm */
.hero__title{
  font-family:'Inter','Manrope',sans-serif !important;
  font-weight:900 !important;
  font-style:normal !important;
  font-size:clamp(40px,6.6vw,96px) !important;
  line-height:1.02 !important;
  letter-spacing:-.035em !important;
  text-transform:none;
  text-shadow:0 4px 40px rgba(3,7,16,.55);
}
.hero__title span{ display:block; }
.hero__title .hl,
.hero__title .it{
  color:var(--accent) !important;
  font-style:normal !important;
  font-weight:900 !important;
}
.hero__sub{
  font-family:'Manrope',sans-serif !important;
  font-weight:600 !important;
  font-size:clamp(16px,1.5vw,21px) !important;
  line-height:1.55 !important;
  color:var(--fg-dim);
  max-width:600px;
  margin-top:26px !important;
}
/* hero ortası daha dengeli boşluk */
.hero__btns{ margin-top:34px !important; }
.hero__btns .btn{ font-weight:700 !important; font-size:15px !important; padding:13px 26px !important; }

/* genel başlıkları da biraz kalınlaştır (profesyonel) */
h2.big, .feat h3, .stat .n, .price h3{ letter-spacing:-.02em; }
.section-tag{ font-weight:700; }