/* ==========================================================================
   G5 · KATALOG KOMPOZITSIYASI  (5-brif, 2026-09-13)

   Bu fayl sahifaning OXIRGI qatlami (qur.py: … → boshliq4 → r-katalog → g5 →
   g5-katalog). Eski katalog CSS lariga (kat.css · kat2.css · z-katalog.css ·
   r-katalog.css) BIR QATOR ham tegilmadi — ortga qaytarish shu faylni
   oʻchirish bilan boʻladi.

   ⚠ NEGA `data-blok` NOMLARI «KAT-…» boʻlib qoldi (G- / K- prefiksi emas):
   ishlab chiqarish darvozasi `kat.css` §0 da `[data-blok^="KAT"]` selektori
   bilan yozilgan — `.mijozdan` tokenlari, `.kat-kutilmoqda` bloklari,
   `.kat-namuna` namunalari va `[hidden]{display:none!important}` qoidasi
   shunga bogʻlangan. Blok kodini almashtirish bu darvozani OCHIB yuborardi
   (mijozga «MIJOZDAN: …» yozuvlari koʻrinib qolardi). Shuning uchun kod
   saqlandi, yangi tizim esa KLASS orqali keladi: `.g5-b` · `.g5--canvas` ·
   `.g5--navy` · `.g5-kadr` · `.g5-shapka` · `.g5-yorliq`.
   Eski `[data-blok="KAT-…"]` padding qoidalari (kat.css §1, z-katalog §1,
   r-katalog §1) `main [data-blok].g5-b…` (0-3-1) dan past ogʻirlikda va
   undan OLDIN yuklanadi — ritmni endi faqat g5 boshqaradi.

   ARXETIP HAR BOʻLIMDA ALMASHADI (qoʻshni ikkitasi bir xil koʻrinmaydi):
     KAT-01  toʻliq kenglikdagi foto hero              · QUYUQ (1/2)
     KAT-04  ASBOB — qidiruv · indeks · rels · toʻr    · canvas
     KAT-03  editorial split: yopishqoq shapka + registr · oq
     KAT-08  tor oʻlchovli raqamli akkordeon           · canvas
     KAT-09  ikki auditoriya + forma + 4:5 kadr        · QUYUQ (2/2)
   ========================================================================== */


/* ==========================================================================
   §1 · RITM — ajralish 104–180 px (g5.css §2 tokenlari)
     hero → KAT-04 :  0 + 96 =  96   (hero oʻz paddingini oʻzi beradi)
     KAT-04 → KAT-03: 82 + 82 = 164
     KAT-03 → KAT-08: 82 + 82 = 164
     KAT-08 → KAT-09: 82 + 96 = 178
   Boʻlimlar tegib turadi — margin qoʻyilmaydi (sirt juftligi buzilmasin).
   ========================================================================== */
main [data-blok="KAT-04"].g5-b{padding-block:var(--g5-p-bob) var(--g5-p-keng)}

/* ASBOB maydoni 900 px dan baland: bu SABABLI — filtr relsi, mahsulot toʻri,
   holat bloki va sahifalash bitta uzluksiz ish maydoni. Boʻlim balandligi
   ajralishga taʼsir qilmaydi (SECTION HEIGHT ≠ SECTION SEPARATION). */


/* ==========================================================================
   §2 · SIRT — qoʻshni ikki boʻlim hech qachon bir xil fonda emas
   ========================================================================== */
/* KAT-03 oq: `.k2-reg{background:var(--pogona-1)}` (0-1-0) bosib oʻtiladi */
main [data-blok="KAT-03"]{background:var(--g5-oq)}
/* KAT-08 va KAT-09 sirtlari `.g5--canvas` / `.g5--navy` orqali (!important) */


/* ==========================================================================
   §3 · YORLIQ — raqamli variant
   Dek boʻlim yorliqlarini raqamlaydi (01 YOʻNALISHLAR … 04 SAVOL-JAVOB).
   Raqam KOMPOZITSIYA elementi: `content` orqali chiqadi, matn tugunida emas.
   g5-dagi kvadrat nuqta oʻrnini raqam egallaydi — ikkalasi birga turmaydi.
   ========================================================================== */
.g5-yorliq--n::before{
  content:attr(data-raqam) " /";
  width:auto;height:auto;background:none;border-radius:0;
  color:var(--aksent-mayda);font-weight:700;letter-spacing:0;
  font-variant-numeric:tabular-nums;
}
.k2-bolim-bosh .g5-yorliq{justify-self:start}


/* ==========================================================================
   §4 · KAT-01 · HERO — «the image should dominate»
   Rasm qaytdi: v3-hero-katalog.jpg (mijozning artikul qatori navy fonda).
   Kadrning chap yarmi ataylab boʻsh — matn aynan shu yerga tushadi, parda
   faqat kontrastni kafolatlaydi. Balandlik: ichki sahifa heroi (bosh sahifa
   herosidan past), lekin z-katalog dagi 460 px «tasma» dan kattaroq —
   brif katta vizual soʻraydi.
   ========================================================================== */
main [data-blok="KAT-01"].hs{min-height:clamp(420px,54vh,560px)}
main [data-blok="KAT-01"] .hs__matn{max-width:min(60ch,58%)}
main [data-blok="KAT-01"] .hs__matn .lid{max-width:44ch}
main [data-blok="KAT-01"] .hs__yoriq{max-width:44ch}
@media (max-width:900px){
  main [data-blok="KAT-01"] .hs__matn{max-width:100%}
}
/* Pastki meta relsi («GERMANIYADA…· 20–30 ARTIKUL · HAR KANISTRDA FOLGA…»)
   kadrning oʻng pastidagi YORQIN etiketkalar ustiga tushadi. g5.css §7 pardasi
   u yerda ≈.55 shaffof — oq yozuv och yashil etiketkada zaif oʻqilardi.
   Shuning uchun pastki 16 % kuchliroq quyuqlashtiriladi: kanistrlarning yuqori
   uchdan ikki qismi ochiq qoladi, meta qatori esa qatʼiy siyoh ustida turadi. */
main [data-blok="KAT-01"].hs:has(.hs__kadr img) .hs__parda{
  background:
    linear-gradient(90deg,rgba(0,17,36,.94) 0%,rgba(0,17,36,.78) 38%,rgba(0,17,36,.32) 68%,rgba(0,17,36,.16) 100%),
    linear-gradient(to top,rgba(0,17,36,.94) 0%,rgba(0,17,36,.62) 12%,rgba(0,17,36,0) 32%);
}

/* ⚠ Yuqoridagi qoida media-query SIZ yozilgan va g5.css §7 ning mobil
   variantidan kuchli — shuning uchun mobil parda shu yerda QAYTA beriladi.
   Tor ekranda gorizontal gradient ishlamaydi: matn butun kenglikni egallaydi,
   demak parda TIKKASIGA quyuqlashadi. */
@media (max-width:760px){
  main [data-blok="KAT-01"] .hs__kadr img{object-position:50% 100%}
  main [data-blok="KAT-01"].hs:has(.hs__kadr img) .hs__parda{
    background:linear-gradient(to top,rgba(0,17,36,.95) 0%,rgba(0,17,36,.86) 46%,rgba(0,17,36,.52) 100%);
  }
}


/* ==========================================================================
   §5 · KAT-04 · ASBOB MAYDONI
   Ikki raqamli pogʻona bitta boʻlimda: «01 YOʻNALISHLAR» (kirish + rels) va
   «02 MAHSULOT ROʻYXATI» (toʻr + holat + javobgarlik + sahifalash).
   ⚠ `.k2-rels` — `position:sticky`: filtrni alohida `<section>` ga chiqarish
   yopishqoqlikni oʻldiradi. Shuning uchun brifning 02·03·04 bandlari bitta
   uzluksiz maydonda, ajralish esa IKKI POGʻONA yorligʻi bilan beriladi.
   ========================================================================== */

/* «02 MAHSULOT ROʻYXATI» pogʻonasi — kirish qatlamidan nafas bilan ajraladi */
main .z-ish .k2-ish__bosh{margin-top:clamp(26px,2.8vw,40px)}
/* chiziq `.ich` ning OʻZIGA emas, ichidagi shapkaga: `.ich` ning quti kengligi
   toʻliq ekran — unga qoʻyilgan border chetdan chetga chiziladi va boʻlimni
   ikkiga boʻlib yuborardi. Endi u matn ustuni bilan tekislangan. */
main .z-ish .k2-ish__bosh .k2-bolim-bosh{
  padding-top:clamp(18px,1.9vw,26px);
  border-top:1px solid var(--g5-chiziq);
}

/* ---------- 5.1 · MAHSULOT PORTRETI (Bento Grid mahsulot kartalari) ---------- */
main .k2-yon {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  margin-top: 20px !important;
}
main .k2-yon__q {
  background: #ffffff !important;
  border: 1px solid var(--g5-chiziq, #DCE5F0) !important;
  border-radius: 12px !important;
  padding: 10px 18px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--navy) !important;
  transition: all 0.2s ease !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}
main .k2-yon__q:hover {
  border-color: #B0C7DE !important;
  background: #F8FAFD !important;
}
main .k2-yon__q[aria-pressed="true"] {
  background: var(--navy) !important;
  color: #ffffff !important;
  border-color: var(--navy) !important;
}
main .k2-yon__q[aria-pressed="true"] .k2-yon__son {
  background: rgba(255, 255, 255, 0.2) !important;
  color: #ffffff !important;
}

/* Plitka rejimida Bento mahsulot kartasi */
main .k2-list[data-rejim="plitka"] {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: clamp(20px, 2.2vw, 28px) !important;
}
@media (max-width: 900px) {
  main .k2-list[data-rejim="plitka"] {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

main .k2-list[data-rejim="plitka"] .k2-mah.kat-mah--shablon,
main .k2-mah.kat-mah--shablon {
  display: none !important;
}

main .k2-list[data-rejim="plitka"] .k2-mah {
  background: #ffffff !important;
  border: 1px solid var(--g5-chiziq, #DCE5F0) !important;
  border-radius: 20px !important;
  padding: clamp(22px, 2.2vw, 30px) !important;
  position: relative !important;
  display: grid !important;
  grid-template-columns: 180px minmax(0, 1fr) !important;
  gap: clamp(16px, 1.8vw, 24px) !important;
  transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease !important;
  align-items: start !important;
}
@media (max-width: 600px) {
  main .k2-list[data-rejim="plitka"] .k2-mah {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

main .k2-list[data-rejim="plitka"] .k2-mah:hover {
  transform: translateY(-4px) !important;
  border-color: #B0C8E0 !important;
  box-shadow: 0 12px 28px rgba(0, 24, 51, 0.07) !important;
}

main .k2-list[data-rejim="plitka"] .k2-mah__foto {
  background-color: #F8FAFD !important;
  border: 1px solid #E6EEF6 !important;
  border-radius: 14px !important;
  aspect-ratio: 1/1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  padding: 12px !important;
}
main .k2-mah__foto > img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  padding: 0 !important;
  transition: transform 0.3s ease !important;
}
main .k2-list[data-rejim="plitka"] .k2-mah:hover .k2-mah__foto > img {
  transform: scale(1.05) !important;
}

main .k2-mah__ost {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin-top: 16px !important;
  padding-top: 16px !important;
  border-top: 1px solid #EEF3F8 !important;
  position: relative !important;
  z-index: 2 !important;
}
main .k2-mah__ha {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-weight: 600 !important;
  font-size: 13.5px !important;
  color: #ffffff !important;
  background: var(--navy) !important;
  padding: 8px 18px !important;
  border-radius: 999px !important;
  transition: all 0.2s ease !important;
}
main .k2-mah__ha .ik {
  color: #ffffff !important;
}
main .k2-mah:hover .k2-mah__ha {
  background: #00264d !important;
}
main .k2-mah__ikki {
  display: inline-flex !important;
  align-items: center !important;
  font-weight: 500 !important;
  font-size: 13.5px !important;
  color: var(--slate) !important;
  padding: 8px 14px !important;
  border: 1px solid var(--g5-chiziq, #DCE5F0) !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  transition: all 0.2s ease !important;
}
main .k2-mah__ikki:hover {
  color: var(--navy) !important;
  border-color: #B0C7DE !important;
  background: #F4F8FC !important;
}

/* Roʻyxat oxiri Bento kartasi */
main .k2-sorov {
  grid-column: 1 / -1 !important;
  background: linear-gradient(135deg, #FFFFFF 0%, #F5F8FC 100%) !important;
  border: 1px dashed #A6C4DF !important;
  border-radius: 20px !important;
  padding: clamp(24px, 2.5vw, 36px) !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 20px !important;
  margin-top: 10px !important;
}
main .k2-sorov__y {
  font-family: var(--f-mono, monospace) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  color: var(--aksent-mayda, #0066CC) !important;
  text-transform: uppercase !important;
  margin-bottom: 6px !important;
}
main .k2-sorov__m {
  font-size: 15px !important;
  color: var(--ink) !important;
  max-width: 48ch !important;
  margin: 0 !important;
}
main .k2-sorov .ha {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  color: #ffffff !important;
  background: var(--navy) !important;
  padding: 10px 22px !important;
  border-radius: 999px !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
}
main .k2-sorov .ha:hover {
  background: #00264d !important;
  transform: translateY(-2px) !important;
}

/* ---------- 5.2 · YOʻNALISH KIRISHI ---------- */
main .z-ish .k2-kirish{
  grid-template-columns:minmax(0,8fr) minmax(0,4fr);
  align-items:start;
  background: #FFFFFF;
  border: 1px solid var(--g5-chiziq, #DCE5F0);
  border-radius: 20px;
  padding: clamp(24px, 2.5vw, 36px);
  margin-bottom: 24px;
}
main .z-ish .k2-kirish__kadr{
  grid-column:2;justify-self:stretch;
  width:100%;height:auto;max-width:none;max-height:none;
  border-radius: 14px;
  overflow: hidden;
}
@media (max-width:760px){
  main .z-ish .k2-kirish{grid-template-columns:minmax(0,1fr)}
  main .z-ish .k2-kirish__kadr{grid-column:1;max-width:420px}
}


/* ==========================================================================
   §6 · KAT-03 · YOʻNALISH REGISTRI — Bento akkordeon kartalari
   ========================================================================== */
main .k2-reg__chap{grid-column:1 / span 4;gap:0}
main .k2-reg__chap .g5-shapka{margin-bottom:0}
main .k2-reg__chap .g5-shapka > h2{color:var(--navy);max-width:13ch}
main .k2-reg__chap .g5-lid{max-width:30ch}

main .k2-reg__reg{
  grid-column:6 / -1;
  grid-template-columns:minmax(0,1fr);
  border-top:none !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}
main .k2-reg__q{
  background: #FFFFFF !important;
  border: 1px solid var(--g5-chiziq, #DCE5F0) !important;
  border-radius: 16px !important;
  padding: clamp(16px, 1.8vw, 22px) clamp(20px, 2vw, 28px) !important;
  border-top: 1px solid var(--g5-chiziq, #DCE5F0) !important;
  border-bottom: 1px solid var(--g5-chiziq, #DCE5F0) !important;
  transition: all 0.2s ease !important;
}
main .k2-reg__q:hover {
  border-color: #B0C8E0 !important;
  background: #F9FBFE !important;
  box-shadow: 0 4px 14px rgba(0, 24, 51, 0.03) !important;
}
main .k2-reg__q[open] {
  border-color: #92B5DA !important;
  background: #FFFFFF !important;
  box-shadow: 0 6px 18px rgba(0, 24, 51, 0.05) !important;
}

main .k2-reg__q > summary{
  grid-template-columns:40px minmax(0,auto) minmax(0,1fr) 16px;
  gap:6px clamp(14px,1.5vw,26px);
  align-items:baseline;
  padding-block:0 !important;
  cursor: pointer;
}
main .k2-reg__n{
  grid-column:1;grid-row:1;padding-top:0;
  font-family: var(--f-mono, monospace);
  font-weight: 700;
  color: var(--aksent-mayda, #0066CC);
}
main .k2-reg__nom{grid-column:2;grid-row:1;font-size:clamp(17px,1.5vw,21px);font-weight:700;color:var(--navy)}
main .k2-reg__qara{grid-column:3;grid-row:1;justify-self:end;text-align:right;color:var(--slate)}
main .k2-reg__b{grid-column:4;grid-row:1;margin-top:0;align-self:center}
main .k2-reg__q > p{
  margin-top: 14px !important;
  padding-top: 14px !important;
  border-top: 1px solid #EEF3F8 !important;
  color: var(--slate) !important;
  line-height: 1.6 !important;
  padding-left: 0 !important;
}
@media (max-width:900px){
  main .k2-reg__chap{grid-column:1 / -1}
  main .k2-reg__reg{grid-column:1 / -1}
  main .k2-reg__q > summary{grid-template-columns:32px minmax(0,1fr) 16px}
  main .k2-reg__nom{grid-column:2;grid-row:1}
  main .k2-reg__qara{grid-column:2;grid-row:2;justify-self:start;text-align:left}
  main .k2-reg__b{grid-column:3;grid-row:1}
}

main [data-blok="KAT-03"][data-blok] .g5-shapka > h2{line-height:1.08}


/* ==========================================================================
   §7 · KAT-08 · SAVOL-JAVOB — Bento akkordeon kartalari
   ========================================================================== */
main .k2-sj__bosh{gap:0;margin-bottom:clamp(30px,3.2vw,44px);max-width:42em}
main .k2-sj__bosh .g5-shapka{margin-bottom:0}
main [data-blok="KAT-08"][data-blok] .g5-shapka > h2{
  line-height:1.12;color:var(--navy);max-width:28ch;
}
main [data-blok="KAT-08"][data-blok] .z-yakun h2{
  font-size:var(--g5-h-c) !important;line-height:1.12;
}
main .k2-sj__royxat{
  border-top:none !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}
main .k2-sj__q{
  background: #FFFFFF !important;
  border: 1px solid var(--g5-chiziq, #DCE5F0) !important;
  border-radius: 16px !important;
  padding: clamp(16px, 1.8vw, 22px) clamp(20px, 2vw, 28px) !important;
  border-bottom: 1px solid var(--g5-chiziq, #DCE5F0) !important;
  transition: all 0.2s ease !important;
}
main .k2-sj__q:hover {
  border-color: #B0C8E0 !important;
  background: #F9FBFE !important;
  box-shadow: 0 4px 14px rgba(0, 24, 51, 0.03) !important;
}
main .k2-sj__q[open] {
  border-color: #92B5DA !important;
  background: #FFFFFF !important;
  box-shadow: 0 6px 18px rgba(0, 24, 51, 0.05) !important;
}
main .k2-sj__q > summary {
  cursor: pointer;
  display: grid;
  grid-template-columns: 36px 1fr 20px;
  align-items: center;
  gap: 12px;
}
main .k2-sj__n {
  font-family: var(--f-mono, monospace);
  font-weight: 700;
  font-size: 13px;
  color: var(--aksent-mayda, #0066CC);
}
main .k2-sj__s {
  font-weight: 600;
  font-size: clamp(16px, 1.4vw, 18px);
  color: var(--navy);
}
main .k2-sj__q > p {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid #EEF3F8;
  color: var(--slate);
  line-height: 1.6;
  padding-left: 48px;
}
@media (max-width: 640px) {
  main .k2-sj__q > p {
    padding-left: 0;
  }
}

/* yopuvchi qator — Bento Banner kartasi */
main .z-yakun{
  background: #FFFFFF !important;
  border: 1px solid var(--g5-chiziq, #DCE5F0) !important;
  border-radius: 20px !important;
  padding: clamp(24px, 2.5vw, 36px) !important;
  margin-top: clamp(28px, 3vw, 40px) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 20px !important;
  flex-wrap: wrap !important;
  border-top: 1px solid var(--g5-chiziq, #DCE5F0) !important;
}


/* ==========================================================================
   §8 · KAT-09 · KONVERSIYA — Bento kartalari
   ========================================================================== */
main .k2-konv__tasma {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 24px !important;
  margin-bottom: clamp(28px, 3.2vw, 44px) !important;
}
@media (max-width: 900px) {
  main .k2-konv__tasma {
    grid-template-columns: 1fr !important;
  }
}
main .k2-konv__ustun {
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 20px !important;
  padding: clamp(28px, 3vw, 40px) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
  align-items: flex-start !important;
}
main [data-blok="KAT-09"][data-blok] .k2-konv__ustun h2{
  font-size:var(--g5-h-b);line-height:1.06;max-width:13em;
  color: #FFFFFF !important;
  margin: 0 !important;
}
main [data-blok="KAT-09"][data-blok] .k2-konv__ustun:nth-of-type(2) h2,
main [data-blok="KAT-09"][data-blok] .k2-konv__ustun + .k2-konv__ustun h2{
  font-size:var(--g5-h-c) !important;
}
main .k2-konv__ustun .tana-k {
  color: rgba(255, 255, 255, 0.8) !important;
  margin: 0 !important;
  line-height: 1.6 !important;
}

/* ⚠ z-katalog §5 kadrga `max-height:min(24vh,215px)` bergan edi — u BOʻSH
   punktir slot uchun oʻlchov edi (slot boʻlimga balandlik qoʻshmasin deb).
   Endi bu haqiqiy kadr. 4:5 manba 4:3 oynada, koʻrish nuqtasi PASTDA:
   manbaning yuqori yarmi boʻsh navy maydon — toʻliq 4:5 da u boʻlimga 180 px
   quruq balandlik qoʻshardi. Kesilgan kadr chap ustunni oʻng paneldagi forma
   balandligiga tenglashtiradi. Rasmning foni ham navy — kadr bandga yopishadi,
   ramka ham, soya ham kerak emas. */
main [data-blok="KAT-09"] .k2-forma__kadr{
  background:var(--g5-navy);
  margin-top:clamp(14px,1.6vw,22px);
  width:100%;max-width:none;max-height:none;
}
main [data-blok="KAT-09"] .k2-forma__kadr > img{object-fit:cover;object-position:50% 100%}
@media (max-width:900px){
  main [data-blok="KAT-09"] .k2-forma__kadr{max-width:340px}
}

/* ⚠ OQ PANEL QUYUQ BAND ICHIDA.
   `asos.css` bu holatni `.bolim--quyuq .panel .javobgarlik{color:var(--slate)}`
   bilan yopgan edi; yangi tuzilmada sirt `.g5--navy` klassi bilan beriladi,
   shuning uchun g5.css §1 ning `.g5--navy p{color:rgba(255,255,255,.8)}`
   qoidasi panel ichiga ham tushib, OQ fonda OQ yozuv qoldirardi (cr=1.00).
   Panelning ichi — oq sirt, siyohi ham shunga yarasha. */
main [data-blok="KAT-09"] .panel p,
main [data-blok="KAT-09"] .panel li,
main [data-blok="KAT-09"] .panel .javobgarlik{color:var(--slate)}
main [data-blok="KAT-09"] .panel .maydon span{color:var(--ink)}


/* ==========================================================================
   §9 · SOYA YOʻQ — g5.css §8 `.g5-b` bilan chegaralangan; hero va rels
   ham shu qonun ostida boʻlishi kerak.
   ========================================================================== */
main [data-blok^="KAT-"],
main [data-blok^="KAT-"] *{box-shadow:none !important}


/* ⚠ NAZORATCHI (13.09): yoʻnalish kirishining JS bilan toʻladigan sarlavhasi
   34 px da edi — shkaladan tashqari qiymat. Asosiy pogʻonaga (B) keltirildi. */
main [data-blok="KAT-04"][data-blok] .k2-kirish__matn h2{
  font-size:var(--g5-h-b);line-height:1.06;letter-spacing:var(--tracking-zich);
}

/* ⚠ KOʻRIK TUZATISHI (13.09): viskozitet qiymatlari `<label>` edi va klaviatura
   bilan tanlab boʻlmasdi (fokus yoʻq, `aria-pressed` yoʻq). Endi `<button>` —
   brauzerning oʻz uslubi tozalanadi, koʻrinish oʻzgarmaydi. */
main .kat-q{
  -webkit-appearance:none;appearance:none;background:none;border:0;
  font:inherit;color:inherit;text-align:left;width:100%;cursor:pointer;
}
main .kat-q:focus-visible{outline:2px solid var(--aksent);outline-offset:3px;border-radius:4px}
/* texnika guruhidagi rost holat qatori */
main .k2-f__kut{margin-top:var(--s4);color:var(--slate);max-width:44ch}