/* GEMOVIE custom layer — fills gaps around ge.movie theme classes */
:root { --ge-red: #008170; --ge-dark: #0f0f0f; --ge-card: #232d3f; }

/* premium ქართული ფონტი — adjaranett.com-ის მიხედვით (BPG Mrgvlovani) */
html, body, .content, input, select, button, textarea, a, p, li, .arial, .nav-link {
  font-family: "BPG Mrgvlovani", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans Georgian", sans-serif !important;
}
/* სათაურები/გამორჩეული ტექსტი — BPG Mrgvlovani Caps (adjaranett.com-ის h2/h3 შესაბამისად) */
h1, h2, h3, h4, h5, .ge-section-title, .movie-card__title,
.mf-titlebar h1, .SlidetTitle, .ge-hero__title {
  font-family: "BPG Mrgvlovani Caps", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans Georgian", sans-serif !important;
}
html, body { background: #0f0f0f; color: #fff; max-width: 100%; }
/* თემა `.filter`-ს (browse/persons გვერდის root wrapper) აძლევს float:left-ს
   (style.min.css-ის საერთო სელექტორში) — float-ს არავინ არ ასუფთავებდა, ამიტომ
   .content თავად კოლაფსდებოდა height:0-მდე იმ გვერდებზე, რაც header-ის
   sticky-ს პირდაპირ ტეხავდა (containing block-ის სიმაღლე 0 იყო). flow-root
   ავტომატურად აკავებს float-ებს, overflow:hidden საჭირო აღარაა. */
.content { display: flow-root; }
/* overflow-x:hidden მხოლოდ html-ზეა (არა body-ზეც და არა .content-ზეც) — თუ ორივეს
   (ან .content-საც) ცალკე overflow ედება, body/​.content თავად ხდება sticky-ს
   containing block, რომელიც არასდროს სქროლავს დამოუკიდებლად → header-ის
   position:sticky მუშაობას წყვეტს. html-ის ერთი წესი საკმარისია გვერდითი
   overflow-ის დასაფარად (viewport-ზე ვრცელდება). */
html { overflow-x: hidden !important; }
/* თემის style.min.css აყენებს body{overflow-x:hidden}-ს — ეს body-საც აქცევს sticky-ს
   containing block-ად და header-ს "აწებებას" ტეხავს; ვაბრუნებთ visible-ზე, html-ის
   overflow საკმარისია გვერდითი overflow-ის დასაფარად. */
body { overflow-x: visible !important; }
.container { max-width: 100%; }
/* scrollbar — ნეიტრალური მუქი (ცისფერი „ლურჯი ზოლი" მოხსნილია) */
::-webkit-scrollbar, body::-webkit-scrollbar { width: 8px !important; height: 8px !important; }
::-webkit-scrollbar-track, body::-webkit-scrollbar-track { background: transparent !important; }
::-webkit-scrollbar-thumb, body::-webkit-scrollbar-thumb { background: #005b41 !important; border-radius: 4px !important; }
::-webkit-scrollbar-thumb:hover, body::-webkit-scrollbar-thumb:hover { background: #008170 !important; }
html { scrollbar-width: thin; scrollbar-color: #005b41 transparent; }

/* section titles / row heads */
.ge-section-title { font-size: 17px; font-weight: 700; margin: 0; color: #fff; }
.ge-row-head { display: flex; align-items: center; justify-content: space-between; margin: 28px 0 14px; }
.ge-more { color: #b3b3b3; font-size: 14px; }
.ge-more:hover { color: var(--ge-red); }

/* row slider nav buttons */
.movies-slider { position: relative; }
.movies-slider .sbtns .prev-slide,
.movies-slider .sbtns .next-slide {
  position: absolute; top: 40%; transform: translateY(-50%); z-index: 20;
  width: 42px; height: 42px; border-radius: 50%; background: rgba(0,0,0,.6);
  color: #fff; display: flex; align-items: center; justify-content: center;
  font-size: 26px; cursor: pointer; user-select: none; transition: .2s;
}
.movies-slider .sbtns .prev-slide { left: 4px; }
.movies-slider .sbtns .next-slide { right: 4px; }
.movies-slider .sbtns .prev-slide:hover,
.movies-slider .sbtns .next-slide:hover { background: var(--ge-red); }
.swiper-button-disabled { opacity: .3; pointer-events: none; }

/* hero — featured (left 60%) + 3x3 thumbs (right 40%) */
.hero { margin-top: 18px; height: auto !important; }
.hero-slider:after { display: none !important; }
.ge-hero { display: flex; gap: 16px; height: 560px; }
.ge-hero__featured { position: relative; flex: 0 0 60%; max-width: 60%; border-radius: 14px; overflow: hidden; display: block; }
.ge-hero__bg { position: absolute; inset: 0; background-size: cover; background-position: center; transition: background-image .3s ease; }
.ge-hero__featured::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(10,11,16,.9) 0%, rgba(10,11,16,.4) 40%, rgba(10,11,16,.05) 70%); }
.ge-hero__info { position: absolute; left: 40px; bottom: 50px; z-index: 2; max-width: 80%; }
.ge-hero__play { display: inline-block; background: var(--ge-red); color: #fff; padding: 12px 30px; border-radius: 8px; font-weight: 600; font-size: 15px; }
.ge-hero__featured:hover .ge-hero__play { background: #008170; }
.ge-hero__title { font-size: 40px; font-weight: 800; color: #fff; margin: 22px 0 12px; text-shadow: 0 2px 12px rgba(0,0,0,.6); }
.ge-hero__meta { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.ge-hero__genres span { color: #d7d7d7; font-size: 14px; }
.ge-hero__genres span:not(:last-child)::after { content: "•"; margin: 0 8px; color: #777; }
.imdb-badge { background: #f5c518; color: #000; font-weight: 700; padding: 4px 9px; border-radius: 4px; font-size: 13px; }

.ge-hero__thumbs { flex: 1; display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 1fr); gap: 14px; }
.ge-hero__thumb { position: relative; border-radius: 10px; overflow: hidden; cursor: pointer; background: #232d3f; transition: transform .2s, box-shadow .2s; }
.ge-hero__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ge-hero__thumb.active { outline: 3px solid var(--ge-red); outline-offset: -3px; }
.ge-hero__thumb:hover { transform: scale(1.04); z-index: 3; box-shadow: 0 8px 24px rgba(0,0,0,.5); }
.ge-hero__thumb-title { position: absolute; left: 0; right: 0; bottom: 0; padding: 8px 10px; font-size: 12px; color: #fff; background: linear-gradient(transparent, rgba(0,0,0,.85)); opacity: 0; transition: .2s; }
.ge-hero__thumb:hover .ge-hero__thumb-title { opacity: 1; }
@media (max-width: 992px) {
  .ge-hero { flex-direction: column; height: auto; }
  .ge-hero__featured { flex: none; max-width: 100%; height: 340px; }
  .ge-hero__thumbs { grid-template-rows: repeat(2, 90px); }
  .ge-hero__title { font-size: 26px; }
}

/* სარეკლამო popup — ქვედა ცენტრში მცოცავი toast-ბანერი (croconet.cam-ის მსგავსი
   მექანიზმით: fixed, bottom-anchored, 90%/max 700px/100px სიმაღლე), მხოლოდ
   დესკტოპზე/ტაბლეტზე (მობილურზე მალავს კიდეც croconet-ი) */
.ge-popup-ad {
  position: fixed; bottom: 14px; left: 50%; z-index: 1100;
  width: 90%; max-width: 700px; height: 100px;
  background: var(--ge-card); border: 1px solid #005b41; border-radius: 12px; overflow: hidden;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 16px 44px rgba(0,0,0,.5);
  opacity: 0; transform: translateX(-50%) translateY(24px); pointer-events: none;
  transition: opacity .35s ease, transform .35s ease;
}
.ge-popup-ad.is-visible { opacity: 1; transform: translateX(-50%) translateY(0); pointer-events: auto; }
.ge-popup-ad__close {
  position: absolute; top: 8px; right: 8px; z-index: 2;
  width: 26px; height: 26px; border-radius: 50%; border: 0; cursor: pointer;
  background: rgba(0,0,0,.55); color: #fff; font-size: 16px; line-height: 1;
  display: flex; align-items: center; justify-content: center; transition: background .15s;
}
.ge-popup-ad__close:hover { background: var(--ge-red); }
.ge-popup-ad img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 767px) {
  .ge-popup-ad { display: none !important; }
}

/* filter bar */
.filter.movie-list { padding-left: 26px; padding-right: 26px; }
.ge-filterbar { display: flex; flex-wrap: wrap; gap: 20px; padding: 26px 0 14px; align-items: flex-end; }
.ge-filter__group { display: flex; flex-direction: column; gap: 8px; }
.ge-filter__group label {
  font-family: "BPG Mrgvlovani Caps", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans Georgian", sans-serif;
  font-size: 12px; line-height: 1.6; font-weight: 700; letter-spacing: .4px; text-transform: uppercase; color: #9aa0ac;
}
.ge-filterbar select {
  background: var(--ge-card); color: #fff; border: 1px solid #005b41;
  border-radius: 10px; padding: 12px 16px; font-size: 14px; min-width: 170px; cursor: pointer;
  transition: border-color .15s;
}
.ge-filterbar select:hover { border-color: #008170; }
.ge-filterbar select:focus { outline: none; border-color: var(--ge-red); }
.ge-loader { text-align: center; padding: 26px; color: #9aa0ac; }
.ge-empty { text-align: center; padding: 40px; color: #9aa0ac; }

/* detail page */
/* თემა float:left-ს აძლევს .movies-full-საც, .movies-full .container-საც და
   .movies-full__inside-საც (საერთო სელექტორის სიაში) — float-ს არავინ ასუფთავებდა,
   ამიტომ .movies-full-ის სიმაღლე მხოლოდ ზედა (პოსტერი+ფლეერი) ნაწილს ითვლიდა და
   სათაური/ინფო/სიუჟეტი/მსახიობები მის გარეთ, მიუწვდომლად „გადმოსდიოდა" — ამის გამო
   ჩაბნელებული ბექგრაუნდიც ვერ სწვდებოდა იმ ტექსტის ბოლომდე. flow-root თავად
   აკავებს ყველა შვილ float-ს ჩაბუდებულობის მიუხედავად */
.movies-full { position: relative; display: flow-root; padding: 30px 0 50px; z-index: 0; float: none !important; width: 100% !important; overflow: hidden; }
.movies.related { clear: both; }
/* თემის დეკორატიული overlay (680px-მდე მუქდება მყარ ფერამდე #1a1c22) — ეს ჩვენს
   გახანგრძლივებულ ჩაბნელებულ ბექგრაუნდს ზუსტად სათაურთან ერთ ბრტყელ ნაცრისფერ
   ზოლად კვეთდა; საერთოდ ვშლით — ბექგრაუნდის საკუთარი mask-გრადიენტი უკვე
   საკმარისად აბნელებს */
.movies-full::after, .movies-full:after { display: none !important; }
/* ჩაბნელებული პოსტერი — ge.movie-ს მსგავსად მთელ .movies-full-ს (პოსტერი+ფლეერი
   +სათაური/ინფო/სიუჟეტი/მსახიობები) უნდა მისდევდეს, არა მხოლოდ ზედა 720px-ს —
   height:100% პარენტის (.movies-full) სრულ სიმაღლეს იღებს, ასე რომ ჩამოსქროლვისას
   ბექგრაუნდი ზუსტად იმ წერტილამდე გრძელდება, სადაც „მსგავსი ფილმების" სექცია იწყება */
.movies-full .bg-image { position: absolute; top: 0; left: 0; right: 0; height: 100% !important; background-size: cover; background-position: center 18%;
  filter: blur(3px) brightness(.65); opacity: 1; z-index: 0 !important; pointer-events: none; transform: scale(1.05);
  -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 90%, rgba(0,0,0,0) 100%);
  mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 90%, rgba(0,0,0,0) 100%); }
/* ჩამოსქროლვის დოზაზე მიბმული ჩაბნელება — ჩამოსქროლვისას ბექგრაუნდი თანდათან
   შავდება (scrollY-ის პროპორციულად), ავსქროლვისას იმავე დოზით უბრუნდება
   ნაცრისფერს; JS (movie.html) აყენებს --mf-fade ცვლადს scroll listener-ით */
.mf-scroll-fade {
  position: absolute; inset: 0; background: #0f0f0f;
  opacity: var(--mf-fade, 0); pointer-events: none; z-index: 1;
}
.movies-full .container { position: relative; z-index: 300; }
.movies-full__content, .movies-full__player, #movie_embed { position: relative; z-index: 300 !important; }
.movies-full__player { pointer-events: auto; }
/* detail — poster left + player right (ge.movie layout: ორივე ტოლ სიმაღლეზე) */
/* !important-ები აჭარბებენ თემის მკაცრ height/width-ებს (580/702/280px) */
.movies-full__content { display: flex !important; gap: 20px; align-items: stretch !important; height: 580px !important; padding: 0 !important; margin: 0 0 34px !important; float: none !important; }
.movies-full__poster { flex: 0 0 386px !important; width: 386px !important; max-width: 386px; height: 100% !important; display: flex !important; flex-direction: column; float: none !important; border-radius: 12px; overflow: hidden; background: #232d3f; }
.movies-full__poster img { width: 100%; flex: 1 1 auto; min-height: 0; height: auto !important; object-fit: cover; display: block; background: #232d3f; border-radius: 0; }
.mf-trailer { background: var(--ge-red); color: #fff; border: 0; padding: 16px; font-size: 15px; font-weight: 600; cursor: pointer; width: 100%; flex: 0 0 auto; }
.mf-trailer:hover { background: #008170; }
.movies-full__player { flex: 1 1 auto !important; width: auto !important; position: relative; aspect-ratio: auto !important; height: 100% !important; background: #000; border-radius: 12px; overflow: hidden; margin: 0 !important; float: none !important; font-size: 0 !important; }
@media (max-width: 1200px) { .movies-full__content { height: 470px !important; } .movies-full__poster { flex-basis: 320px !important; width: 320px !important; } }
@media (max-width: 860px) {
  /* მობაილზე პოსტერი + თრეილერის ღილაკი საერთოდ არ გვინდა — მხოლოდ დიდი
     ფლეერი; თემას თავად აქვს .movies-full__poster{display:none} ამ სიგანეზე,
     მაგრამ ჩვენი ბაზისური .movies-full__poster{display:flex!important} (386px
     desktop layout-ისთვის) მას გადაფარავდა — აქ ვშლით პოსტერს პირდაპირ */
  .movies-full__content { height: auto !important; flex-direction: column; }
  .movies-full__poster { display: none !important; }
  .movies-full__player { height: auto !important; aspect-ratio: 16/9 !important; width: 100% !important; }
}
.movies-full__player iframe { width: 100%; height: 100%; border: 0; display: block; }
.ge-noplayer { display: flex; align-items: center; justify-content: center; height: 100%; color: #9aa0ac; }
.mf-sources { position: absolute; top: 12px; left: 12px; z-index: 5; display: flex; gap: 8px; flex-wrap: wrap; }
.mf-source { background: rgba(20,22,29,.85); color: #fff; border: 1px solid #005b41; border-radius: 6px; padding: 7px 14px; cursor: pointer; font-size: 13px; }
.mf-source.active, .mf-source:hover { background: var(--ge-red); border-color: var(--ge-red); }

/* ეპიზოდის არჩევა — სერიალის/ანიმეს დეტალურ გვერდზე, ფლეერის ქვემოთ. მრავალი
   ცალკე ღილაკის მაგივრად (რაც 30-40+ ეპიზოდზე გრძელ, არეულ ზოლად იშლებოდა) —
   ერთი ჩამოსაშლელი + წინა/შემდეგი ისრები, თემასთან შეხამებული */
.mf-episodes { display: flex; align-items: center; gap: 10px; padding: 16px 0 4px; margin: 0 0 8px; }
.mf-episodes__label { color: #8a8f9a; font-size: 13px; font-weight: 600; flex: 0 0 auto; }
.mf-episodes__select-wrap { position: relative; flex: 0 1 260px; min-width: 0; }
.mf-episodes__select-wrap::after {
  content: ""; position: absolute; right: 14px; top: 50%; width: 8px; height: 8px;
  border-right: 2px solid #cfd2d8; border-bottom: 2px solid #cfd2d8;
  transform: translateY(-70%) rotate(45deg); pointer-events: none;
}
.mf-episodes__select {
  appearance: none; -webkit-appearance: none; width: 100%;
  background: var(--ge-card); color: #fff; border: 1px solid #005b41; border-radius: 8px;
  padding: 10px 34px 10px 14px; font-size: 14px; font-weight: 600; font-family: inherit;
  cursor: pointer; transition: border-color .15s;
}
.mf-episodes__select:hover, .mf-episodes__select:focus { border-color: var(--ge-red); outline: none; }
.mf-episodes__nav {
  flex: 0 0 auto; width: 38px; height: 38px; border-radius: 50%; border: 1px solid #33384a;
  background: transparent; color: #aeb4c0; font-size: 20px; line-height: 1; cursor: pointer; transition: .18s;
}
.mf-episodes__nav:hover { border-color: var(--ge-red); color: #fff; background: var(--ge-red); }

/* ===== detail — info block (ge.movie style) ===== */
:root { --ge-gold: #d7b15a; }
/* თემა float:left-ს .movies-full__inside-საც აძლევს (იხ. კომენტარი ზემოთ .movies-full-ზე) —
   float:none არეს გარეშე შემდეგი და-ძმა (.related) მის გვერდით, ზედა კიდესთან ბრუნდებოდა
   პლეერის დონეზე, ნაცვლად იმისა, რომ ქვემოთ ჩამომდგარიყო */
.movies-full__inside { margin-top: 30px; float: none !important; width: 100% !important; }

/* titlebar: titles + tool buttons — ისევე დავაფარგლოთ 980px-ზე, როგორც .mf-plot (ქვემოთ),
   თორემ ფართო ეკრანზე ტიტული/ღილაკები/რეიტინგი მთელ (>1800px) სიგანეზე იშლებოდა და ერთმანეთისგან
   უაზროდ შორს, „შუაში მიყრილს" ჰგავდა, სანამ სიუჟეტი კი ვიწრო, კითხვად სვეტში იყო მოქცეული */
.mf-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; max-width: 980px; }
.mf-head__titles h1 { font-size: 30px; font-weight: 700; margin: 0; color: #fff; line-height: 1.2; }
.mf-orig { color: #9096a2; margin-top: 8px; font-size: 13px; letter-spacing: .5px; text-transform: uppercase; }
.mf-tools { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.mf-tool { width: 46px; height: 46px; border-radius: 50%; background: transparent; border: 1px solid #33384a;
  color: #aeb4c0; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: .18s; padding: 0; }
.mf-tool svg { width: 20px; height: 20px; fill: currentColor; }
.mf-tool:hover { border-color: #4a516a; color: #fff; }
.mf-fav.is-active { background: var(--ge-red); border-color: var(--ge-red); color: #fff; }
.mf-help { display: inline-flex; align-items: center; gap: 8px; height: 46px; padding: 0 18px; border: 0; cursor: pointer;
  background: var(--ge-red); color: #fff; border-radius: 8px; font-size: 14px; font-weight: 600; }
.mf-help svg { width: 18px; height: 18px; fill: currentColor; }
.mf-help:hover { background: #008170; }

/* rating bar: IMDb (left) + stars/score/votes (right) */
.mf-ratingbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 22px 0 24px; flex-wrap: wrap; max-width: 980px; }
.mf-imdb { display: inline-flex; align-items: center; gap: 12px; }
.mf-imdb__logo { background: #f5c518; color: #000; font-weight: 800; font-size: 13px; letter-spacing: -.5px;
  padding: 5px 8px; border-radius: 5px; font-family: Arial, sans-serif; }
.mf-imdb b { color: #fff; font-size: 20px; font-weight: 700; }
.mf-userrate { display: inline-flex; align-items: center; gap: 14px; }
.mf-stars { display: inline-flex; gap: 3px; }
.mf-star { width: 22px; height: 22px; fill: #3a3f4d; }
.mf-star.is-on { fill: #f5c518; }
.mf-score { background: var(--ge-red); color: #fff; font-weight: 700; font-size: 14px; min-width: 40px; text-align: center;
  padding: 6px 8px; border-radius: 8px; }
.mf-votes { display: inline-flex; align-items: center; gap: 6px; color: #9096a2; font-size: 14px; }
.mf-votes svg { width: 18px; height: 18px; fill: #9096a2; }

/* info list: label: value */
.mf-info { list-style: none; margin: 0 0 26px; padding: 0; display: flex; flex-direction: column; gap: 12px; max-width: 980px; }
.mf-info li { font-size: 15px; line-height: 1.5; }
.mf-info__k { color: #8a8f9a; margin-right: 8px; }
.mf-info__v, .mf-info__v a { color: var(--ge-gold); }
.mf-info__v a:hover { color: #fff; text-decoration: underline; }
.mf-info__v--plain { color: var(--ge-gold); }

/* plot */
.mf-plot { max-width: 980px; margin-top: 6px; }
.mf-plot__title { font-size: 16px; font-weight: 700; color: #fff; margin: 0 0 12px; }
.mf-plot p { line-height: 1.8; color: #c3c7d0; margin: 0; }


/* recommended section — full-width even grid + styled title */
/* თემა `.movies.related`-ს ზოგ შემთხვევაში მალავს (display:none/float/50%) — ვაჩვენებთ */
.movies.related { display: block !important; float: none !important; width: 100% !important; }
.related { margin-top: 48px; }
.ge-rec-title { font-size: 24px; font-weight: 700; color: #fff;
  letter-spacing: .3px; margin: 0 0 32px; position: relative; padding-left: 15px;
  display: block; height: 30px !important; line-height: 30px !important; min-height: 0 !important; }
.ge-rec-title::before { content: ""; position: absolute; left: 0; top: 2px; height: 24px; width: 5px;
  border-radius: 3px; background: var(--ge-red); }
.ge-rec-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 26px 18px; width: 100%; }
.ge-rec-grid > [class*="col-"] { width: 100% !important; max-width: 100% !important; flex: none !important;
  padding: 0 !important; margin: 0 !important; min-width: 0; }
.ge-rec-grid .movie-card__title h2 a span,
.ge-rec-grid .movie-card__title h2 a p { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 1500px) { .ge-rec-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
@media (max-width: 1200px) { .ge-rec-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 860px)  { .ge-rec-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px 12px; } }
/* მობაილზე — ვერტიკალურად დაწყობილი 2 სვეტის ნაცვლად (რაც მიწებებულად გამოიყურებოდა),
   ჰორიზონტალურად სქროლვადი 2-მწკრივიანი ბადე, top9/ბოლო-ეპიზოდების იგივე ნიმუშით */
@media (max-width: 560px) {
  .ge-rec-grid {
    display: grid; grid-template-columns: none; grid-template-rows: repeat(2, auto);
    grid-auto-flow: column; grid-auto-columns: minmax(120px, 42%);
    gap: 22px 14px; overflow-x: auto; overflow-y: hidden;
    -webkit-overflow-scrolling: touch; scroll-snap-type: x proximity; padding-bottom: 6px;
  }
  .ge-rec-grid > [class*="col-"] { scroll-snap-align: start; }
}
@media (max-width: 680px) {
  .mf-head { flex-direction: column; }
  .mf-head__titles h1 { font-size: 24px; }
  .mf-ratingbar { gap: 12px; }
  /* ვიწრო ტელეფონებზე (≤360px) 4 ღილაკი ერთ მწკრივში აღარ ეტევა — ვახვევთ */
  .mf-tools { flex-wrap: wrap; row-gap: 10px; }
  /* თემა .movies-full__inside-ს 40px გვერდით padding-ს აძლევს (style.min.css) —
     390px ეკრანზე ეს მარტო 80px-ს (~20%) ჭამდა; ვპატარავებთ, რომ სათაური/აიქონები
     მარცხნივ დაიწიოს და მეტი სივრცე დარჩეს. ანალოგიურად .related-ს თემიდან აქვს
     padding:30px + styles.css-იდან ცალკე padding-right:45px (ჯამში 30/45
     ასიმეტრიული!) — ვშლით მთლიანად, .container-ის 15px უკვე საკმარისია, რომ
     "რეკომენდირებული" ბარათები არ ჩაცუცქულიყო ცარიელ არეში */
  .movies-full__inside { padding: 0 16px !important; }
  .related { padding: 0 !important; }
}

/* header logo — MW shield emblem (square), larger than the old wordmark */
.header-top__logo img { height: 52px !important; width: auto; display: block; }
/* ლოგოს არარსებობისას (ბექოფისიდან წაშლილია) — საიტის სახელი ტექსტად */
.header-top__logo-text {
  display: block; font-size: 22px; font-weight: 700; color: #fff;
  letter-spacing: .5px; white-space: nowrap; line-height: 52px;
}
@media (max-width: 1024px) { .header-top__logo-text { font-size: 17px; line-height: 28px; } }

/* search autocomplete */
/* თემის საკუთარი pill-ფონი (#242731, ძველი პალიტრიდან) ჩანდა ჩვენი
   ძებნის ჩარჩოს გარშემო თხელ, არშესაბამის რგოლად — ვშლით, ფორმა თავად
   ხატავს საკუთარ ჩარჩოს/ფონს */
.header-top__search { position: relative; background: transparent !important; padding: 0 !important; }
.header-top__search form { background: var(--ge-card) !important; border-radius: 35px; }
.header-top__search button { background: var(--ge-red) !important; }
#search_autocomplete { position: absolute; top: 100%; left: 0; right: 0; background: #232d3f; border-radius: 0 0 10px 10px; overflow: hidden; z-index: 999; display: none; box-shadow: 0 12px 30px rgba(0,0,0,.5); max-height: 70vh; overflow-y: auto; }
#search_autocomplete.open { display: block; }
.ac-item { display: flex; align-items: center; gap: 12px; padding: 8px 12px; color: #fff; }
.ac-item:hover { background: #005b41; }
.ac-item img { width: 38px; height: 54px; object-fit: cover; border-radius: 4px; }
.ac-title { font-size: 14px; }

/* ============ CARD OVERRIDES (fix poster fit / badges / overflow) ============ */
.sidebar { z-index: 1000 !important; }
/* sidebar Lucide icons — stroke-based, არა fill */
.sidebar .nav-link svg { fill: none !important; stroke: currentColor !important; width: 24px !important; height: 24px !important; }
.sidebar .nav-link svg path, .sidebar .nav-link svg rect, .sidebar .nav-link svg circle { fill: none !important; stroke: currentColor !important; }
/* sidebar ღილაკები — ოთხკუთხედის ნაცვლად მრგვალი hover/active ფონი */
.sidebar ul li a, .sidebar ul li a:hover, .sidebar ul li a.active { border-radius: 16px !important; }

/* დესკტოპზე (≥1025px) — ნავიგაცია ჩაშენებულია header-ში, ლოგოსა და ძებნას შორის
   (ლოგო + ღილაკები + ძებნა ერთ ზოლში). ≤1024px-ზე არსებული ქვედა tab-bar
   (@media max-width:1024px, ზემოთ) უცვლელად რჩება — .sidebar იქ position:fixed-ით
   მთელი DOM-ნესთინგისგან დამოუკიდებლად მუშაობს. */
@media (min-width: 1025px) {
  .content { width: 100% !important; margin-left: 0 !important; float: none !important; }
  .header { background: #232d3f !important; position: sticky !important; top: 0; z-index: 900; width: 100%; }
  .header-top { justify-content: space-between !important; gap: 18px; }
  .header-top__logo { flex: 0 0 auto; }
  .header-top__search { flex: 0 0 auto; width: 340px !important; }
  .header-top__search button {
    background: #008170 !important; color: #fff !important;
  }
  /* დესკტოპზე toggle/close ღილაკები საჭირო არაა — ძებნა ისედაც მუდმივად ჩანს */
  .header-search-toggle, .header-search-close { display: none !important; }
  .sidebar {
    position: static !important; left: auto !important; top: auto !important;
    width: auto !important; height: auto !important; float: none !important;
    display: flex !important; align-items: center; flex: 1 1 auto; min-width: 0;
    background: transparent !important; border: 0 !important;
  }
  .sidebar .navbar-nav {
    display: flex; flex-direction: row; align-items: stretch; justify-content: center;
    flex-wrap: nowrap; width: 100%; margin: 0; padding: 0; gap: 6px; list-style: none;
  }
  .sidebar .nav-item { flex: 1 1 0; min-width: 0; margin: 0 !important; float: none !important; }
  .sidebar .nav-link {
    display: flex !important; flex-direction: row; align-items: center; justify-content: center; gap: 6px;
    height: 56px; width: 100%; padding: 0 8px !important; margin: 0 !important; border-radius: 0 !important;
    background: #171e2a; border: none; cursor: pointer; text-decoration: none;
    color: #ffffff; transition: .18s ease;
  }
  .sidebar .nav-link svg { width: 18px !important; height: 18px !important; flex: 0 0 auto; transition: .18s ease; }
  .sidebar .nav-link .pt-xl-2 {
    padding: 0 !important; margin: 0 !important; font-size: 12.5px; font-weight: 500;
    line-height: 1.4 !important; height: auto !important;
    white-space: nowrap; overflow: hidden !important; text-overflow: ellipsis; max-width: 100%;
  }
  .sidebar .nav-link:hover {
    background: #05070a; color: #fff; border-radius: 0 !important;
  }
  .sidebar .nav-link.active { background: #05070a !important; color: #fff !important; border-radius: 0 !important; }
  .sidebar .nav-link:hover svg, .sidebar .nav-link:hover svg path,
  .sidebar .nav-link:hover svg rect, .sidebar .nav-link:hover svg circle,
  .sidebar .nav-link.active svg, .sidebar .nav-link.active svg path,
  .sidebar .nav-link.active svg rect, .sidebar .nav-link.active svg circle {
    stroke: #ffffff !important;
  }
}
/* ვიწრო დესკტოპი (1025–1360px): 8 nav-item + 340px ძებნა ერთ ხაზზე ფიზიკურად ვერ ეტევა —
   ეპოვნეს ~66px-იან ყუთებში ტექსტი მეზობელ item-ებზე გადადიოდა და ერწყმოდა. აქ ვამცირებთ
   ძებნის სიგანეს (მეტი სივრცე nav-ისთვის) და ვმალავთ ტექსტურ ლეიბლებს — მხოლოდ აიქონები +
   title-tooltip რჩება, სანამ ეკრანი ისევ არ გაფართოვდება ლეიბლების დასატევად. */
@media (min-width: 1025px) and (max-width: 1360px) {
  .header-top__search { width: 210px !important; }
  .sidebar .navbar-nav { gap: 2px; }
  .sidebar .nav-link { gap: 0; padding: 0 4px !important; }
  .sidebar .nav-link svg { width: 20px !important; height: 20px !important; }
  .sidebar .nav-link .pt-xl-2 { display: none; }
}
.header { position: relative; z-index: 500; }

.movie-card { position: relative; margin: 0 !important; padding: 0 !important; overflow: visible !important; }
.movie-card__img {
  width: 100%; height: auto !important; aspect-ratio: 16 / 9;
  border-radius: 10px; overflow: hidden; position: relative; background: #232d3f;
}
.movie-card__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.movie-card__img img.ge-broken { display: none; }
/* გატეხილი/ცარიელი პოსტერის placeholder — ჩამჯდარი, არა ცარიელი */
img.ge-ph { object-fit: contain !important; background: #232d3f; padding: 14%; opacity: .5; }
.ge-hero__thumb img.ge-ph { padding: 20%; }
.movies-full__poster img.ge-ph { padding: 24%; }

/* year badge — bottom-right (ge.movie-style) */
.movie-card__img .actions {
  position: absolute; bottom: 8px; right: 8px; top: auto; left: auto;
  width: auto !important; z-index: 4; opacity: 1 !important; visibility: visible !important;
}
.movie-card__img .actions .year {
  padding: 3px 8px; border: 0; border-radius: 6px; background: rgba(0,0,0,.72);
  color: #fff; font-size: 12px; opacity: 1;
}
/* imdb rating — bottom-left over gradient */
.movie-card__img .rates {
  position: absolute; left: 0; right: 0; bottom: 0; width: 100%;
  padding: 30px 10px 10px; display: flex; align-items: flex-end; justify-content: flex-start;
  background: linear-gradient(transparent, rgba(0,0,0,.85));
}
.movie-card__img .rates .imdb span {
  background: #f5c518; color: #000; font-weight: 700; padding: 3px 7px;
  border-radius: 4px; font-size: 12px;
}
/* play overlay on hover */
.movie-card__img .play {
  position: absolute; inset: 0; width: 100% !important; height: 100% !important;
  display: flex; align-items: center; justify-content: center;
  background: rgba(0,0,0,.45); opacity: 0; visibility: hidden; transition: .2s; z-index: 3;
}
.movie-card:hover .movie-card__img .play { opacity: 1; visibility: visible; }
.movie-card__img .play a { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; }
.movie-card__img .play svg { width: 56px; height: 56px; fill: #fff; }

.movie-card__title { display: block; margin-top: 10px; }
.movie-card__title h2 { width: 100%; margin: 0; }
.movie-card__title h2 a span {
  display: block; float: none; width: 100%; color: #fff; font-size: 14px; font-weight: 600;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 0;
}
.movie-card__title h2 a p {
  display: block; float: none; width: 100%; color: #8a8f9a; font-size: 12px; margin: 2px 0 0;
  min-height: 15px; line-height: 15px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
/* results grid — 5 columns on desktop (ge.movie-style landscape cards) */
#filterResults { display: grid; grid-template-columns: repeat(2, 1fr); gap: 28px 22px; margin-top: 18px; }
@media (min-width: 576px) { #filterResults { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 768px) { #filterResults { grid-template-columns: repeat(4, 1fr); } }
@media (min-width: 1200px) { #filterResults { grid-template-columns: repeat(5, 1fr); } }
.ge-cell { min-width: 0; }
.movies-slider .swiper { overflow: hidden; padding: 4px 0; }
.movies-slider .swiper-slide { height: auto; }
/* პრემიერა — პორტრეტ-პოსტერების კარუსელი (ge.movie-ვით) */
.movies--portrait { position: relative; overflow: hidden; padding: 22px 0 28px; }
/* ბექგრაუნდიანი რიგი — შემცირებული ქარდები, უფრო ცენტრირებული/ვიწრო კონტენტი
   და მეტი სივრცე ბექგრაუნდისთვის გვერდებზე/ზემოთ/ქვემოთ */
@media (min-width: 1200px) { .movies--portrait { min-height: 420px; } }
.movies--portrait .movie-card__img { aspect-ratio: 2 / 3; }
/* პორტრეტულ (ვიწრო) ქარდზე bottom-left IMDb და bottom-right წელი ერთმანეთს
   ეხურებოდა (ვიწრო სიგანეზე ორივე ბოლო-ზოლში ვეღარ ეტეოდა) — წელს ზედა-მარჯვენა
   კუთხეში გადავიტანთ, IMDb კი ისევ ბოლო-მარცხნივ რჩება */
.movies--portrait .movie-card__img .actions { bottom: auto; top: 8px; }
.movies--portrait .movie-card__title h2 a p { display: none; }
/* ჰოვერზე ცვალებადი ფონი (backdrop) */
.ge-prem-bg {
  position: absolute; inset: 0; z-index: 0;
  background-size: cover; background-position: center;
  transition: background-image .45s ease-in-out; opacity: 1;
}
.ge-prem-shade { position: absolute; inset: 0; z-index: 0;
  background: linear-gradient(180deg, rgba(10,11,16,.45) 0%, rgba(10,11,16,.3) 45%, rgba(10,11,16,.75) 100%); }
/* ანიმეს რიგები — ნამდვილი, თავისუფალი ლიცენზიის ფოტო (Pexels/Unsplash License,
   კომერციული გამოყენებაც უფასოა, ატრიბუციის გარეშე) — არა კონკრეტული ანიმეს/ფილმის
   საავტორო ნახატი/პოსტერი, რომელიც დიდ ბექგრაუნდში დაბალხარისხიანიც გამოჩნდებოდა */
.movies--abstract-bg .ge-prem-bg {
  background-image: url('/static/img/anime-bg/tokyo-street.jpg');
  background-size: cover; background-position: center;
}
/* ანიმე სერიალების რიგი — სხვა ფოტო, რომ ვიზუალურად გამოირჩეოდეს */
.movies--abstract-bg-2 .ge-prem-bg {
  background-image: url('/static/img/anime-bg/sakura-night.jpg');
  background-size: cover; background-position: center;
}
.movies--portrait .container { position: relative; z-index: 1; }
@media (min-width: 1200px) { .movies--portrait .movies-slider { max-width: 1315px; margin: 0 auto; } }
.movies--portrait .movie-card { transition: transform .2s; }
.movies--portrait .swiper-slide:hover .movie-card { transform: translateY(-6px); }

/* persons — grid of circular photos */
#personsResults { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px 16px; margin-top: 18px; }
@media (min-width: 576px) { #personsResults { grid-template-columns: repeat(4, 1fr); } }
@media (min-width: 768px) { #personsResults { grid-template-columns: repeat(6, 1fr); } }
@media (min-width: 1200px) { #personsResults { grid-template-columns: repeat(7, 1fr); } }
.ge-person { text-align: center; min-width: 0; }
.ge-person__photo { width: 130px; height: 130px; border-radius: 50%; overflow: hidden; background: #232d3f; margin: 0 auto 12px; position: relative; }
.ge-person__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ge-person__ph { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: #232d3f; }
.ge-person__ph::after { content: ""; width: 54px; height: 54px; border-radius: 50%; background: #005b41; }
.ge-person__name { font-size: 14px; font-weight: 600; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ge-person__en { font-size: 12px; color: #8a8f9a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* category row icon */
.ge-row-head { gap: 8px; }
/* premium category icon — თეთრი აიქონი ღილაკის ფერის (აქცენტი) ფონზე, სათაურთან შერწყმულად პატარა */
.ge-row-head .ge-head-left { display: flex; align-items: center; gap: 8px; }
.ge-ico-badge {
  display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; border-radius: 50%; flex: 0 0 28px;
  background: var(--ge-red);
}
.ge-row-head .ge-ico { width: 15px; height: 15px; color: #fff; fill: none; stroke: currentColor; }

/* ============================================================
   MOBILE / RESPONSIVE LAYER  (≤1024px)
   თემა html/body-ს min-width:1028px-ს აძლევს, რაც მთელ მობილურ
   responsive-ს ტეხავს. აქ ვასწორებთ და ვამატებთ ქვედა ნავიგაციას.
   ============================================================ */
@media (max-width: 1024px) {
  /* --- master fix: მოვხსნათ თემის ფიქსირებული სიგანე --- */
  html, body { min-width: 0 !important; width: auto !important; max-width: 100% !important; }
  html { overflow-x: hidden !important; }
  /* თემის styles.css აყენებს .content{overflow:hidden}-ს ამ სიგანეზე — ეს header-ის
     sticky-ს ატყდენდა (იხ. შენიშვნა ზემოთ body-სთვის); ვაბრუნებთ visible-ზე */
  /* padding-bottom-ს ემატება env(safe-area-inset-bottom) — ქვედა ტაბ-ბარს (60px + home-indicator-ის
     უსაფრთხო ზონა ზოგ ტელეფონზე) რომ არაფერი დაუფაროს გვერდის ბოლოში (მაგ. pager-ის ღილაკები) */
  .content { width: 100% !important; float: none !important; margin: 0 !important; padding-bottom: calc(76px + env(safe-area-inset-bottom, 0px)) !important; overflow: visible !important; }
  .container { width: 100% !important; padding-left: 15px; padding-right: 15px; }

  /* --- header + hero: თემა მათ ≤1024px-ზე მალავს (.mob-header-ს ელოდება,
         რომელიც ჩვენს markup-ში არ არის) — ვაბრუნებთ --- */
  /* თემა აყენებს .header{height:100px}-ს (style.min.css) — ჩვენი ლოგო+ძებნის
     column-განლაგება ამაზე მაღალია, ამიტომ ძებნა ყუთს გარეთ „გადმოდიოდა" ქვემოთ;
     height:auto საჭიროა თვითონ .header-ზეც, არა მხოლოდ .header-top-ზე */
  .header { display: block !important; height: auto !important; position: sticky; top: 0; z-index: 900; background: #0f0f0f; border-bottom: 1px solid #232d3f; }
  .hero { display: block !important; }
  /* browse/trailers გვერდის ფილტრი — თემა `.filter`-ს მობილურზე მალავს
     (.filter-btn toggle-ს ელოდება); ვაბრუნებთ */
  .filter.movie-list { display: block !important; }
  .header .row, .header .col-md-12 { width: 100% !important; }
  /* ტოპ პანელი — ლოგო ცენტრში, ძებნა მხოლოდ ხატულაა ჩვეულებრივ მდგომარეობაში
     (ადგილს არ იკავებს), დაჭერისას სრულ სიგანეზე იშლება (position:absolute
     overlay .header-top-ს თავზე), ტექსტის შეყვანა-საძებნად, X-ით დახურვა */
  .header-top { display: flex !important; flex-direction: row; align-items: center; position: relative; height: auto !important; padding: 13px 0; }
  .header-top__logo { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); text-align: left; flex: none; }
  .header-top__logo img { height: 28px !important; margin: 0; }
  .header-top__actions { display: none !important; }

  /* ხატულა-ღილაკი — ჩვეულებრივ მდგომარეობაში მხოლოდ ეს ჩანს, სულ მარჯვნივ */
  .header-search-toggle {
    display: flex !important; align-items: center; justify-content: center;
    width: 34px; height: 34px; margin-left: auto; flex: 0 0 auto;
    border-radius: 50%; background: var(--ge-card); border: 1px solid #005b41;
    color: #fff; padding: 0; position: relative; z-index: 2; cursor: pointer;
  }
  .header-search-toggle i { font-size: 15px; line-height: 1; }
  .header-search-toggle:hover { border-color: var(--ge-red); }

  /* ძებნის სრული ველი — ჩვეულებრივ დამალულია (opacity/pointer-events), დაჭერისას
     .is-active ფარავს მთელ .header-top-ს (position:absolute inset:0) */
  .header-top__search {
    display: flex !important; align-items: center; gap: 8px;
    position: absolute !important; inset: 0; width: auto !important; height: auto !important; z-index: 5;
    background: #0f0f0f; opacity: 0; pointer-events: none;
    transform: scale(.97); transition: opacity .18s ease, transform .18s ease;
  }
  .header-top__search.is-active { opacity: 1; pointer-events: auto; transform: scale(1); }
  .header-search-close {
    display: flex !important; align-items: center; justify-content: center; flex: 0 0 34px !important;
    width: 34px !important; height: 34px !important; border: 0; background: none !important; color: #fff;
    font-size: 22px; line-height: 1; padding: 0 !important; margin: 0 !important; float: none !important; cursor: pointer;
  }
  .header-top__search form { display: flex !important; align-items: stretch; flex: 1 1 auto; min-width: 0; height: 36px; background: #232d3f; border: 1px solid #005b41; border-radius: 18px; overflow: hidden; }
  .header-top__search input { display: block !important; flex: 1 1 auto; width: auto !important; min-width: 0; height: auto !important; line-height: 1.1 !important; background: transparent !important; border: 0 !important; color: #fff !important; padding: 0 0 0 14px !important; font-size: 13px; }
  /* ღილაკის ტექსტს ("ძებნა") ვშლით ვიზუალურად (font-size:0) — მხოლოდ ხატულა რჩება;
     pill content-box = 36-2(border)=34px; ღილაკი 30px+2px მარჯინი = 34px ზუსტად */
  .header-top__search form button { flex: 0 0 30px; width: 30px !important; height: 30px !important; margin: 2px !important; border-radius: 50% !important; display: flex !important; align-items: center; justify-content: center; border: 0; background: var(--ge-red) !important; color: #fff !important; padding: 0 !important; font-size: 0; line-height: 0; }
  .header-top__search form button i { font-size: 13px; line-height: 1; display: flex; align-items: center; justify-content: center; margin: 0 !important; }
  #search_autocomplete { position: absolute; top: 100%; left: 42px; right: 0; border-radius: 0 0 10px 10px; }

  /* --- ქვედა ნავიგაცია (bottom tab bar) ---
     რეალურ მობილურებზე (განსხვავებით დესკტოპის headless ტესტისგან) fixed
     ელემენტები ხანდახან "იტეხება"/თრთის აქტიური სქროლვისას, თუ ბრაუზერს არ
     უბიძგებ ცალკე GPU-ფენაზე გადაიტანოს — translateZ/will-change აიძულებს
     ცალკე კომპოზიტ-ფენას, რაც სტანდარტული გამოსავალია ამ პრობლემისთვის */
  .sidebar {
    position: fixed !important; bottom: 0; left: 0; right: 0; top: auto !important;
    width: 100% !important; height: 60px !important; float: none !important;
    display: block !important; z-index: 1000; margin: 0 !important; padding: 0 !important;
    background: #0f0f0f !important; border-top: 1px solid #005b41; border-radius: 0;
    box-shadow: 0 -4px 20px rgba(0,0,0,.45);
    padding-bottom: env(safe-area-inset-bottom, 0px);
    transform: translateZ(0); -webkit-transform: translateZ(0); will-change: transform;
    backface-visibility: hidden;
  }
  .sidebar .navbar-nav {
    display: flex !important; flex-direction: row !important; align-items: stretch;
    width: 100% !important; height: 60px; margin: 0 !important; padding: 0 !important;
    overflow: visible !important; white-space: normal !important; list-style: none;
  }
  .sidebar .nav-item { flex: 1 1 0; min-width: 0; margin: 0 !important; float: none !important; }
  /* მობაილის ქვედა ბარში მხოლოდ 5 ძირითადი კატეგორია — მთავარი (ლოგო ისედაც
     მიდის იქ), თრეილერები და სტუდიები აქ არ ჩანს, დესკტოპზე კი ყველა ჩანს */
  .sidebar .nav-item--desktop-only { display: none !important; }
  .sidebar .nav-link {
    display: flex !important; flex-direction: column; align-items: center; justify-content: center;
    gap: 3px; height: 60px; padding: 6px 1px !important; margin: 0 !important;
    color: #8a8f9a !important; text-align: center; border: 0 !important; background: none !important;
    overflow: hidden;
  }
  .sidebar .nav-link::before, .sidebar .nav-link::after { display: none !important; }
  /* მხოლოდ 5 item რჩება ხილული (nav-item--desktop-only დამალულია) — მეტი
     ადგილია თითოეულზე, ასო/ხატულა შეგვიძლია დავაბრუნოთ უფრო წაკითხვად ზომაზე */
  .sidebar .nav-link svg { width: 21px !important; height: 21px !important; margin: 0 !important; flex: 0 0 auto; }
  .sidebar .nav-link div, .sidebar .nav-link .pt-xl-2 {
    font-size: 9.5px; line-height: 1; margin: 0 !important; padding: 0 !important;
    letter-spacing: -.2px; width: 100%; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  .sidebar .nav-link.active { color: var(--ge-red) !important; }
  .sidebar .nav-link.active svg, .sidebar .nav-link.active svg path,
  .sidebar .nav-link.active svg rect, .sidebar .nav-link.active svg circle {
    stroke: var(--ge-red) !important;
  }

  /* --- browse ფილტრი — მობილურზე ბევრად დიდი/მოუხერხებელი გამოიყურებოდა
     (26px გვერდითი padding .filter-ზე + კიდევ 15px .container-ზე ერთად ჭამდა
     სივრცეს, ხოლო select-ების font/padding დესკტოპისთვის ბუნებრივი ზომისა იყო) --- */
  .filter.movie-list { padding-left: 0; padding-right: 0; }
  .ge-filterbar { gap: 8px; padding: 14px 0 4px; }
  .ge-filter__group { gap: 4px; }
  .ge-filter__group label { font-size: 10px; letter-spacing: .2px; }
  .ge-filterbar select { font-size: 12.5px; padding: 9px 10px; border-radius: 8px; }

  /* --- row heads / section titles — უფრო კომპაქტური --- */
  .ge-row-head { margin: 22px 0 12px; gap: 6px; }
  .ge-row-head .ge-head-left { gap: 6px; }
  .ge-section-title { font-size: 14px; }
  .ge-ico-badge { width: 22px; height: 22px; flex: 0 0 22px; }
  .ge-row-head .ge-ico { width: 12px; height: 12px; }

  /* მსახიობის ფოტო — ფიქსირებული 130px ტაბლეტის (768px) 6-სვეტიან ბადეზე
     საკუთარ უჯრას სცდება და მთელ grid-ს გარეთ სწევს; ვხდით ფლუიდურს */
  .ge-person__photo { width: 100%; max-width: 130px; height: auto; aspect-ratio: 1 / 1; }
}

/* --- ტელეფონი (≤560px): ჰერო + ფილტრი დახვეწა --- */
@media (max-width: 560px) {
  .ge-hero { gap: 10px; margin-top: 12px; }
  .ge-hero__featured { height: 210px; }
  .ge-hero__info { left: 18px; bottom: 20px; max-width: 92%; }
  .ge-hero__title { font-size: 20px; margin: 12px 0 8px; }
  .ge-hero__play { padding: 9px 20px; font-size: 13px; }
  .ge-hero__meta { gap: 10px; }
  .ge-hero__thumbs { grid-template-rows: repeat(2, 72px); gap: 8px; }

  /* browse ფილტრები — 2 სვეტად */
  .ge-filterbar { gap: 10px; padding: 16px 0 6px; }
  .ge-filter__group { flex: 1 1 44%; }
  .ge-filterbar select { min-width: 0; width: 100%; }

  /* მსახიობის ფოტო — ფიქსირებული 130px ბადის უჯრას სცდება; ვხდით ფლუიდურს */
  .ge-person__photo { width: 100%; max-width: 120px; height: auto; aspect-ratio: 1 / 1; }
}

/* ============================================================
   watchlist / search / genre-list / 404 — ეს გვერდები აშენებულია
   ge.movie-თემის კლასებზე (.movie-card, .ge-rec-grid, .ge-section-title
   და ა.შ.), რომ ამ პროექტში უკვე მუშა, სრულად responsive სისტემას
   ეყრდნობოდნენ.
   ============================================================ */
.ge-btn { display: inline-block; background: var(--ge-red); color: #fff; padding: 12px 28px;
  border-radius: 8px; font-weight: 600; font-size: 15px; }
.ge-btn:hover { background: #008170; }

.ge-pager { display: flex; align-items: center; justify-content: center; gap: 16px; margin: 32px 0; flex-wrap: wrap; }
.ge-pager__btn { background: var(--ge-card); border: 1px solid #005b41; color: #fff; padding: 9px 18px;
  border-radius: 8px; font-size: 14px; }
.ge-pager__btn:hover { border-color: var(--ge-red); color: var(--ge-red); }
.ge-pager__info { color: #9aa0ac; font-size: 14px; }

/* ნომრებიანი pagination (browse/persons) — გვერდის ნომრები + „…" + jump-to-page */
.ge-pager__nums { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; justify-content: center; }
.ge-pager__num, .ge-pager__arrow {
  min-width: 38px; height: 38px; padding: 0 8px; display: inline-flex; align-items: center; justify-content: center;
  background: var(--ge-card); border: 1px solid #005b41; color: #fff; border-radius: 8px; font-size: 14px; cursor: pointer;
}
.ge-pager__num:hover, .ge-pager__arrow:hover { border-color: var(--ge-red); color: var(--ge-red); }
.ge-pager__num.is-active { background: var(--ge-red); border-color: var(--ge-red); color: #fff; cursor: default; font-weight: 700; }
.ge-pager__arrow { font-size: 18px; font-weight: 700; }
.ge-pager__dots { color: #6b7078; padding: 0 2px; }
.ge-pager__jump { display: flex; align-items: center; gap: 8px; color: #9aa0ac; font-size: 13px; }
.ge-pager__jump input {
  width: 60px; height: 38px; text-align: center; background: var(--ge-card); border: 1px solid #005b41;
  border-radius: 8px; color: #fff; font-size: 14px;
}
.ge-pager__jump input:focus { outline: none; border-color: var(--ge-red); }
@media (max-width: 560px) {
  .ge-pager { gap: 10px; margin: 24px 0; }
  .ge-pager__num, .ge-pager__arrow { min-width: 32px; height: 32px; font-size: 12.5px; }
  .ge-pager__jump { width: 100%; justify-content: center; font-size: 12px; }
}

/* watchlist — ამოშლის ღილაკი ბარათის პოსტერზე */
.wl-remove { position: absolute; top: 8px; right: 8px; z-index: 5; width: 32px; height: 32px;
  border-radius: 50%; border: 0; background: rgba(0,0,0,.65); color: #fff; font-size: 15px;
  display: flex; align-items: center; justify-content: center; cursor: pointer; transition: .15s; }
.wl-remove:hover { background: var(--ge-red); }

/* „ბოლოს დამატებული ეპიზოდები" — croconet.cam-ის სტილის ბადე (grid, არა კარუსელი) */
.ge-ep-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 22px 20px;
  margin: 6px 0 36px;
}
.ge-ep-card {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  text-decoration: none;
  min-width: 0;
}
.ge-ep-thumb {
  position: relative;
  flex: 0 0 128px;
  width: 128px;
  aspect-ratio: 16 / 9;
  border-radius: 8px;
  overflow: hidden;
  background: var(--ge-card);
}
.ge-ep-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .2s; }
.ge-ep-card:hover .ge-ep-thumb img { transform: scale(1.06); }
.ge-ep-lang {
  position: absolute; top: 6px; left: 6px;
  background: #1cb15c; color: #fff;
  font-size: 10px; font-weight: 700; letter-spacing: .3px;
  padding: 2px 7px; border-radius: 4px; line-height: 1.5;
}
.ge-ep-info { min-width: 0; padding-top: 2px; }
.ge-ep-title {
  font-family: "BPG Mrgvlovani Caps", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans Georgian", sans-serif;
  color: #fff; font-weight: 700; font-size: 14px; line-height: 1.35;
  text-transform: uppercase;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.ge-ep-card:hover .ge-ep-title { color: var(--ge-red); }
.ge-ep-title-en {
  color: #8b909c; font-size: 12px; margin-top: 3px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ge-ep-meta { color: var(--ge-red); font-size: 12px; font-weight: 700; margin-top: 8px; }

@media (max-width: 680px) {
  .ge-ep-grid {
    display: grid; grid-template-columns: none; grid-template-rows: repeat(2, auto);
    grid-auto-flow: column; grid-auto-columns: 260px;
    gap: 14px 12px; margin: 6px 0 28px;
    overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch;
    scroll-snap-type: x proximity; padding-bottom: 4px;
  }
  .ge-ep-card { flex-direction: row; scroll-snap-align: start; }
  .ge-ep-thumb { flex-basis: 108px; width: 108px; }
}

/* „ტოპ 9" — 1 დიდი ქარდი მარცხნივ + 8 ჩვეულებრივი ბადეში მარჯვნივ */
.ge-top9 { display: flex; align-items: stretch; gap: 16px; margin-top: 4px; }
.ge-top9__feature {
  position: relative; flex: 0 0 30%; max-width: 30%; min-width: 0;
  border-radius: 12px; overflow: hidden; display: block; background: var(--ge-card);
}
.ge-top9__feature img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.ge-top9__rank {
  position: absolute; top: 8px; left: 16px; z-index: 2;
  font-family: "BPG Mrgvlovani Caps", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans Georgian", sans-serif;
  font-weight: 800; font-size: 40px; color: #fff;
  text-shadow: 0 2px 14px rgba(0,0,0,.9), 0 0 3px rgba(0,0,0,.7); line-height: 1;
}
.ge-top9__feature .rates { position: absolute; top: 12px; right: 12px; z-index: 2; left: auto; bottom: auto; width: auto; padding: 0; background: none; }
.ge-top9__feature .rates .imdb span { background: #f5c518; color: #000; font-weight: 700; padding: 3px 7px; border-radius: 4px; font-size: 12px; }
.ge-top9__info {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; padding: 40px 16px 16px;
  background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.88) 70%);
}
.ge-top9__info h3 {
  margin: 0; font-size: 18px; color: #fff; line-height: 1.3;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.ge-top9__en { margin: 4px 0 0; font-size: 13px; color: #c7c9cf; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.ge-top9__grid {
  flex: 1; min-width: 0;
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-template-rows: repeat(2, 1fr);
  gap: 12px 14px;
}
.ge-top9__cell { position: relative; }
.ge-top9__cell-rank {
  position: absolute; top: 6px; left: 6px; z-index: 4;
  background: rgba(0,0,0,.65); color: #fff; font-weight: 700; font-size: 12px;
  min-width: 20px; height: 20px; padding: 0 4px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
}

@media (max-width: 992px) {
  .ge-top9 {
    flex-direction: row; overflow-x: auto; overflow-y: hidden;
    -webkit-overflow-scrolling: touch; scroll-snap-type: x proximity; padding-bottom: 4px;
  }
  .ge-top9__feature { flex: 0 0 220px; width: 220px; scroll-snap-align: start; }
  .ge-top9__grid {
    flex: 0 0 auto; min-width: 0;
    display: grid; grid-template-columns: none; grid-template-rows: repeat(2, 1fr);
    grid-auto-flow: column; grid-auto-columns: 140px;
  }
  .ge-top9__cell { scroll-snap-align: start; }
}
@media (max-width: 480px) {
  .ge-top9__rank { font-size: 30px; }
  .ge-top9__info h3 { font-size: 15px; }
}

/* მენიუს ატვირთული აიქონი (ჩაშენებული SVG-ის ნაცვლად) */
.nav-link__img { width: 24px; height: 24px; object-fit: contain; display: block; margin: 0 auto; }
/* მხოლოდ მობილურზე ხილული პუნქტი (დესკტოპზე დამალული) */
@media (min-width: 1025px) { .nav-item--mobile-only { display: none !important; } }

/* რიგის ფონი ბექოფისიდან (ნებისმიერ რიგზე, არა მხოლოდ ვერტიკალურზე) */
.movies--has-bg { position: relative; overflow: hidden; }
.movies--has-bg .container { position: relative; z-index: 1; }
/* რიგის ატვირთული აიქონი (ჩაშენებული SVG-ის ნაცვლად) */
.ge-ico-badge .ge-ico-img { width: 22px; height: 22px; object-fit: contain; display: block; }