/* ==========================================================================
   FF/09-QA.CSS — FlexFolio skin: YAKUNIY QA YAMOQLARI
   Otabek, 2026-08-07.

   Bu fayl bo'lim fayllari (03–07) yozilgandan KEYIN, brauzerda o'lchab
   topilgan kesishma muammolarni yopadi. Har bir blok "nima uchun" izohi
   bilan — bular estetik injiqlik emas, o'lchangan nuqsonlar.
   ========================================================================== */


/* ==========================================================================
   1. SARLAVHA SCROLL PAYTIDA KONTENT USTIGA TUSHYAPTI
   Ikki mustaqil tekshiruvchi agent qayd etdi: `#site-header` fixed va
   butunlay shaffof bo'lgani uchun nav havolalari orqadagi sarlavha/karta
   matni bilan ustma-ust tushib, ikkalasi ham o'qilmay qoladi.

   Referensda bu muammo yo'q, chunki FlexFolio sarlavhasi UMUMAN fixed emas —
   o'lchov buni tasdiqladi (sahifada fixed element faqat "Made in Framer"
   nishoni). Lekin bizda nav xatti-harakati saqlanadi (kelishuv: "faqat
   uslub"), shuning uchun boshqa yechim: `.scrolled` holatida panelga
   FlexFolio'ning O'Z tilidagi qatlam beriladi — yarim shaffof oq +
   `backdrop-filter: blur()`. Aynan shu retsept referensda "2.4k+ Reviews"
   suzuvchi pilida ishlatilgan (`rgba(255,255,255,.2)` + `blur(8px)`).
   Sahifa tepasida (scroll qilinmagan holatda) panel avvalgidek toza shaffof.
   ========================================================================== */
/* YECHIM: sarlavha SKROLL BILAN KETADI — referensdagidek.
   O'lchov bilan tasdiqlandi: FlexFolio sahifasida `position:fixed` bo'lgan
   yagona element — "Made in Framer" nishoni. Sarlavhaning o'zi fixed EMAS,
   u sahifa bilan birga yuqoriga chiqib ketadi.

   Ilgari men uni fixed qoldirib, skrollda oq yarim shaffof pill qo'shgandim.
   QA buni ikki tomonlama nuqson deb topdi:
     · SPEC 8.1 ni buzadi ("oq pill qobiq YO'Q"),
     · apelsin CTA panelining ustiga tushib, "Loyihangizni bugun boshlaylik"
       sarlavhasini o'rtasidan qirqadi va faol nav havolasining kontrastini
       4.78:1 dan 3.03:1 ga tushiradi.
   Sarlavhani referensdagidek oqimga qaytarish ikkala muammoni ham yo'q qiladi.

   Yopishqoq nav kerak bo'lsa: shu blokni olib tashlash kifoya —
   `parts/01-chrome.css` dagi `position:fixed` yana kuchga kiradi. */
#site-header{
  position:absolute;
  top:20px;
  pointer-events:none;
}
#site-header .nav-shell{ pointer-events:auto; }

#site-header.scrolled .nav-shell{
  background:transparent !important;
  background-image:none !important;
  -webkit-backdrop-filter:none !important;
          backdrop-filter:none !important;
  border-radius:0 !important;
  padding:0 !important;
  box-shadow:none !important;
}


/* ==========================================================================
   1a. BO'LIM FONLARI SHAFFOF BO'LISHI SHART
   `parts/04-jarvis-bosh.css` `#jarvis{background:var(--page)}` yozadi, ff/06
   esa `#ustunliklar` ga xuddi shunday. Qattiq `#F5F5F5` fon `.bg-layer`
   dagi iliq shaftoli nurni ham, `body` ning issiq gradientini ham to'sib
   qo'yadi — natijada sahifa tekis kulrang bo'lib qoladi va referensning
   iliqligi yo'qoladi.

   MUHIM: bu yerda `background` SHORTHAND ishlatilmaydi — u ff/08 dagi
   yo'lakcha qatlamini (background-image) o'chirib yuborardi. Faqat
   `background-color`. ID selektorlarni yengish uchun spetsifiklik ID
   darajasida beriladi.
   ========================================================================== */
#hero, #trust, #xizmatlar, #jarvis, #jarayon, #ishlar,
#tamoyillar, #ustunliklar, #fikrlar, #savollar, #boshlash,
#jarvis > .sec-light, #jarvis > .lanes{
  background-color:transparent;
}


/* ==========================================================================
   1a-bis. YO'LAKCHALARDAGI UZILISHLARNI YOPISH
   O'lchov (blok qamrovi bo'yicha) quyidagi bo'shliqlarni ko'rsatdi:
     1094→1351 (257px)  — `#trust`: ff/03 dagi `#trust{background:transparent}`
                          ID kuchi bilan ff/08 ning yo'lakcha qatlamini o'chirgan
     2935→3018 ( 83px)  — `#jarvis` ning yuqori paddingi (bolalari qamramaydi)
     8848→8934 ( 86px)  — `#jarvis` ning pastki paddingi
     4109→7766          — `.lanes`, ATAYLAB istisno
   Birinchi uchtasi yopiladi: `#trust` ga ID darajasida yo'lakcha beriladi,
   `#jarvis` ning paddingi esa bolalariga ko'chiriladi — shunda bolalar
   butun bo'limni uzluksiz qoplaydi.
   ========================================================================== */
#trust{
  background-image:
    repeating-linear-gradient(180deg, var(--rail) 0 3px, transparent 3px 5px),
    repeating-linear-gradient(180deg, var(--rail) 0 3px, transparent 3px 5px);
  background-size:1px 5px, 1px 5px;
  background-position:
    calc(50% - var(--wrap) / 2) 0,
    calc(50% + var(--wrap) / 2 - 1px) 0;
  background-repeat:repeat-y, repeat-y;
}

#jarvis{ padding-block:0 !important; }
#jarvis > .sec-light:first-of-type{ padding-top:var(--band); }
#jarvis > .jv-proof-band{ padding-bottom:var(--band-b); }

/* Footer ostidagi 28px — yo'lakcha sahifa oxirigacha yetib borsin */
.site-footer{ padding-bottom:calc(var(--band-b) + 28px); }

@media (max-width:1279px){
  #trust{ background-image:none; }
}


/* ==========================================================================
   1b. AJRATGICH CHIZIQNI BARCHA BLOK CHEGARASIGA BIR XIL RETSEPT BILAN
   `#trust` bo'limida `.section` klassi yo'q (`class="trust-band"`), shuning
   uchun 08-signature dagi `.section::after` unga tegmaydi va ff/03 o'zining
   soddaroq (tugunsiz) variantini yozgan edi. Natijada sahifada ikki xil
   ajratgich paydo bo'lgan. Bu yerda hammasi bitta retseptga keltiriladi.
   ========================================================================== */
#trust::after,
.trust-band::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:-5px;
  transform:translateX(-50%);
  box-sizing:border-box;
  width:calc(min(var(--wrap), 100% - var(--pad) * 2) + 10px);
  height:10px;
  padding-inline:10px;
  pointer-events:none;
  z-index:3;
  background-image:
    radial-gradient(circle at 5px 5px,
      var(--rail-dot) 0 3.9px, var(--rail) 3.9px 5px, transparent 5px),
    radial-gradient(circle at calc(100% - 5px) 5px,
      var(--rail-dot) 0 3.9px, var(--rail) 3.9px 5px, transparent 5px),
    repeating-linear-gradient(90deg, var(--rail) 0 3px, transparent 3px 5px);
  background-size:10px 10px, 10px 10px, auto 1px;
  background-position:left center, right center, center center;
  background-repeat:no-repeat, no-repeat, repeat-x;
  background-origin:border-box, border-box, content-box;
  background-clip:border-box, border-box, content-box;
  border:0;
}


/* ==========================================================================
   1c. AJRATGICH CHIZIQ HECH QAYSI KARTAGA YOPISHIB QOLMASIN
   O'lchov: `#jarvis > .sec-light` blokida pastki padding YO'Q edi — uning
   ajratgichi (y=4023) `.jf-card` kartalarining pastki qirrasiga AYNAN 0px
   masofada tushib, chiziq kartaga yopishib qolgan edi.
   Bo'limlarda bu muammo yo'q, chunki ularda `--band-b` (86px) bor; shu
   ritm ichki bloklarga ham beriladi.
   ========================================================================== */
#jarvis > .sec-light{
  padding-bottom:var(--band-b);
}
#jarvis > .lanes{
  padding-bottom:clamp(32px, 3.5vw, 48px);
}


/* ==========================================================================
   2. KURSOR PROJEKTORI VA TILT — GLOBAL O'CHIRISH
   `depth.css:230` `[data-spot]::before` ga binafsha radial gradient, `:252`
   esa `[data-tilt]:hover` ga ko'tarilish beradi. Bo'lim fayllarida ular
   faqat ba'zi bo'limlarda o'chirilgan — qolgan bo'limlarda eski binafsha
   nur hamon chiqadi. FlexFolio yuzalari sokin: o'lchovda na kursor nuri,
   na hover-tilt topildi. Shuning uchun global o'chiriladi.
   ========================================================================== */
[data-spot]::before,
[data-spot]::after{
  display:none !important;
  background:none !important;
}

[data-tilt]:hover{
  transform:none !important;
}


/* ==========================================================================
   3. APELSIN BANNER ICHIDAGI TA'KID SO'ZI
   `.h2-accent` banner ichida `rgba(255,255,255,.78)` bo'lib qolgan edi —
   apelsin ustida 3.45:1. Referensdagi banner sarlavhasi TO'LIQ OQ
   (ref-04.jpg), ya'ni to'liq oq qilish bir vaqtning o'zida ham 1:1 ga
   yaqinroq, ham kontrastli.
   ========================================================================== */
.aw-cta .h1-accent,
.aw-cta .h2-accent,
.jv-cta .h1-accent,
.jv-cta .h2-accent{
  color:#FFFFFF !important;
  -webkit-text-fill-color:#FFFFFF !important;
}


/* ==========================================================================
   4. MINI-DEMO MAKETLARIDAGI ORTIQCHA APELSIN
   `.tp-img` — mahsulot RASMI o'rni (plomba), `.mb-graph i` — diagramma
   ustunlari. Ular to'liq apelsin gradient bo'lib qolgan va maketni
   "apelsin devor" qilib yuborgan. Referensda bunday maketlarda rang faqat
   HARAKAT elementida (tugma, tasdiq belgisi) bo'ladi, plombalar neytral.
   ========================================================================== */
.tp-img{
  background:linear-gradient(160deg, #F2F2F2 0%, #E9E9E9 100%) !important;
  background-color:#EFEFEF !important;
  border:0;
}

.mb-graph i{
  background:rgba(30,13,1,.14) !important;
}
.mb-graph i:last-child,
.mb-graph i:nth-child(4){
  background:var(--blue) !important;
}

/* `.ai-badge` — 11px matn och-apelsin pill ustida 4.22:1 edi.
   Pill foni oq bo'lsa 4.66:1 (AA) chiqadi. */
.ai-badge{
  background:#FFFFFF !important;
  color:var(--blue-ink) !important;
  box-shadow:var(--sh-1);
}


/* ==========================================================================
   5. FOOTER LOGOTIPI — chrome qatlami bilan bir tilda
   ========================================================================== */
.footer-brand .logo-name,
.site-footer .logo-name{
  font-family:var(--display);
  font-weight:500;
  font-size:20px;
  letter-spacing:-0.03em;
  text-transform:none;
  color:var(--ink);
}
.footer-brand .logo-tag,
.site-footer .logo-tag{
  font-family:var(--body);
  font-weight:500;
  font-size:13px;
  letter-spacing:.08em;
  color:var(--ink-mut);
}

/* Footer matni fon nuri ustida 4.4996:1 (chegarada) — bir oz quyuqlashtiramiz */
.footer-brand p,
.site-footer .footer-brand p{
  color:rgba(30,13,1,.68);
}


/* ==========================================================================
   6. QOLIB KETGAN ESKI PALITRA — XAVFSIZLIK TO'RI
   Skin 300+ joyni token orqali qamraydi, lekin ba'zi qoidalarda binafsha
   qattiq yozilgan bo'lishi mumkin. Bu blok ular uchun oxirgi to'siq:
   eski brend rangi qayerda qolsa ham, aksent apelsinga tortiladi.
   ========================================================================== */
.status-dot,
.chk,
.kb-pay,
.mb-cta,
.ai-orb,
.vm-play{
  background-color:var(--blue);
}

::selection{
  background:rgba(249,117,24,.22);
  color:var(--ink);
}


/* ==========================================================================
   7. MOBIL — oxirgi tekislash
   ========================================================================== */
@media (max-width:767px){
  /* mobilda panel har doim o'qiladigan bo'lsin — kontent ostidan o'tadi */
  #site-header.scrolled .nav-shell{
    padding:0 8px 0 14px !important;
  }

  .aw-panel{ background:rgba(255,255,255,.35); }
}


/* ==========================================================================
   8. BOSMA
   ========================================================================== */
@media print{
  .bg-layer,
  .grain,
  #chat-fab,
  #chat-float-shell,
  #scroll-progress{ display:none !important; }

  body{ background:#fff; }
  .section::after{ display:none; }
}


/* ==========================================================================
   9. "MIJOZLAR FIKRI" BLOKI — referens "Trusted by Founders" anatomiyasi
   (Otabek, 2026-08-07, referens skrinshoti bo'yicha)

   Referensda karta ichidagi TARTIB boshqacha:
       1-qator: dumaloq avatar + ism / lavozim
       2-qator: apelsin yulduzchalar + "5.0"
       3-qator: iqtibos matni
   Bizda esa iqtibos birinchi, imzo oxirida edi. HTML TEGILMAYDI —
   tartib `order` va `figcaption` ichidagi grid bilan almashtiriladi.
   Bo'lim boshi ham referensdagidek CHAPGA tekislanadi.
   ========================================================================== */
#fikrlar .sec-head{
  text-align:left;
  align-items:flex-start;
  margin-inline:0;
  max-width:none;
}
#fikrlar .sec-head .sec-sub{ margin-inline:0; }

#fikrlar .fk-card{
  display:flex;
  flex-direction:column;
  gap:22px;
  background:#FFFFFF;
  border:0;
  border-radius:var(--r-lg);
  padding:30px;
  box-shadow:none;
}

/* Referensda katta tirnoq belgisi yo'q */
#fikrlar .fk-qmark{ display:none !important; }

/* imzo bloki KARTANING BOSHIGA chiqadi */
#fikrlar .fk-card figcaption{
  order:-1;
  display:grid;
  grid-template-columns:auto 1fr;
  grid-template-areas:
    "ava who"
    "stars stars";
  align-items:center;
  column-gap:14px;
  row-gap:18px;
  margin:0;
  padding:0;
  border:0;
}

#fikrlar .fk-ava{
  grid-area:ava;
  width:48px;
  height:48px;
  border-radius:100px;
  display:grid;
  place-items:center;
  background:var(--blue-lo);
  color:var(--blue-ink);
  font-family:var(--body);
  font-weight:600;
  font-size:15px;
  letter-spacing:.02em;
  border:0;
}

#fikrlar .fk-who{ grid-area:who; display:flex; flex-direction:column; gap:2px; }
#fikrlar .fk-who b{
  font-family:var(--body);
  font-size:18px;
  font-weight:600;
  letter-spacing:-0.2px;
  color:var(--ink);
}
#fikrlar .fk-who em{
  font-family:var(--body);
  font-style:normal;
  font-size:15px;
  font-weight:500;
  color:var(--ink-mut);
}

/* yulduzchalar apelsin + yoniga "5.0" (referensdagidek) */
#fikrlar .fk-stars{
  grid-area:stars;
  display:inline-flex;
  align-items:center;
  gap:5px;
}
#fikrlar .fk-stars i{ background:var(--blue); color:var(--blue); }
#fikrlar .fk-stars::after{
  content:"5.0";
  margin-left:7px;
  font-family:var(--body);
  font-size:16px;
  font-weight:600;
  color:var(--ink);
}

#fikrlar .fk-card blockquote{
  margin:0;
  font-family:var(--body);
  font-size:18px;
  font-weight:500;
  line-height:1.5;
  letter-spacing:-0.2px;
  color:var(--ink);
}

@media (max-width:767px){
  #fikrlar .fk-card{ padding:24px; gap:18px; }
  #fikrlar .fk-card blockquote{ font-size:16px; }
}

/* Referensda karta ichidagi hamma narsa CHAPGA tekislangan; bizda
   `.fk-card` markazlashgan matnni meros olgan edi. */
#fikrlar .fk-card,
#fikrlar .fk-card blockquote,
#fikrlar .fk-who,
#fikrlar .fk-who b,
#fikrlar .fk-who em{
  text-align:left;
}
#fikrlar .fk-who{ align-items:flex-start; }
