/* ==========================================================================
   imecadine.ge — შიდა გვერდები მთავარი გვერდის ენაზე (2026-09-06)

   ყველა გვერდზე იტვირთება, **v2.css-ისა და shell.css-ის შემდეგ**, მაგრამ
   `pageCss`-ამდე — ანუ `theory.css`/`exam.css` კვლავ ჯობნის და გამოცდის
   და მეცადინეობის ეკრანები ხელუხლებელი რჩება (user, 2026-09-06).

   რას აკეთებს: v2-ის „პრემიუმ მუქი" ენას ღიად თარგმნის — ზუსტად იმ
   ტოკენებში, რაც მთავარ გვერდს აქვს (`--sh-*`, `shell.css`).
     • მუქი navy ჰერო/ბანერი/ზოლი → ღია ლურჯი ბლოკი მუქი ტექსტით
     • ბარათი → 20px კუთხე, თხელი კონტური, რბილი ჩრდილი
     • ღილაკი → 12px კუთხე (მრგვალი პილული აღარაა), display-ფონტი,
       hover -2px + ჩრდილი, მხოლოდ `pointer: fine`-ზე
     • ძველი `app.css`-ის `.card/.btn/.wrap` — იმავე ენაზე

   ⚠️ `.tp-*` (ბილეთი/ვარჯიში/შედეგი) და `.xm-*` (გამოცდა) **განზრახ არსად
      არაა** — ის ეკრანები ცალკე სამყაროა და დაკვეთით გამორიცხულია.
   ========================================================================== */

:root {
  --st-bg-1: #F5F9FF;   /* ჰეროს ღია ლურჯი */
  --st-bg-2: #F6F8FC;   /* ნეიტრალური სექცია */
  --st-bg-3: #F1F7FF;   /* ალტერნატიული ღია ლურჯი */
  --st-bg-4: #F3FAF8;   /* ღია ფირუზისფერი */
  --st-card: #EEF5FE;   /* ღია ლურჯი ბარათი */
  --st-r:    20px;      /* ბარათის კუთხე */
  --st-r-btn: 12px;
  --st-sh:   0 1px 2px rgba(11,30,72,.04), 0 8px 22px rgba(11,30,72,.05);
  --st-sh-h: 0 2px 6px rgba(11,30,72,.06), 0 14px 30px rgba(11,30,72,.09);
}

/* ══════════════════ 1 · სექციის რიტმი ══════════════════ */
/* მთავარ გვერდზე 48px-ია; შიდა გვერდებზე 3.5–6rem იყო (56–96px). */
.v2-sec  { padding-block: clamp(32px, 5vw, 52px); }
.pr-sec  { padding-block: clamp(28px, 4vw, 44px); }
.v2-sec--slate,
.fz-plansSec,
.fz-cmpSec { background: var(--st-bg-2); }

/* ══════════════════ 2 · ტიპოგრაფია ══════════════════ */
.v2-h1, .v2-h2, .fz-h1, .pr-hero h1, .tb-top h1 { color: var(--sh-ink); }
.v2-lead, .fz-lead, .pr-hero__lead, .tb-lead { color: var(--sh-ink-2); }
.v2-sm, .v2-xs { color: var(--sh-ink-3); }
/* „eyebrow" — მუქ ფონზე ფირუზისფერი იყო; ღიაზე მუქ ლურჯს ვაძლევთ */
.v2-eyebrow { color: var(--sh-blue-d); }
.v2-eyebrow::before { background: var(--sh-blue); }

/* ══════════════════ 3 · ღილაკები ══════════════════ */
/* ⚠️ `transition: all` არსად; hover მხოლოდ ნამდვილ კურსორზე. */
.v2-btn {
  border-radius: var(--st-r-btn);
  font-family: var(--imec-display);
  padding: .8rem 1.45rem;
  min-height: 48px;
  transition: background-color .2s ease, border-color .2s ease,
              color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.v2-btn--sm { min-height: 40px; padding: .55rem 1.05rem; }
.v2-btn--lg { min-height: 54px; padding: .95rem 1.8rem; }

.v2-btn--blue,
.v2-btn--primary { --bg: var(--sh-blue); --fg: #fff; box-shadow: none; }
.v2-btn--teal    { --bg: var(--sh-teal-d); --fg: #fff; box-shadow: none; }
.v2-btn--navy    { --bg: var(--sh-ink); --fg: #fff; }
.v2-btn--outline { --bg: #fff; --fg: var(--sh-blue); --bd: #C7DAFF; box-shadow: none; }
/* ⚠️ `--ghost` მუქ ჰეროზე იყო დახატული (თეთრი ტექსტი + გამჭვირვალე
   კონტური). ჰერო ღია გახდა — ღილაკი უხილავი რჩებოდა. */
.v2-btn--ghost   { --bg: #fff; --fg: var(--sh-blue); --bd: #C7DAFF; }

@media (hover: hover) and (pointer: fine) {
  /* ⚠️ `color` აქაც ცალსახად: `app.css`-ის `a:hover { color: var(--brand-dark) }`
     0,1,1-ია და ღილაკის კლასს ჯობნის — მუქ ფონზე წარწერა ქრებოდა. */
  .v2-btn--blue:hover, .v2-btn--primary:hover {
    --bg: var(--sh-blue-d); color: #fff; box-shadow: 0 6px 18px rgba(20,96,255,.28); transform: translateY(-2px);
  }
  .v2-btn--teal:hover  { --bg: #055E5B; color: #fff; box-shadow: 0 6px 18px rgba(6,115,111,.26); transform: translateY(-2px); }
  .v2-btn--navy:hover  { --bg: #16305F; color: #fff; transform: translateY(-2px); }
  .v2-btn--outline:hover,
  .v2-btn--ghost:hover { --bg: #EAF2FF; --bd: var(--sh-blue); color: var(--sh-blue); transform: translateY(-2px); }
}
.v2-btn:active { transform: translateY(0); box-shadow: none; }
.v2-btn:focus-visible { outline: 3px solid rgba(20,96,255,.4); outline-offset: 2px; }

/* ══════════════════ 4 · ბარათები ══════════════════ */
.v2-card, .v2-feat, .v2-plan, .fz-plan, .pr-card, .pr-infoCard {
  border-radius: var(--st-r);
  border-color: var(--sh-line);
  box-shadow: var(--st-sh);
}
.v2-feat__ico, .fz-plan__ico { background: #E4EEFE; color: var(--sh-blue); border-radius: 12px; }
.v2-feat__ico--teal { background: #DDF1F0; color: var(--sh-teal-d); }
@media (hover: hover) and (pointer: fine) {
  .v2-card:hover, .v2-feat:hover, .v2-plan:hover, .fz-plan:hover, .pr-card:hover {
    transform: translateY(-3px); box-shadow: var(--st-sh-h); border-color: #C7DAFF;
  }
}
/* გამორჩეული პაკეტი — ფირუზისფრის ნაცვლად ბრენდის ლურჯი კონტური */
.fz-plan.is-hot { border-color: #B9D2FF; box-shadow: var(--st-sh-h); }

/* FAQ „details" — მთავარი გვერდის რიგების იერი */
.v2-faq details { border-radius: var(--st-r-btn); border: 1px solid #DFE9F8; background: #fff; }
.v2-faq details[open] { border-color: #C7DAFF; box-shadow: var(--st-sh); }
.v2-faq summary { min-height: 54px; }

/* ══════════════════ 5 · მუქი ბლოკები → ღია ══════════════════ */

/* ── ტარიფების ჰერო (/fasebi) ── */
/* ⚠️ `.fz .fz-h1` და `.fz .fz-eyebrow` v2.css-ში 0,2,0-ია (თეთრი ტექსტი
   მუქ ჰეროზე) — ერთკლასიანი წესი მათ ვერ სძლევდა და სათაური ღია ფონზე
   უხილავი რჩებოდა. */
.fz .fz-h1 { color: var(--sh-ink); }
.fz .fz-eyebrow { color: var(--sh-blue-d); }
.fz .fz-eyebrow::before { background: var(--sh-blue); }
/* ყიდვის ღილაკები ერთ ენაზე: ლურჯი და ფირუზისფერი (მუქი navy აღარ) */
.fz-plan .v2-btn--navy { --bg: var(--sh-blue); --fg: #fff; }
@media (hover: hover) and (pointer: fine) {
  .fz-plan .v2-btn--navy:hover { --bg: var(--sh-blue-d); color: #fff; }
}

.fz-hero {
  background: var(--st-bg-1);
  color: var(--sh-ink);
  border-bottom: 1px solid rgba(11,30,72,.055);
}
.fz-hero::after { display: none; }          /* ბადის ტექსტურა მუქისთვის იყო */
.fz-crumb        { color: var(--sh-ink-3); }
.fz-crumb a      { color: var(--sh-blue-d); }
.fz-crumb a:hover{ color: var(--sh-blue); }
.fz-crumb span   { color: #A9B7CE; }
.fz-lead         { color: var(--sh-ink-2); }
.fz-pills li {
  background: #fff; border: 1px solid var(--sh-line); color: var(--sh-ink-2);
  box-shadow: 0 1px 2px rgba(11,30,72,.04);
}
.fz-pills svg { color: var(--sh-teal-d); }

/* ── „ჩვენ შესახებ"-ის ჰერო ── */
.ab-hero {
  background: var(--st-bg-1);
  color: var(--sh-ink);
  border-bottom: 1px solid rgba(11,30,72,.055);
}
.ab-hero::after, .ab-hero::before { display: none; }
.ab-crumb        { color: var(--sh-ink-3); }
.ab-crumb a      { color: var(--sh-blue-d); }
.ab-crumb a:hover{ color: var(--sh-blue); }
.ab-crumb span   { color: #A9B7CE; }
.ab-lead         { color: var(--sh-ink-2); }
.ab-bullets li   { color: var(--sh-ink-2); }
.ab-bullets svg  { color: var(--sh-teal-d); }
/* ⚠️ `em` გრადიენტიანი ტექსტი მუქ ფონზე იყო — ღიაზე ფირუზისფერი ქრება. */
.ab-h1 em { background: none; -webkit-background-clip: initial; background-clip: initial;
            -webkit-text-fill-color: currentColor; color: var(--sh-blue); }
.ab-hero__media picture { box-shadow: var(--st-sh-h); border-color: var(--sh-line); }
.ab-trust { background: #fff; border: 1px solid var(--sh-line); box-shadow: var(--st-sh); }
.ab-trust b { color: var(--sh-ink); }
.ab-trust > span:last-child > span { color: var(--sh-ink-3); }
.ab-trust__ico { background: #DDF1F0; color: var(--sh-teal-d); }

/* ── მუქი CTA ბარათი და ზოლი (/fasebi) ── */
.v2-cta, .v2-strip {
  background: var(--st-bg-3);
  color: var(--sh-ink);
  border: 1px solid #DCE7F7;
}
.v2-strip { border-inline: 0; border-radius: 0; }
.v2-cta { border-radius: var(--st-r); }
.v2-cta::after, .v2-strip::after, .v2-strip::before { display: none; }
.v2-cta h3, .v2-strip h3 { color: var(--sh-ink); }
.v2-cta p,  .v2-strip p  { color: var(--sh-ink-2); }
.v2-cta__ico { background: #E4EEFE; border: 1px solid #C7DAFF; color: var(--sh-blue); }

/* ── მუქი ბანერი (/shesaxeb, /teoria) ── */
.th-banner, .tb-hero {
  background: var(--st-bg-3);
  border: 1px solid #DCE7F7;
  color: var(--sh-ink);
}
.th-banner::before, .tb-hero::before { display: none; }
/* ⚠️ ფონური ფოტო მუქ გრადიენტზე იყო გათვლილი; ღია ბლოკზე ტექსტს ჭამს,
   ამიტომ ძალიან სუსტად რჩება — მხოლოდ ატმოსფეროდ. */
.th-banner__bg { opacity: .1; }
.th-banner h2, .th-banner h3, .tb-hero h1, .tb-hero h2 { color: var(--sh-ink); }
.th-banner p, .tb-hero p { color: var(--sh-ink-2); }

/* ⚠️ ეს ორი 0,2,0-ია v2.css-ში (თეთრი ტექსტი მუქ ბლოკზე) — ერთკლასიანი
   წესი ვერ სძლევდა და სათაური ღია ფონზე უხილავი რჩებოდა. */
.ab .ab-h1 { color: var(--sh-ink); }
.tb .tb-hero__t, .tb .tb-banner h2 { color: var(--sh-ink); }

/* ── თეორიის თემების ჰერო და ბანერი (/teoria/:kategoria) ── */
.tb-hero__p, .tb-banner p { color: var(--sh-ink-2); }
.tb-hero__list li { color: var(--sh-ink-2); }
.tb-hero__list svg { color: var(--sh-teal-d); }
/* ⚠️ `.pr .pr-badge` 0,2,0-ია და თბილ #F2EDE4 ფონს აწესებდა — ცივ
   ტექსტთან 4.39:1 გამოდიოდა. ფონსაც ვაცივებთ (6.6:1). */
.pr .pr-badge { background: #EEF3FA; color: var(--sh-ink-2); }
.tb-crumb span { color: #A9B7CE; }
.tb-card__go { color: var(--sh-ink-3); }

/* ── ტარიფების „არა" სია ── */
.fz-no { color: var(--sh-ink-3); }

/* ── პროფილის თავსართი ── */
.pf-top {
  background: var(--st-bg-1);
  color: var(--sh-ink);
  border-bottom: 1px solid rgba(11,30,72,.055);
}
.pf-top h1, .pf-top h2, .pf-id__name { color: var(--sh-ink); }
.pf-top p, .pf-top small, .pf-id__mail, .pf-crumb { color: var(--sh-ink-2); }
.pf-crumb a { color: var(--sh-blue-d); }
.pf-chips li { background: #fff; border: 1px solid var(--sh-line); color: var(--sh-ink-2); }
/* მარშრუტების მუქი ბარათი პროფილში */
.pf-routes {
  background: var(--st-bg-3); border: 1px solid #DCE7F7; color: var(--sh-ink);
}
.pf-routes::before, .pf-routes::after { display: none; }
.pf-routes h2, .pf-routes h3, .pf-routes b { color: var(--sh-ink); }
.pf-routes p, .pf-routes__b span { color: var(--sh-ink-2); }

/* ── მარშრუტების ჰერო: თბილი კრემი → ცივი ლურჯი ── */
.pr-hero { background: var(--st-bg-1); border-bottom: 1px solid rgba(11,30,72,.055); }

/* ── თეორიის ზედა ზოლი ── */
.tb-top { background: var(--st-bg-1); border-bottom: 1px solid rgba(11,30,72,.055); }
.tb-crumb a { color: var(--sh-blue-d); }

/* ══════════════════ 6 · ძველი `app.css`-ის ლექსიკონი ══════════════════ */
/* კონტაქტი, შესვლა, რეგისტრაცია, შეკვეთები, სამართლებრივი გვერდები */
.wrap > .card, .card {
  background: #fff; border: 1px solid var(--sh-line); border-radius: var(--st-r);
  box-shadow: var(--st-sh);
}
.btn {
  border-radius: var(--st-r-btn); min-height: 48px;
  font-family: var(--imec-display);
  transition: background-color .2s ease, border-color .2s ease,
              color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.btn-primary { background: var(--sh-blue); border-color: var(--sh-blue); color: #fff; }
@media (hover: hover) and (pointer: fine) {
  .btn-primary:hover { background: var(--sh-blue-d); border-color: var(--sh-blue-d); color: #fff; box-shadow: 0 6px 18px rgba(20,96,255,.28); transform: translateY(-2px); }
}
.btn:active { transform: translateY(0); box-shadow: none; }
.btn:focus-visible { outline: 3px solid rgba(20,96,255,.4); outline-offset: 2px; }
.tbl th { color: var(--sh-ink-3); }
.tbl td, .tbl th { border-color: var(--sh-line); }

/* ══════════════════ 7 · გვერდის ღია ფონი ══════════════════ */
/* ⚠️ მხოლოდ იმ გვერდებზე, სადაც საიტის ჩვეულებრივი გარსია — გამოცდისა
   და მარშრუტის ეკრანებს (`bare`/`chromeless`) საკუთარი ფონი აქვთ. */
body.v2:not(.bare):not(.xm-body):not(.admin-mode) { background: #fff; }

@media (prefers-reduced-motion: reduce) {
  .v2-btn, .btn, .v2-card, .v2-feat, .v2-plan, .fz-plan, .pr-card { transition: none; }
  .v2-btn:hover, .btn:hover, .v2-card:hover, .v2-feat:hover,
  .v2-plan:hover, .fz-plan:hover, .pr-card:hover { transform: none; }
}

/* ══════════════════ 8 · ბაზისური ტოკენების გასწორება ══════════════════ */
/* ⚠️ `app.css` თბილ ნეიტრალებზე დგას (`--ink:#16211f`, `--line:#dfe5e2`) და
   სხვა ლურჯზე (`--brand:#2b53d4`). სწორედ ეს აჩენდა შეგრძნებას, რომ შიდა
   გვერდები „სხვა საიტია". აქ ტოკენებს მთავარი გვერდის ცივ პალიტრაზე
   ვაყენებთ — კომპონენტებს ხელს არ ვახლებთ, მხოლოდ ფერს.
   ⚠️ გამოცდის ეკრანი (`.xm-body`) და ადმინი გამორიცხულია — მათ საკუთარი
      პალიტრა აქვთ. */
body.v2:not(.admin-mode):not(.xm-body) {
  --ink:        var(--sh-ink);
  --text:       var(--sh-ink);
  --muted:      var(--sh-ink-3);
  --muted-2:    #8A9AB8;
  --line:       var(--sh-line);
  --line-soft:  #EEF3FA;
  --bg-soft:    var(--st-bg-2);
  --brand:      var(--sh-blue);
  --brand-dark: var(--sh-blue-d);
  --brand-soft: #E4EEFE;
  --r-lg:       var(--st-r);
  --r-sm:       var(--st-r-btn);
  --shadow-sm:  var(--st-sh);
  --shadow:     var(--st-sh-h);
  --wrap:       1200px;
}
.v2-wrap { width: min(1200px, 100% - 2.5rem); }

/* ══════════════════ 9 · ძველი გვერდის თავსართი და ველები ══════════════════ */
/* `.page-head` — კონტაქტი, სამართლებრივი, შეკვეთები. ღია ლურჯი ზოლი,
   ისეთივე, როგორიც მთავარი გვერდის ჰეროს ქვეშაა. */
.page-head {
  background: var(--st-bg-1);
  border-bottom: 1px solid rgba(11,30,72,.055);
  padding: clamp(1.6rem, 3vw, 2.4rem) 0 clamp(1.3rem, 2.4vw, 1.8rem);
}
.page-head h1 { color: var(--sh-ink); }
.page-head p  { color: var(--sh-ink-2); }
.section      { padding-block: clamp(32px, 5vw, 52px); }
.section-soft { background: var(--st-bg-2); }

.input, .select, .textarea { border-radius: var(--st-r-btn); min-height: 48px; }
.textarea { min-height: 130px; }
.input:focus, .select:focus, .textarea:focus {
  border-color: var(--sh-blue); box-shadow: 0 0 0 3px rgba(20,96,255,.18);
}
.field label { color: var(--sh-ink); }
.alert { border-radius: var(--st-r-btn); }

/* ბარათის სათაური ცოტა უფრო მკაფიოდ — ძველ გვერდებზე h3 ტექსტს ეწებებოდა */
.card > h3:first-child { margin-bottom: .6rem; }

/* ══════════════════ 10 · დარჩენილი კონტრასტები ══════════════════ */
/* ⚠️ `--teal-dark: #0FA37D` პატარა ტექსტზე თეთრზე 3.2:1-ია — 4.5 სჭირდება.
   `--teal: #16C79A` კიდევ უფრო ღიაა. ორივეს ვასწორებთ იმ ტონზე, რაც
   მთავარ გვერდზეა (`--sh-teal-d`, 5.7:1). */
body.v2:not(.admin-mode):not(.xm-body) {
  --teal-dark: var(--sh-teal-d);
  --teal:      var(--sh-teal-d);
  --cyan:      var(--sh-blue);
  /* ⚠️ `--muted-2` თეთრზე 2.8:1 იყო — ველების მინიშნებები ძლივს იკითხებოდა */
  --muted-2:   var(--sh-ink-3);
  /* მარშრუტების გვერდის თბილი კრემი → მთავარი გვერდის ცივი ტონი */
  --pr-bg:     var(--st-bg-2);
  --pr-ink:    var(--sh-ink);
  --pr-muted:  var(--sh-ink-3);
}
.hint, .pf-try__go, .th-quick__go, .th-card__go, .pr-credits { color: var(--sh-ink-3); }

/* ⚠️ `:is(.th, .ab) .th-banner h2` v2.css-ში 0,2,1-ია — ერთკლასიანი
   წესი მას ვერ სძლევდა და ბანერის სათაური ღია ფონზე თეთრი რჩებოდა. */
:is(.th, .ab, .tb) .th-banner h2,
:is(.th, .ab, .tb) .th-banner h3 { color: var(--sh-ink); }
.ab .ab-eyebrow, .fz .fz-eyebrow, .th .th-eyebrow { color: var(--sh-blue-d); }
.ab .ab-eyebrow::before, .th .th-eyebrow::before { background: var(--sh-blue); }
.v2-cta a:not(.v2-btn) { color: var(--sh-blue-d); }
.ab-part__lab, .ab-part__go, .fz-plan__perday { color: var(--sh-teal-d); }
.ab-part--teal .ab-part__lab, .ab-part--teal .ab-part__ico { background: #DDF1F0; color: var(--sh-teal-d); }

/* ბოლო სამი წერტილი — თითოეული გაზომილია, არა თვალით */
body.v2:not(.admin-mode):not(.xm-body) {
  /* #64748B თეთრზე 4.42:1-ია — ზღვარს ცოტათი ვერ სწვდება */
  --ink-soft: var(--sh-ink-3);
  --th-mut:   var(--sh-ink-3);
}
.pr-credits a { color: var(--sh-ink-3); }
/* ⚠️ ლენტის ფონი `--teal`-ს იღებდა; ის მუქი გახდა და მუქ ტექსტთან
   2.8:1 დარჩა. ლენტს ღია ფონი და მუქი ტექსტი ვაძლევთ. */
.fz-plan__ribbon { background: #DDF1F0; color: var(--sh-teal-d); box-shadow: 0 6px 16px rgba(11,30,72,.10); }
.fz-plan__ribbon--on { background: var(--sh-blue); color: #fff; }
.fz-plan__ribbon--calm { background: #E4EEFE; color: var(--sh-blue-d); }

/* ══════════════════ 11 · 375px-ის სამი გადავსება ══════════════════ */
/* ⚠️ `.fz-tableWrap`-ს `overflow-x:auto` ჰქონდა, მაგრამ `min-width:0`
   არა — grid/flex-ის შვილი შიგთავსზე იწელებოდა და გვერდს 168px-ით
   აგდებდა ეკრანს გარეთ. სქროლი ახლა მართლა ცხრილშია. */
.fz-tableWrap { min-width: 0; max-width: 100%; }

/* ⚠️ გრძელი ბმული/ფოსტა სამართლებრივ გვერდებზე ხაზს არ ტეხდა. */
.wrap-narrow p, .wrap-narrow li, .page-head p, .card p { overflow-wrap: anywhere; }

/* ⚠️ შეხების სამიზნეები 40px-ზე ქვემოთ არ უნდა ჩამოვიდნენ. */
.pr-card__bm { width: 40px; height: 40px; }
.ups__x { width: 40px; height: 40px; }

/* ══════════════════ 12 · ბოლო ორი გამონაკლისი ══════════════════ */

/* ⚠️ `/praktika`-ს თბილი კრემისფერი პალიტრა (simulatori.ge-დან აღებული)
   0,1,1-ია (`.pr .pr-hero`) და მთელი გვერდი სხვა ტემპერატურაზე იდგა.
   ტოკენებს ცივ, მთავარი გვერდის ტონებზე ვაყენებთ. */
.pr {
  --pr-bg:    #fff;
  --pr-ink:   var(--sh-ink);
  --pr-muted: var(--sh-ink-3);
  --pr-hair:  var(--sh-line);
  --pr-line:  #C7DAFF;
  --pr-acc:   var(--sh-blue);
  --pr-acc-d: var(--sh-blue-d);
  --pr-sh:    var(--st-sh);
}
.pr .pr-hero { background: var(--st-bg-1); border-bottom: 1px solid rgba(11,30,72,.055); }

/* ⚠️ `.tb-hero`-ს ფონად ფოტო აქვს და თეთრ ტექსტზე იყო გათვლილი.
   ბლოკი ღია გახდა → მუქი ტექსტი ფოტოზე იკარგებოდა. ფოტოს ვტოვებთ
   მხოლოდ ატმოსფეროდ, ტექსტი კი სუფთა ღია ფონზე ჯდება. */
.tb-hero__bg { opacity: .12; }
.tb-hero__art { opacity: .35; }
.tb-hero__list svg { color: var(--sh-teal-d); }

/* კონტაქტის გვერდი — WhatsApp ღილაკი საკონტაქტო ბარათში */
.ct-wa {
  display: inline-flex; align-items: center; gap: .5rem; margin-top: .9rem;
  min-height: 44px; padding: .5rem .95rem; border-radius: 12px;
  background: #25D366; color: #06321F; font-weight: 700; font-size: .92rem;
  text-decoration: none;
}
.ct-wa:hover { background: #1FBE59; color: #06321F; }

/* ══ გადახდის არჩევანი — ბარათი და გადარიცხვა თანაბრად ══════════
   ⚠️ „ან"-გამყოფიანი განლაგება მეორე გზას მეორეხარისხოვნად აჩვენებდა;
   ბანკის გადარიცხვა კი ახლა ისეთივე სრულფასოვანი არხია. */
.ck-ways { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); align-items: start; }
.ck-way {
  display: grid; gap: .5rem; align-content: start;
  padding: 1.1rem; border-radius: var(--r-lg, 16px);
  background: #fff; border: 1px solid var(--hair, #E6ECEA);
}
.ck-way__t { display: flex; align-items: center; gap: .5rem; margin: 0; font-size: 1.02rem; }
.ck-way__t svg { flex: none; opacity: .7; }
.ck-way__p { margin: 0 0 .3rem; font-size: .86rem; line-height: 1.55; color: var(--muted-2, #6B7C96); }
/* ბარათის ჩავარდნის შემდეგ — რატომ ღირს გადარიცხვა. მწვანე, რომ
   წითელ გაფრთხილებას გამოსავლად დაუპირისპირდეს და არა კიდევ ერთ ხმაურად. */
.ck-way__hint { margin: -.1rem 0 .3rem; font-size: .84rem; line-height: 1.5; color: #0FA37D; font-weight: 500; }
.ck-alt { display: block; margin-top: .35rem; font-weight: 600; }
/* მეორე ღილაკი „მოჩვენება" არაა — მკვეთრი კონტური, იმავე სიმაღლის */
.ck-way__b { background: #fff; border: 1.5px solid var(--brand, #155EEF); color: var(--brand, #155EEF); }
.ck-way__b:hover { background: var(--brand-soft, #EEF3FF); color: var(--brand-dark, #0F47B8); }

/* ══ გადახდის ნიშნები — Visa/Mastercard და ბანკები ═══════════════
   მიზანი: მყიდველმა ღილაკის დაჭერამდე დაინახოს, რითი შეუძლია გადახდა.
   ⚠️ ნიშანი მხოლოდ მაშინ ჩნდება, როცა მეთოდი მართლა მუშაობს —
   იხ. `partials/pay-marks.ejs`. */
.pm { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; margin-bottom: .1rem; }
.pm__i {
  display: inline-flex; align-items: center; gap: .3rem;
  height: 30px; padding: 0 .55rem; border-radius: 7px;
  background: #fff; border: 1px solid var(--hair, #E1E7EC);
  box-shadow: 0 1px 2px rgba(11,21,38,.05);
}
.pm__i svg { display: block; }

/* Visa — სიტყვიერი ნიშანი ბრენდის ლურჯში */
.pm__visa {
  font-family: Helvetica, Arial, sans-serif; font-style: italic; font-weight: 800;
  font-size: .82rem; letter-spacing: .04em; color: #1A1F71;
}
.pm__apple { color: #000; }
.pm__apple b, .pm__gpay b { font-size: .8rem; font-weight: 600; letter-spacing: -.01em; }
.pm__gpay b { color: #3C4043; }

/* ბანკი — თავის კორპორატიულ ფერში (ფერი IBAN-იდან, იხ. transfer.js) */
.pm__bank { border-color: color-mix(in srgb, var(--pm-brand) 38%, #fff); }
.pm__bank b { font-size: .8rem; font-weight: 800; letter-spacing: .01em; color: var(--pm-brand); }
.pm__dot {
  width: 11px; height: 11px; border-radius: 3px; flex: none;
  background: var(--pm-brand);
}

@media (max-width: 380px) { .pm__i { height: 28px; padding: 0 .45rem; } }

/* გადარიცხვის გვერდის (/gd/:code) სტილი — `transfer.css`-შია (2026-09-16) */

/* „აწიე თვიურზე" ჩათვლის ხაზი ფასების ბარათზე */
.fz-plan__promo { margin: -.35rem 0 .5rem; font-size: .82rem; font-weight: 600; color: #0FA37D; }