/* ═══════════════════════════════════════════════════════════════════════════
   hc-cyan.css — ფირმის ფირუზის თემა (2026-08-24)

   მოთხოვნა: საიტი მთლიანად ღია ფირუზში, როგორც სახელოვნებო სკოლების საიტია
   იასამნისფერში. ყველა ტონი ᲔᲠᲗᲘ ᲤᲔᲠᲘᲓᲐᲜ — სუფთა `#0d9bb8` (`--cy`) —
   თეთრზე გაღიავებით მიიღება. ახალი ფერი არსად არ არის შემოტანილი.

     9%  #e9f6f9   გვერდის ფონი
    14%  #ddf1f5   სექციის ფონი (--w2)
    20%  #cfebf1   ჩიპები, ველების ფონი (--w3)
    30%  #b6e1ea   ხაზები (--line)
    42%  #99d5e1   ველების კონტური (--line2)

   ⚠️ 24.08: სუფთა თეთრი გვერდზე აღარსად რჩება. `--w` — ბარათების,
      ცხრილების, ფორმებისა და ველების ზედაპირი — თავადაც ფირუზის
      უფაქიზესი საფეხურია (4%). ბარათი ფონზე ᲦᲘᲐᲐ, ფუტერი ᲛᲣᲥᲘ —
      განსხვავება სიმუქით მიიღწევა, არა თეთრით.

   ⚠️ v3.css ᲐᲠ ᲘᲪᲕᲚᲔᲑᲐ. ეს ფაილი მხოლოდ ტოკენებს გადააწერს და
      `hc-v3-head.php`-ში v3.css-ის შემდეგ ირთვება. გასაუქმებლად საკმარისია
      ერთი `<link>`-ის მოხსნა — ყველა გვერდი ერთდროულად ბრუნდება ძველ იერზე.

   კონტრასტი გაზომილია (24.08, ერთი საფეხურით გამუქების შემდეგ):
   ტექსტი `--body #4a6076` გვერდის ფონზე 5.89:1, სექციის ფონზე 5.57:1,
   ჩიპის ფონზე 5.21:1 — ყველგან WCAG AA-ზე (4.5:1) მაღლა.
   ⚠️ 30%-ს ზემოთ გამუქება ტექსტს 4.5:1-ს ქვემოთ ჩამოიყვანს — ეს ჭერია.
   ═══════════════════════════════════════════════════════════════════════════ */

.hcx{
  --w:#f6fbfc;
  --w2:#ddf1f5;
  --w3:#cfebf1;
  --line:#b6e1ea;
  --line2:#99d5e1;
  background:#e9f6f9;
}

/* ⚠️ ბარათი, ცხრილი და ფორმა თეთრზე რჩება — `--w` ხელუხლებელია.
   ქვემოთ მხოლოდ ის ადგილებია, სადაც v3.css თეთრს ᲞᲘᲠᲓᲐᲞᲘᲠ წერს
   და ტოკენს არ იყენებს, ამიტომ ავტომატურად ვერ აჰყვა ფონს. */
/* ⚠️ `:not([class*="--photo"])` აუცილებელია: ფოტოიან ჰეროს საკუთარი მუქი
   საბაზისო ფერი აქვს (`#042b34`) და ამ წესის სპეციფიკურობა (0,2,0) მას
   ჯობნიდა — ფოტო რომ ვერ ჩაიტვირთოს, თეთრი ტექსტი ღია ფირუზზე დარჩებოდა
   და წაუკითხავი გახდებოდა. ატრიბუტით შერჩევა მომავალ გვერდებზეც იმუშავებს. */

/* ⚠️ ჰედერი და ფუტერი ცალკე იმართება (`hx-` პრეფიქსი, ინლაინ სტილი
   `hc-v3-head.php`-ში) — მათ არ ვეხებით, რომ სხვისი ფაილი არ შეიცვალოს. */

/* ── ღია ფონზე გამყოფები ოდნავ უფრო გამოკვეთილი უნდა იყოს ── */
.hcx .h-tbl th{background:#cfebf1}
.hcx .h-tbl tbody tr:hover td{background:#e9f6f9}

/* ═══════════════════════════════════════════════════════════════════════════
   ᲡᲐᲠᲗᲐᲨᲝᲠᲘᲡᲝ ᲰᲔᲠᲝ — ᲧᲕᲔᲚᲐ ᲒᲕᲔᲠᲓᲖᲔ ᲔᲠᲗᲜᲐᲘᲠᲘ (24.08)

   მოთხოვნა: ლამაზი ჰერო ყველა გვერდზე, მაგრამ ᲣᲪᲜᲝᲑᲘ ᲐᲓᲐᲛᲘᲐᲜᲔᲑᲘᲡ
   ᲤᲝᲢᲝᲔᲑᲘ ᲐᲠᲡᲓᲠᲝᲡ. ამიტომ ჰერო ფოტოს კი არა, ფირმის ფირუზის
   გრადიენტს ეყრდნობა — მუქიდან სუფთა `#0d9bb8`-მდე, ზემოთ მარჯვნივ
   ნათებით. თემატურ ხატს გვერდის საკუთარი SVG იძლევა (`*-vis__art`).

   ⚠️ სია ᲒᲐᲛᲘᲖᲜᲔᲑᲣᲚᲐᲓ ᲡᲐᲮᲔᲚᲓᲝᲑᲘᲗᲘᲐ: `[class*="-hero"]` თვითონ `h-hero`-საც
      დაიჭერდა და მთავარი გვერდის რუკიან ჰეროსაც გაამუქებდა — ის ღია რჩება.
   ⚠️ ფოტოიანი ვარიანტი (`--photo`) გამორიცხულია: გვერდის CSS ამის შემდეგ
      ირთვება და ისედაც გადააწერდა, მაგრამ პირობა ცალსახად ეწერება.
   ═══════════════════════════════════════════════════════════════════════════ */

.hcx .abt-hero:not(.abt-hero--photo), .hcx .faq-hero:not(.faq-hero--photo), .hcx .imu-hero:not(.imu-hero--photo),
.hcx .zed-hero:not(.zed-hero--photo), .hcx .nws-hero:not(.nws-hero--photo),
.hcx .skr-hero:not(.skr-hero--photo),
.hcx .lab-hero:not(.lab-hero--photo){
  position:relative;overflow:hidden;isolation:isolate;
  background:
    radial-gradient(118% 92% at 86% 14%, rgba(13,155,184,.62) 0%, rgba(13,155,184,0) 58%),
    linear-gradient(104deg, #042b34 0%, #06414f 44%, #0a7a91 100%);
}

/* ── ტექსტი მუქ ფირუზზე ── */
.hcx .abt-hero .h-kicker, .hcx .faq-hero .h-kicker, .hcx .imu-hero .h-kicker,
.hcx .zed-hero:not(.zed-hero--photo) .h-kicker, .hcx .nws-hero:not(.nws-hero--photo) .h-kicker,
.hcx .skr-hero:not(.skr-hero--photo) .h-kicker,
.hcx .lab-hero:not(.lab-hero--photo) .h-kicker{color:#7fe3e0}
.hcx .abt-hero .h-kicker::before, .hcx .faq-hero .h-kicker::before,
.hcx .imu-hero .h-kicker::before, .hcx .zed-hero .h-kicker::before,
.hcx .nws-hero .h-kicker::before,
.hcx .skr-hero:not(.skr-hero--photo) .h-kicker::before,
.hcx .lab-hero:not(.lab-hero--photo) .h-kicker::before{background:#7fe3e0}

.hcx .abt-hero h1, .hcx .faq-hero h1, .hcx .imu-hero h1,
.hcx .zed-hero h1, .hcx .nws-hero h1,
.hcx .skr-hero:not(.skr-hero--photo) h1,
.hcx .lab-hero:not(.lab-hero--photo) h1{color:#fff}
.hcx .abt-hero h1 em, .hcx .faq-hero h1 em, .hcx .imu-hero h1 em,
.hcx .zed-hero h1 em, .hcx .nws-hero h1 em,
.hcx .skr-hero:not(.skr-hero--photo) h1 em,
.hcx .lab-hero:not(.lab-hero--photo) h1 em{color:#6fd9d6}

.hcx .abt-hero .h-hero__lede, .hcx .faq-hero .h-hero__lede, .hcx .imu-hero .h-hero__lede,
.hcx .zed-hero .h-hero__lede, .hcx .nws-hero .h-hero__lede,
.hcx .skr-hero:not(.skr-hero--photo) .h-hero__lede,
.hcx .lab-hero:not(.lab-hero--photo) .h-hero__lede{color:rgba(255,255,255,.85)}

/* ── ციფრები მინის ფილებად (v3-ის ხაზოვანი გამყოფები მუქზე არ იკითხება) ── */
.hcx .abt-hero .h-figs, .hcx .faq-hero .h-figs, .hcx .imu-hero .h-figs,
.hcx .zed-hero .h-figs, .hcx .nws-hero .h-figs,
.hcx .skr-hero:not(.skr-hero--photo) .h-figs,
.hcx .lab-hero:not(.lab-hero--photo) .h-figs{
  gap:12px;border-top:0;padding-top:0;margin-top:30px;
}
.hcx .abt-hero .h-fig, .hcx .faq-hero .h-fig, .hcx .imu-hero .h-fig,
.hcx .zed-hero .h-fig, .hcx .nws-hero .h-fig,
.hcx .skr-hero:not(.skr-hero--photo) .h-fig,
.hcx .lab-hero:not(.lab-hero--photo) .h-fig{
  padding:15px 16px;margin-right:0;border-right:0;border-radius:16px;
  background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.17);
  backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);
}
.hcx .abt-hero .h-fig b, .hcx .faq-hero .h-fig b, .hcx .imu-hero .h-fig b,
.hcx .zed-hero .h-fig b, .hcx .nws-hero .h-fig b,
.hcx .skr-hero:not(.skr-hero--photo) .h-fig b,
.hcx .lab-hero:not(.lab-hero--photo) .h-fig b{color:#fff}
.hcx .abt-hero .h-fig span, .hcx .faq-hero .h-fig span, .hcx .imu-hero .h-fig span,
.hcx .zed-hero .h-fig span, .hcx .nws-hero .h-fig span,
.hcx .skr-hero:not(.skr-hero--photo) .h-fig span,
.hcx .lab-hero:not(.lab-hero--photo) .h-fig span{color:rgba(255,255,255,.72)}

/* ── ღილაკები ── */
.hcx .abt-hero .h-btn--dark, .hcx .faq-hero .h-btn--dark, .hcx .imu-hero .h-btn--dark,
.hcx .zed-hero .h-btn--dark, .hcx .nws-hero .h-btn--dark,
.hcx .skr-hero:not(.skr-hero--photo) .h-btn--dark,
.hcx .lab-hero:not(.lab-hero--photo) .h-btn--dark{background:#fff;color:#0a1628;border-color:#fff}
.hcx .abt-hero .h-btn--ghost, .hcx .faq-hero .h-btn--ghost, .hcx .imu-hero .h-btn--ghost,
.hcx .zed-hero .h-btn--ghost, .hcx .nws-hero .h-btn--ghost,
.hcx .skr-hero:not(.skr-hero--photo) .h-btn--ghost,
.hcx .lab-hero:not(.lab-hero--photo) .h-btn--ghost{
  background:rgba(255,255,255,.1);color:#fff;border-color:rgba(255,255,255,.38);
  backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);
}

/* ── ჩიპები და ახსნის ზოლები ჰეროს შიგნით ── */
.hcx .abt-hero .abt-quick__i,
.hcx .skr-hero:not(.skr-hero--photo) .skr-soon,
.hcx .lab-hero:not(.lab-hero--photo) .lab-soon,
.hcx .nws-hero .nws-soon{
  background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.2);color:rgba(255,255,255,.92);
  backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);
}
.hcx .abt-hero .abt-quick__i svg,
.hcx .skr-hero:not(.skr-hero--photo) .skr-soon svg,
.hcx .lab-hero:not(.lab-hero--photo) .lab-soon svg,
.hcx .nws-hero .nws-soon svg{color:#6fd9d6}
.hcx a.abt-quick__i:hover{background:rgba(255,255,255,.19);border-color:rgba(255,255,255,.5);color:#fff}

/* ── გვერდითი SVG ხატი მუქ ფონზე ──
   ⚠️ ხატები `var(--w)`-ს (თეთრს) და `var(--cy)`-ს იყენებენ. თეთრი მუქზე
      კარგად ჩანს, ფირუზი კი ბუნდოვნდება — ამიტომ მხოლოდ ამ ჰეროებში
      ხატის შიგნით ორივე ტოკენი ღიად გადაიწერება. */
.hcx .abt-hero .abt-vis__art, .hcx .faq-hero .faq-vis__art, .hcx .imu-hero .imu-vis__art,
.hcx .zed-hero .zed-vis__art, .hcx .nws-hero .nws-vis__art,
.hcx .skr-hero:not(.skr-hero--photo) .skr-vis__art,
.hcx .lab-hero:not(.lab-hero--photo) .lab-vis__art{
  --cy:#8fe8f2;
  --w:rgba(255,255,255,.10);
  opacity:.92;
}

/* ═══════════════════════════════════════════════════════════════════════════
   ᲰᲔᲓᲔᲠᲘ, ᲣᲯᲠᲐ ᲓᲐ ᲤᲣᲢᲔᲠᲘ — ᲗᲔᲗᲠᲘ ᲐᲦᲐᲠᲡᲐᲓ ᲠᲩᲔᲑᲐ (24.08)

   ⚠️ ეს სამი `hc-v3-head.php`-ის ᲘᲜᲚᲐᲘᲜ `<style>`-შია, რომელიც ამ ფაილის
      ᲨᲔᲛᲓᲔᲒ იკითხება — ჩვეულებრივი ერთკლასიანი წესი ვერ გადააწერდა.
      ამიტომ `.hcx`-ით სპეციფიკურობა (0,2,0) აიწევს (0,1,0)-ის ნაცვლად.
      სხვისი ფაილი ᲐᲠ ᲘᲪᲕᲚᲔᲑᲐ — გადაწერა მხოლოდ აქედან ხდება.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ჰედერი — იგივე გამჭვირვალობა, ოღონდ ფირუზის ელფერით */
.hcx .h-hd{background:rgba(246,251,252,.94)}

/* გვერდითი უჯრა (ტელეფონის მენიუ) */
.hcx .h-drawer{background:#f6fbfc}
.hcx .h-drawer__x{background:#e9f6f9;color:var(--ink2)}
.hcx .h-drawer__x:hover{background:#cfebf1}

/* ფუტერი — ᲛᲣᲥᲘ ᲡᲐᲤᲔᲮᲣᲠᲘ იმავე ფერისა (`#0d9bb8` × 28%), ნავისფრის ნაცვლად.
   ჰეროს მუქ ბოლოს ემთხვევა, ანუ გვერდი მუქით იხურება და მუქითვე იხსნება. */
.hcx .h-ft{background:#042b34}

/* ── მთავარი გვერდის რუკის წარწერები ──
   ⚠️ v3.css მათ თეთრს ᲞᲘᲠᲓᲐᲞᲘᲠ წერს (ტოკენით არა), ამიტომ ავტომატურად
      ვერ აჰყვა ფონს. ფორმა და ჩრდილი უცვლელია — მხოლოდ ელფერი ემატება. */
.hcx .h-pm__cta, .hcx .h-pm__count, .hcx .h-pm__zoom{background:#f6fbfc}

/* ── მუქი ღილაკი ფირუზის ოჯახში ──
   ⚠️ `--ink`-ს ვერ შევცვლი: ის სათაურების ᲢᲔᲥᲡᲢᲘᲡ ფერიცაა.
      ამიტომ მხოლოდ ღილაკის ფონი გადაიწერება.
   ⚠️ მუქ ჰეროებში ღილაკი თეთრი რჩება — იქ ის ღია ლაქაა მუქ ფონზე და
      ამ წესს გვერდის CSS და ზემოთა ბლოკი უფრო მაღალი წონით აჯობებს. */
.hcx .h-btn--dark{background:#042b34;border-color:#042b34}
.hcx .h-btn--dark:hover{background:#06414f;border-color:#06414f}