/* ═══════════════════════════════════════════════════════════════════════
   company-hbs-pages.css — Oliy maqsad / Qoidalar / Nizom sahifalari
   konstruktordan (TZ/sahifa-konstruktori §4.8, L3) chizilganda SAHIFA
   darajasidagi o'ram. Bo'limlar o'z CSS'ida (`.hbs-<key>`), bu yerda faqat
   eski sahifa `.hcp-page` bergan sahifa kengligi va chekkasi (S-5: ko'rinish
   aynan saqlanadi). Shablon: company/<sahifa>.html `{% if hbs %}` tarmog'i.

   Qoidalar: faqat `.hcp-hbs` ostida; rang yo'q; izohlarda yulduzcha va
   slesh yonma-yon yozilmaydi.
   ═══════════════════════════════════════════════════════════════════════ */

.hcp-hbs{ width:100%; box-sizing:border-box; margin:0 auto }

/* Eski sahifada kontent chekkasi = qobiq (`.hb-content:has(.hcp-page)`:
   20px, 860px dan tor ekranda 10px) + `.hcp-page` ichki to'ldirishi (4px;
   Qoidalar sahifasida 32px, telefonda 12px). Konstruktor qobig'i esa 24px
   (860px dan tor: 8px) va har bo'limning o'z `.hbs` yon to'ldirishi bor
   (hbs-base.css, kenglikka qarab 4-28px). Bu o'ram ichida bo'lim yon
   to'ldirishi nolga tushiriladi va yagona chekka o'ramning o'zida beriladi:
   hamma bo'lim eski sahifadagidek BIR chiziqda turadi.
   Hisob: o'ram = eski jami chekka - konstruktor qobig'i. */
.hcp-hbs > .hbs-page > .hbs{ padding-inline:0 }

/* Oliy maqsad: `.hcp-page` — eng kengi 1280px (4px to'ldirish bilan),
   pastda 80px. 24 - 24 = 0; tor ekranda 14 - 8 = 6. */
.hcp-hbs--mission{ max-width:1272px; padding:0 0 80px }
@media (max-width: 860px){
  .hcp-hbs--mission{ padding-inline:6px }
}

/* Qoidalar va Nizom: eski `.hcp-page:has(.hcp-rules)` — eng kengi 2000px,
   yon 32px (telefonda 12px). 52 - 24 = 28; 42 - 8 = 34; 22 - 8 = 14.
   Nizom 2026-09-23 dan Qoidalar kartalarida (`.hcp-rules--nizom`) — eski
   sahifa ham shu kenglikni oladi. */
.hcp-hbs--rules,
.hcp-hbs--nizom{ max-width:1984px; padding:0 28px 80px }
@media (max-width: 860px){
  .hcp-hbs--rules,
  .hcp-hbs--nizom{ padding-inline:34px }
}
@media (max-width: 640px){
  .hcp-hbs--rules,
  .hcp-hbs--nizom{ padding-inline:14px }
}

/* Qoidalar: asl sahifa chegaralari EKRAN kengligida (900px, 640px), bo'lim
   esa o'z eniga (@container) qaraydi. O'ram chekkasi tufayli ikki oraliqda
   ular mos kelmaydi — shu yerda asl ko'rinish tiklanadi:
   901-1004px ekran: bo'lim eni 900 dan tor, lekin asl sahifa hali keng
   rejimda (56/48px oraliq, 600px ustun);
   641-683px ekran: bo'lim eni 596 dan tor, lekin asl sarlavha hali 38px. */
@media (min-width: 901px){
  .hcp-hbs--rules .hbs-data_rules .hbs-dr-grid{ gap:56px 48px }
  .hcp-hbs--rules .hbs-data_rules .cols-2 .hbs-dr-grid{
    grid-template-columns:repeat(auto-fill, minmax(min(600px, 100%), 1fr));
  }
}
@media (min-width: 641px){
  .hcp-hbs--rules .hbs-data_rules .hbs-dr-title:not(.is-sub){ font-size:38px }
}

/* Nizom: xuddi Qoidalar kabi — asl `.hcp-rules` chegaralari EKRAN kengligida
   (900px, 640px, 560px), bo'limlar esa o'z eniga (@container) qaraydi.
   901-1004px: asl hali keng rejimda (56/48px oraliq, 600px ustun);
   641-683px: asl sarlavha hali 38px. 560px chegarasi o'ram chekkasi bilan
   aynan mos (bo'lim eni 516px) — tuzatish shart emas. */
@media (min-width: 901px){
  .hcp-hbs--nizom .hbs-data_nizom_principles .hbs-np-grid,
  .hcp-hbs--nizom .hbs-data_nizom_chapters .hbs-ncc-grid{
    gap:56px 48px; grid-template-columns:repeat(auto-fill, minmax(min(600px, 100%), 1fr));
  }
}
@media (min-width: 641px){
  .hcp-hbs--nizom .hbs-data_nizom_principles .hbs-np-title,
  .hcp-hbs--nizom .hbs-data_nizom_chapters .hbs-nc-title{ font-size:38px }
}

/* Oliy maqsad: asl `.hcp-exec-split` — "Yillik bosqichlar" va "Bo'limlar
   kesimida" bloklari orasi 32px (telefonda ham). Konstruktorda ular ikki
   alohida bo'lim, orasi sahifa zichligi (--hbs-gap: 40px, telefonda 24px) —
   farq faqat shu juftlik uchun tuzatiladi, umumiy zichlik o'zgarmaydi. */
.hcp-hbs--mission .hbs-timeline_period + .hbs-cards_department_goals{
  margin-top:calc(32px - var(--hbs-gap, 40px));
}

/* Oliy maqsad hero: asl sahifada iqtibos va "Ovozli sharh" `.hcp-hero-main`
   ICHIDA (oraliq 16px + iqtibos chekkasi 18px = 34px). Konstruktorda iqtibos
   video kengligida (buyurtmachi 09-18, hero_big.html kabi) — `.hbs-ht`
   oralig'i 18px, shu bois chekka 2px kamaytiriladi: masofalar aynan eski.
   Telefonda ham audio chizig'i asl 110px. */
.hcp-hbs--mission .hbs-hero_text .hbs-ht-quote-wrap{ margin-block:16px }
@media (max-width: 640px){
  .hcp-hbs--mission .hbs-hero_text .hbs-ht-quote-wrap{ margin-block:8px }
  .hcp-hbs--mission .hbs-hero_text .hbs-ht-audio-track{ width:110px }
}

/* Skroll bilan chiqish (asl company_scroll_reveal.js + `.hcp-reveal`).
   `.hcp-hbs-reveal` klassini FAQAT company_hbs_reveal.js qo'shadi — skript
   ishlamasa kontent to'liq ko'rinadi. Harakat kamaytirilganda animatsiya yo'q. */
.hcp-hbs .hcp-hbs-reveal{
  opacity:0; transform:translateY(20px);
  transition:opacity .5s cubic-bezier(.2,.8,.2,1), transform .5s cubic-bezier(.2,.8,.2,1);
}
.hcp-hbs .hcp-hbs-reveal.is-visible{ opacity:1; transform:none }
@media (prefers-reduced-motion: reduce){
  .hcp-hbs .hcp-hbs-reveal{ opacity:1; transform:none; transition:none }
}