/* ============================================================================
   InvisiDocs — v2 tasarım sistemi
   2026-08-29 Rossum dilbilgisi ("açık sayfa, iki koyu bant") ile doğdu;
   09-01'de (Serdar) eski AÇIK-ZEMİNLİ BÖLÜMLER KALDIRILDI — sayfa koyudur;
   tek beyaz bölüm ICP akordeonu (#icp, r.3 — sections.css). Bu dosyada
   kalanlar: token'lar, taban, chrome (header/footer),
   hero, tez şeridi, kapanış. Tahta stili story2.css'te; yeni bölümler
   (#caps, #icp) sections.css'te. Açık-zemin token'ları (--s-*, --ink…)
   SİLİNMEDİ: ICP sahnelerindeki beyaz ürün pencereleri kullanır.
   Kapsam: docs/invisidocs-platform-spec.md
   ========================================================================= */

:root{
  /* ── KOYU ZEMİNLER ────────────────────────────────────────────────────── */
  --d-hero:#0B1526; --d-deep:#060E1B; --d-chrome:#101B2E;
  --d-chrome-glass:rgba(11,21,38,.90);
  --d-text:#fff; --d-body:#C7D2E3; --d-muted:#8496B0;
  --d-line:rgba(255,255,255,.10); --d-line-2:rgba(255,255,255,.16);
  --d-link:#8FB4FF;

  /* ── AÇIK YÜZEYLER (sahnelerdeki beyaz ürün pencereleri) ──────────────── */
  --s-0:#fff; --s-1:#F6F8FC; --s-2:#F1F3F7;
  --s-wash-blue:#EAF0FB; --s-wash-green:#E4F7F2; --s-wash-amber:#FDF0DC;

  /* ── MÜREKKEP (açık yüzey üstü) ────────────────────────────────────────── */
  --ink:#0B1526; --ink-2:#1B2740; --body:#5B6C87; --muted:#8496B0;

  /* ── AKSAN ────────────────────────────────────────────────────────────── */
  --blue:#2A6BE0; --blue-hover:#1B4CAD; --blue-quiet:#4C8CFF;

  /* ── SEMANTİK (açık yüzey payload durumları) ──────────────────────────── */
  --evidence:#0B7A68; --caution:#8F5D0B; --abstain:#5B6C87;

  /* ── ÇİZGİLER (açık yüzey) ────────────────────────────────────────────── */
  --line:#E4EAF4; --line-strong:#DCE4F0;

  /* ── GRADYANLAR ───────────────────────────────────────────────────────── */
  --g-hero:radial-gradient(120% 90% at 100% 0%,#16305C 0%,#0B1526 62%);

  /* ── GÖLGELER ─────────────────────────────────────────────────────────── */
  --sh-card:0 1px 16px 1px rgba(11,21,38,.06);
  --sh-raise:0 8px 32px -8px rgba(11,21,38,.12);

  /* ── YARIÇAP ──────────────────────────────────────────────────────────── */
  --r-chip:8px; --r-sm:16px; --r-card:24px; --r-panel:32px;
  --r-btn:100px; --r-pill:999px;

  /* ── HAREKET ──────────────────────────────────────────────────────────── */
  --t-1:.25s ease-in-out; --t-2:.3s ease-in-out;
  /* koyu-zemin vurgu seti (tahta + koyu bölümler) */
  --hi-blue:#6FA8FF; --hi-mint:#4FE3B1; --hi-amber:#FFC94A; --hi-violet:#C4B5FD;

  /* ── KAPSAYICILAR ─────────────────────────────────────────────────────── */
  --w-hero:1360px; --w-wide:1400px; --w-standard:1200px;
  --w-narrow:880px; --w-prose:680px;
}

/* ── Taban — sayfa zemini artık KOYU ───────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box}
html{font-size:16px;-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0; background:var(--d-hero); color:#fff;
  font:400 16px/26px Inter,-apple-system,"Segoe UI",Roboto,sans-serif;
  -webkit-font-smoothing:antialiased;
}
img,svg{max-width:100%;display:block}
a{color:var(--d-link);text-decoration:none}
h1,h2,h3,h4{margin:0;font-weight:600;color:#fff;letter-spacing:-.02em}
p{margin:0}
ul{margin:0;padding:0;list-style:none}
.mono{font-family:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace}

.wrap{max-width:var(--w-standard);margin:0 auto;padding:0 20px}
.wrap--hero{max-width:var(--w-hero)} .wrap--wide{max-width:var(--w-wide)}
.wrap--narrow{max-width:var(--w-narrow)} .wrap--prose{max-width:var(--w-prose)}

.eyebrow{font:600 13px/20px Inter,sans-serif;letter-spacing:1.4px;text-transform:uppercase;color:var(--d-muted)}
h1{font:600 32px/38px Inter,sans-serif;letter-spacing:-.4px}
h2{font:600 26px/32px Inter,sans-serif;letter-spacing:-.6px}
h3{font:600 20px/28px Inter,sans-serif;letter-spacing:-.2px}
h4{font:600 18px/26px Inter,sans-serif;letter-spacing:0}

/* ── Butonlar — dolgulu buton yalnız TEK gerçek dönüşüm için ───────────── */
.btn{display:inline-block;border:0;background:none;padding:0;cursor:pointer;font-family:inherit}
.btn__t{
  display:inline-block;min-width:180px;padding:14px 32px;
  border:2px solid var(--blue);border-radius:var(--r-btn);
  background:var(--blue);color:#fff;font:600 15px/22px Inter,sans-serif;
  text-align:center;transition:background var(--t-1),border-color var(--t-1),color var(--t-1);
}
.btn__t:hover{background:var(--blue-hover);border-color:var(--blue-hover)}
.btn--lg .btn__t{padding:20px 36px;font:600 17px/24px Inter,sans-serif}
.btn--on-dark .btn__t{background:#fff;border-color:#fff;color:var(--d-hero)}
.btn--on-dark .btn__t:hover{background:var(--d-link);border-color:var(--d-link)}
.btn--ghost-dark .btn__t{background:transparent;border-color:var(--d-line-2);color:#fff;min-width:0;padding:11px 22px}
.btn--ghost-dark .btn__t:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.34)}

/* Bölüm içi ikincil gezinme ASLA buton değil — metin linki + chevron */
.tlink{display:inline-flex;align-items:center;gap:8px;font:400 17px/28px Inter,sans-serif;color:var(--d-link)}
.tlink svg{transition:transform var(--t-2)}
.tlink:hover svg{transform:translateX(3px)}

/* ── 1. HEADER ─────────────────────────────────────────────────────────── */
.hdr{position:sticky;top:0;z-index:100;background:var(--d-chrome);
  transition:background var(--t-1),backdrop-filter var(--t-1),box-shadow var(--t-1)}
.hdr.is-stuck{background:var(--d-chrome-glass);backdrop-filter:blur(20px);
  box-shadow:0 1px 0 rgba(255,255,255,.06)}
.hdr__in{display:flex;align-items:center;justify-content:space-between;gap:24px;height:88px;
  max-width:var(--w-hero);margin:0 auto;padding:0 20px}
.brand{font:600 20px/1 Inter,sans-serif;letter-spacing:-.4px;color:#fff}
.brand span{color:var(--blue-quiet)}
.hdr__nav{display:none;gap:28px}
.hdr__nav a{font:500 15px/22px Inter,sans-serif;color:var(--d-body);transition:color var(--t-1)}
.hdr__nav a:hover{color:#fff}
.hdr__right{display:flex;align-items:center;gap:14px}
/* (TR dil düğmesi r.9'da kaldırıldı — Türkçe sürüm yok.) */

/* ── 2. HERO ───────────────────────────────────────────────────────────── */
.hero{background:var(--g-hero);color:#fff;padding:64px 0 72px;overflow:hidden}
.hero__row{display:flex;flex-direction:column;gap:48px}
.hero__msg{flex:1 0 auto;max-width:660px}
.hero h1{color:#fff;margin-bottom:16px}
.hero__deck{font:400 17px/28px Inter,sans-serif;color:var(--d-body);max-width:600px;margin-bottom:18px}
.hero__status{margin-top:16px;font:400 13px/20px Inter,sans-serif;color:var(--d-muted)}

@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* (Tez şeridi r.5'te ayrı bölüm olmaktan çıktı → sections.css .caps__thesis) */

/* ── ERKEN ERİŞİM FORMU (koyu) — sayfadaki TEK dönüşüm ─────────────────── */
.close{background:var(--d-hero);color:#fff;padding:96px 0;text-align:center}
.close__lead{font:400 18px/30px Inter,sans-serif;color:var(--d-body);margin:0 auto 36px;max-width:60ch}
.ea{max-width:680px;margin:0 auto;text-align:left;color-scheme:dark}
.ea__grid{display:grid;gap:14px}
.ea__f{display:flex;flex-direction:column;gap:7px}
.ea__f span{font:600 11.5px/16px Inter,sans-serif;letter-spacing:.7px;text-transform:uppercase;color:var(--d-muted)}
.ea input,.ea select,.ea textarea{width:100%;background:rgba(255,255,255,.05);border:1px solid var(--d-line-2);border-radius:12px;
  color:#fff;padding:12px 14px;font:400 15px/22px Inter,sans-serif;outline:0;transition:border-color var(--t-1),box-shadow var(--t-1)}
.ea textarea{resize:vertical;min-height:88px}
.ea select{appearance:none;-webkit-appearance:none;padding-right:40px;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%238496B0' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center}
.ea select:invalid{color:var(--d-muted)}
.ea input::placeholder,.ea textarea::placeholder{color:rgba(255,255,255,.32)}
.ea input:focus,.ea select:focus,.ea textarea:focus{border-color:var(--blue-quiet);box-shadow:0 0 0 3px rgba(76,140,255,.22)}
.ea__hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.ea__actions{margin-top:26px;text-align:center}
.ea__msg{margin-top:14px;min-height:20px;font:400 14px/20px Inter,sans-serif;color:var(--hi-mint)}
.ea__msg.is-err{color:var(--hi-amber)}
.ea__note{margin-top:8px;font:400 13px/20px Inter,sans-serif;color:var(--d-muted)}
.ea__note a{color:var(--d-body);text-decoration:underline;text-underline-offset:3px;transition:color var(--t-1)}
.ea__note a:hover{color:#fff}

/* ── FOOTER (r.9: marka + tek cümle + telif; link sütunları yok) ────────── */
.foot{background:var(--d-chrome);color:var(--d-body);padding:56px 0 32px}
.foot__top{padding-bottom:36px}
.foot__tag{font:400 15px/25px Inter,sans-serif;color:var(--d-muted);max-width:44ch;margin-top:14px}
.foot__bottom{border-top:1px solid var(--d-line);padding-top:24px;text-align:center;
  font:400 13px/20px Inter,sans-serif;color:var(--d-muted);opacity:.5}

/* ═══ ≥750px ═══════════════════════════════════════════════════════════ */
@media (min-width:750px){
  .wrap{padding:0 24px} .hdr__in{padding:0 24px}
  h1{font:600 38px/46px Inter,sans-serif;letter-spacing:-.5px}
  h2{font:600 32px/40px Inter,sans-serif;letter-spacing:-.6px}
  h3{font:600 22px/30px Inter,sans-serif}
  .hero{padding:76px 0 88px}
  .hero__row{flex-direction:row;align-items:center;gap:40px}
  .ea__grid{grid-template-columns:1fr 1fr;gap:16px}
  .ea__f--full{grid-column:1 / -1}
}

/* ═══ ≥1000px ══════════════════════════════════════════════════════════ */
@media (min-width:1000px){
  .wrap{padding:0 32px} .hdr__in{padding:0 32px}
  .hdr__nav{display:flex}
  h1{font:600 40px/50px Inter,sans-serif;letter-spacing:-.6px}
  h2{font:600 34px/42px Inter,sans-serif}
  h3{font:600 24px/32px Inter,sans-serif}
  .hero__deck{font:400 18px/32px Inter,sans-serif}
  .close{padding:112px 0 104px}
}

/* ═══ ≥1200px ══════════════════════════════════════════════════════════ */
@media (min-width:1200px){
  .wrap{padding:0 40px} .hdr__in{padding:0 40px}
  h1{font:600 42px/52px Inter,sans-serif;letter-spacing:-.7px}
  .hero{padding:96px 0 112px}
  .hero__row{gap:60px}
  .hero__msg{max-width:660px}
}
