/* =========================================================================
   OVERRIDES UX/UI — ngarkohet PAS gjithë CSS-ve origjinale të WordPress.
   Baza: research/UX-AUDIT.md. Identiteti i brandit ruhet; ndryshon vetëm
   ekzekutimi (ngjyra të matura WCAG 2.2 AA, madhësi, atribute).
   ========================================================================= */

/* ------------------------------------------------------------------ K2 —
   Tekste më parë TË PADUKSHME (të bardha mbi të bardhë, raport 1:1). */

/* Kontakt: titulli kryesor i faqes (ish #FFFFFF mbi të bardhë) */
.elementor-361 .elementor-element.elementor-element-dcc9765 .elementor-heading-title {
  color: #3193c2; /* 3.45:1 mbi të bardhë — tekst i madh, kalon ≥3:1 */
}
/* Kontakt: nëntitulli "Akademia e Farmacisë" (ish i padukshëm) */
.elementor-361 .elementor-element.elementor-element-f4aa020 .elementor-heading-title {
  color: #030712; /* 19:1 */
}
/* Njoftime: tagline "Duke sjellë inovacion dhe ekspertizë" (ish i padukshëm) */
.elementor-335 .elementor-element.elementor-element-4ce2dff .elementor-heading-title {
  color: #75808f; /* 4.01:1 — tekst i madh, kalon ≥3:1 */
}
/* Rreth nesh: "Akademia e Farmacisë "Eureka"" (ish i padukshëm) */
.elementor-65 .elementor-element.elementor-element-23c5e37 .elementor-heading-title {
  color: #75808f; /* 4.01:1 */
}
/* Kreu: titujt e videove mbi thumbnails të çelëta — shtohet skrim i errët */
.sa-glory-slider .sa-glory-player .sa-player-content-wrapper {
  background: rgba(0, 0, 0, 0.55);
  border-radius: 8px;
}

/* ------------------------------------------------------------------ K1 —
   Harta e kontrasteve (vjetër → re → raporti i ri i MATUR mbi sfondin real):
   #6EC1E4 → #3193C2  3.45:1 (tituj 96px, ish 2.02)
   #8CC63E → #527F22  4.75:1 (tekst: nav aktiv, tag-e, tituj seksionesh; ish 2.05)
   #8CC63E → #669F2A  3.20:1 (vetëm UI: border i butonit outline; ish 2.05)
   #B6BCC6 → #75808F  4.01:1 (pjesa e pambushur e reveal-text; ish 1.91)
   #90E46E → #527F22  4.75:1 (tituj Historiku/L.Malaj/FAQ; ish 1.55)
   #D5D1D1 → #5A626C  6.18:1 (teksti i Rreth nesh; ish 1.51)
   #969B98 → #5A626C  6.18:1 (trupi i accordion-it; ish 2.82)
   #7A7A7A → #6E6E6E  5.04:1 mbi të bardhë / 4.86:1 mbi #f9fafa (teksti global; ish 4.29)
   tekst btn hero #8CC63E → #FFFFFF mbi #0F6638  7.05:1 (ish 3.44)
   kutitë e formës #7d7d7d → #595959 (label të bardhë 7:1; inpute ~5.1:1)
   Jeshilja #8CC63E MBETET për footer-in mbi të errët (9.65:1) dhe theksa jo-tekst. */

/* Variablat globale të Elementor: titujt blu + teksti gri.
   #6E6E6E: 5.04:1 mbi të bardhë, 4.86:1 mbi seksionet e buta #f9fafa. */
.elementor-kit-5 {
  --e-global-color-primary: #3193c2;
  --e-global-color-text: #6e6e6e;
}

/* Reveal-text: ngjyra e fjalëve të pambushura */
.reveal-text { --primary-t-color-2: #75808f; }

/* Jeshilja e navigimit aktiv + hover. !important sepse tema e vendos me
   specificitet më të lartë të brendshëm. */
body .navbar .navbar-nav .nav-link.active,
body .navbar .navbar-nav .nav-link:hover,
body .navbar .navbar-nav .nav-link:focus,
body .navbar .navbar-nav li.current-menu-item > .nav-link,
body .navbar .navbar-nav li.current-menu-item > a { color: #4c7620 !important; } /* 5.0:1 mbi #f7f7f7 */

/* Linket brenda tekstit (p.sh. email-i në artikuj) */
.elementor-widget-text-editor a,
.accordion-body a { color: #4c7620; }

/* Nëntitujt e vegjël blu në trupin e artikujve (19.2px — u duhej 4.5:1) */
.elementor-widget-heading h5.elementor-heading-title,
.elementor-widget-heading h6.elementor-heading-title { color: #4c7620; }

/* Paragrafët e stiluar si heading-widget me gri të vjetër #7b7e7f (4.09:1) */
p.elementor-heading-title { color: #6e6e6e !important; }

/* Tag-et "Njoftime" nën/mbi kartat */
body .post-holder-tags a { color: #4c7620; } /* 5.0:1 edhe mbi #f8f8f9 */
body .post-holder-tags a:hover { color: #3d5f18; }

/* Titulli "Lajme të përzgjedhura" (Kreu) */
.elementor-698 .elementor-element.elementor-element-363d0d7 .elementor-heading-title { color: #527f22; }

/* Butoni hero "Le të flasim!": tekst + shigjetë të bardha mbi #0F6638 */
.elementor-698 .elementor-element.elementor-element-c9eab24 .button { color: #ffffff; }
.elementor-698 .elementor-element.elementor-element-c9eab24 .button svg { fill: #ffffff; }

/* Butoni outline "Shiko të gjitha": border-i UI në jeshile 3:1 */
.elementor-698 .elementor-element.elementor-element-a55b052 .button { border-color: #669f2a; }

/* Titujt jeshilë të Rreth nesh + FAQ */
.elementor-65 .elementor-element.elementor-element-e4258dd .elementor-heading-title,
.elementor-65 .elementor-element.elementor-element-f7aa46b .elementor-heading-title,
.elementor-65 .elementor-element.elementor-element-0f90e73 .elementor-heading-title { color: #527f22; }

/* Tekstet e Rreth nesh (ish #D5D1D1) */
.elementor-65 .elementor-element.elementor-element-52a6166,
.elementor-65 .elementor-element.elementor-element-1e3466d,
.elementor-65 .elementor-element.elementor-element-265bf1f,
.elementor-65 .elementor-element.elementor-element-a534136 { color: #5a626c; }

/* Trupi i accordion-it FAQ */
.elementor-65 .elementor-element.elementor-element-99dac6f .accordion-body { color: #5a626c; }

/* Kutitë gri të Kontaktit: NJË sfond i vetëm i errët (#595959) mbi konteinerin
   e jashtëm .tl-form; forma brenda bëhet transparente — zgjidh mbivendosjen
   dy-tonëshe që krijonte override-i i mëparshëm vetëm mbi <form>. */
.elementor-361 .elementor-element.elementor-element-afe7e65 { background-color: #595959 !important; }
#tl-contact-form.tl-form { background-color: #595959 !important; }
form.wpcf7-form.coloringForm { background-color: transparent !important; }

/* Fushat e formës: dallim i qartë nga kutia + tekst i bardhë i lexueshëm
   (blend ~#777 → 4.7:1) */
.wpcf7-form .wpcf7-form-control:not(.wpcf7-submit) {
  color: #ffffff;
  background-color: rgba(255, 255, 255, 0.18) !important;
  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: 8px;
}
.wpcf7-form .wpcf7-form-control::placeholder { color: rgba(255, 255, 255, 0.85); }

/* Butoni "Dërgo": kufi i dukshëm ndaj kutisë gri (komponent UI ≥3:1) */
.wpcf7-form input.wpcf7-submit { border: 1px solid rgba(255, 255, 255, 0.6); }

/* Harqet dekorative të heros: vizatohen QËLLIMSHËM me CSS (më parë vinin nga
   konturi i imazheve të thyera të Chrome — jo ndër-browser, me 404) */
.hero img.circle-1,
.hero img.circle-2 {
  border: 1px solid #e9eaee;
  border-radius: 50%;
}
/* ...dhe priten nga hero-ja: hero bëhet containing block (rrathët janë
   position:absolute dhe përndryshe maten ndaj body-t) */
.elementor-698 .elementor-element.elementor-element-ff25c81 {
  position: relative;
  overflow: hidden !important;
}

/* ------------------------------------------------------------- RESPONSIVE —
   Defekte të kapura nga matrica 16-gjerësish (research/responsive-audit) */

/* 320-374px: header-i dilte 25px jashtë (brand + hamburger 44px s'nxinin) */
@media (max-width: 374px) {
  .container.header { padding-left: 12px !important; padding-right: 12px !important; }
  body .navbar .navbar-brand.site-title { font-size: 14px !important; }
}

/* Rreth nesh 768-1024px: tema harroi kalimin në kolonë për rreshtin e
   L.Malajt (kolonat 100%+100% krah për krah -> faqja dilte 2x jashtë).
   E TRASHËGUAR nga WordPress-i live — e rregullojmë. */
@media (max-width: 1024px) {
  .elementor-65 .elementor-element.elementor-element-945870f {
    flex-direction: column !important;
  }
}

/* Kreu <=480px: tema i jepte shërbimeve width fikse 500px -> teksti pritej
   ~57px në ekranet 320-376 (e trashëguar nga live). Bëhen fluid. */
@media (max-width: 480px) {
  .elementor-698 .elementor-element.elementor-element-4d7819a,
  .elementor-698 .elementor-element.elementor-element-152fbad,
  .elementor-698 .elementor-element.elementor-element-965420c,
  .elementor-698 .elementor-element.elementor-element-bbad0bd {
    width: 100% !important;
    max-width: 100% !important;
    --width: 100%;
  }
}

/* Siguri globale: asnjë scroll horizontal nga mbetje 1-3px dekorative */
html, body { overflow-x: clip; }

/* ------------------------------------------------------------- GJERËSIA —
   Standardi i ri i përmbajtjes në ekranet e mëdha (matur: containeri i temës
   ishte 1320px, Elementor 1140px). VETËM >=1200px; sfondet e seksioneve
   mbeten full-width — kufizohet vetëm përmbajtja brenda tyre. */
@media (min-width: 1200px) {
  /* konteineri i përgjithshëm: 1200px me padding anësor 24px */
  .container {
    max-width: 1200px !important;
    padding-left: 24px;
    padding-right: 24px;
  }
  /* Elementor: përmbajtja 1152px (1200 - 2x24) — përputhet me containerin */
  .e-con { --content-width: 1152px; }

  /* Artikujt: trupi bëhet kolonë e vetme leximi ~720px e qendërzuar
     (dy gjysmë-kolonat 55ch bashkohen në një masë leximi 60-75ch) */
  .single-portfolio .no-hero .container { max-width: 740px !important; } /* ~75ch */
  .single-portfolio .no-hero .e-con.e-child {
    --width: 100% !important;
    --padding-left: 0px;
    --padding-right: 0px;
    --padding-top: 0px;    /* pa vrimë 80+80px mes ish-kolonave të stivuara */
    --padding-bottom: 0px;
  }
  /* rreshtat flex brenda trupit të artikullit kalojnë në kolonë
     (ndryshe fëmijët 100%+100% ngjishen sërish në gjysma) */
  .single-portfolio .no-hero .e-con { flex-direction: column !important; }
  .single-portfolio .no-hero .e-con-inner { flex-direction: column !important; }

  /* CTA e Kreut: paragrafi kufizohet në 720px (ndryshe dilte 76ch) */
  .elementor-698 .elementor-element.elementor-element-8b8f3b1 {
    max-width: 720px !important;
  }
}

/* "gammaplan" në footer mbetet #8CC63E (9.65:1 mbi #000A1F) — pa ndryshim */

/* ------------------------------------------------------------------ L4 —
   Fokus i dukshëm kudo (WCAG 2.4.7). #4C7620 ka 5:1 mbi sfondet e çelëta;
   mbi kutitë e errëta të formës përdoret e bardha. */
*:focus-visible {
  outline: 2px solid #4c7620 !important;
  outline-offset: 2px;
}
.wpcf7-form *:focus-visible,
footer *:focus-visible,
.modal *:focus-visible {
  outline-color: #ffffff !important;
}

/* ------------------------------------------------------------------ L7 —
   Zona prekjeje >=44x44px (hamburgeri 36->44, shigjetat 29->44, tag-et,
   linket e footer-it) me ndryshim vizual minimal. */
header .navbar-nav.toggle .nav-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
  padding: 0;
}
.sa-swiper-button-prev,
.sa-swiper-button-next {
  min-width: 44px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.post-holder-tags a {
  display: inline-block;
  padding: 10px 6px;
  margin: -10px -6px 0 0;
}
footer p a {
  display: inline-block;
  padding: 12px 4px;
  margin: -12px -4px;
}
/* breadcrumb: PA margin negativ horizontal — shkaktonte +2px overflow-x
   në çdo faqe artikulli (regresion i imi, kapur nga matrica responsive) */
.breadcrumb-item a {
  display: inline-block;
  padding: 10px 4px;
  margin: -10px 0;
}
.modal .modal-header {
  min-height: 44px;
  cursor: pointer;
}

/* ------------------------------------------------------------------ L6 —
   Hierarkia e titujve ndryshoi TAG-et, jo pamjen: mbajmë madhësitë e vjetra. */
/* Hero i Kreut: ish h2 4rem — si h1 mban të njëjtat madhësi.
   LIVE e zvogëlon në 40px nën 1024 (matur në iPhone 393 + tablet 768) —
   rregulli fiks 4rem e linte GJIGANT në celular (defekti i raportuar) */
h1.eureka-hero-title { font-size: 4rem; font-weight: 500; }
@media (max-width: 1024px) {
  h1.eureka-hero-title { font-size: 2.5rem; }
}
/* Titulli i Kontaktit: ish h2 — si h1 mban 4rem */
.elementor-361 h1.eureka-kontakt-title,
h1.eureka-kontakt-title { font-size: 4rem; }
/* Nëntitujt e artikujve: ish h6 19.2px/600 — si h2 mbajnë pamjen e vjetër */
.elementor-widget-heading h2.eureka-h6-style {
  font-size: 1.2rem;
  font-weight: 600;
  color: #4c7620;
  line-height: 1.5;
}
/* Titujt Elementor të konvertuar h3 -> h2 (Rreth nesh, Kreu "Lajme...",
   Njoftime "Duke sjellë...", Kontakt): LIVE i mban 48px desktop / 36px
   nën 768 — pa media query dilnin 40-48px fiks edhe në celular */
h2.elementor-heading-title { font-size: 3rem; }
@media (max-width: 767px) {
  h2.elementor-heading-title { font-size: 2.25rem; }
}
/* Akordioni (Rreth nesh): ish h6 19.2px — si h3 trashëgonte 36px kudo;
   LIVE e mban 19.2px në çdo gjerësi */
h3.accordion-header,
h3.accordion-header .accordion-button,
h3.accordion-header .accordion-title { font-size: 1.2rem; }
/* Kartat e Njoftimeve: ish h5 -> h2; mbaj madhësinë e h5 */
.card-content h2.title { font-size: 1.35rem; }
/* Kartat e Kreut: ish h4 -> h3; mbaj madhësinë e h4 */
.card-overlay h3.title { font-size: 1.6rem; }
/* Shërbimet: ish h4 -> h3 */
.tl-widget.heading h3 { font-size: 2rem; }

/* Bonus: line-height më i shëndetshëm për titujt e mëdhenj (ish 1.0) */
h2.elementor-heading-title,
h3.elementor-heading-title { line-height: 1.15; }

/* (Nëntitulli i Kontaktit f4aa020 mbulohet nga rregulli i përgjithshëm
   h2.elementor-heading-title më lart — 48px desktop / 36px mobile) */

/* Mesazhet e gabimit të formës mbi sfondin #595959: e kuqja e CF7 #dc3232
   binte në 1.52:1 — #FFCFCF i matur 5.03:1 (AA për tekst normal) */
#tl-contact-form .wpcf7-not-valid-tip,
#tl-contact-form .wpcf7-response-output {
  color: #ffcfcf;
}

/* ------------------------------------------------------------------
   LOGO NË HEADER (Varianti A): logo majtas + "Akademia Eureka" ngjitur,
   të dyja një link i vetëm për në kryefaqe. Lartësia e header-it NUK
   duhet të ndryshojë: logoja qendërzohet me margin negativ vertikal
   (outer-height i flex-item-it mbetet sa rreshti i tekstit). */
body .navbar .navbar-brand.site-title {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.navbar-brand .eureka-logo {
  width: 44px;
  height: 44px;
  flex: 0 0 auto;
  margin-top: -10px;
  margin-bottom: -10px;
}
@media (max-width: 767px) {
  .navbar-brand .eureka-logo {
    width: 34px;
    height: 34px;
    margin-top: -7px;
    margin-bottom: -7px;
  }
}

/* ------------------------------------------------------------------
   NDËRRUESI I GJUHËS (SQ/EN/DE/IT/FR). Ngjyrat nga palet e matur:
   #4C7620 mbi të bardhë 5.0:1 (AA), aktivi i mbushur me të bardhë 5.0:1. */
.eureka-lang {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-left: 18px;
}
/* Flamuri (SVG lokal, dekorativ) lart + sigla poshtë, si njësi e qendërzuar.
   Aktivja: pilulë jeshile #4C7620 — sigla e bardhë 5.0:1 (AA). */
.eureka-lang-item {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.4px;
  color: #4c7620;
  padding: 5px 8px;
  border-radius: 10px;
  text-decoration: none;
  transition: background-color 0.2s ease;
}
.eureka-flag {
  display: block;
  width: 22px;
  height: 17px;
  border-radius: 3px;
  box-shadow: 0 0 0 1px rgba(10, 17, 33, 0.1);
}
.eureka-lang-item:hover { background: #eef4e5; color: #4c7620; }
.eureka-lang-item.active { background: #4c7620; color: #fff; }
@media (prefers-reduced-motion: reduce) { .eureka-lang-item { transition: none; } }
/* Lartësia e nav-it NUK rritet nga rreshti flamur+siglë: margin negativ
   vertikal (outer-height i flex-item-it mbetet sa më parë; matur diff 0px) */
.navbar .eureka-lang-item { margin-top: -7px; margin-bottom: -7px; }
/* Në navbar: fshihet nën 768 (aty jeton në menunë mobile) */
@media (max-width: 767px) {
  .navbar .eureka-lang { display: none; }
}
/* Në menunë mobile: rresht i qendërzuar mbi bllokun e kontakteve */
.eureka-lang-mobile {
  justify-content: center;
  margin: 18px 0 0;
}
/* Mobile: hit-area ≥44px (17 flamur + 3 gap + ~18 siglë + 2×8 padding ≈ 54px) */
.eureka-lang-mobile .eureka-lang-item { font-size: 14px; padding: 8px 12px; }
.eureka-lang-mobile .eureka-flag { width: 26px; height: 20px; }

/* ------------------------------------------------------------------
   DOTS NËN KARUSELIN E VIDEOVE (zëvendësojnë thumbs-at e dyfishtë):
   pika gri, aktivja pilulë jeshile #4C7620; hit-area 24px, vizualja 8px. */
.eureka-carousel-nav {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 20px;
}
.eureka-dot {
  width: 24px;
  height: 24px;
  border: 0;
  background: transparent;
  padding: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.eureka-dot::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: #b6bcc6;
  transition: width 0.25s ease, background-color 0.25s ease;
}
.eureka-dot:hover::before { background: #75808f; }
.eureka-dot.active::before { width: 26px; background: #4c7620; }
.eureka-dot:focus-visible { outline: 2px solid #4c7620; outline-offset: 2px; border-radius: 999px; }
@media (prefers-reduced-motion: reduce) { .eureka-dot::before { transition: none; } }

/* ------------------------------------------------------------------
   RUBRIKAT (Lajme / Njoftime): etiketa kategorie me dy nuanca AA.
   Lajm: #4C7620 (5.0:1 mbi të bardhë) — Njoftim: #205E7D (7.4:1). */
.eureka-cat { font-weight: 600; text-decoration: none; }
.eureka-cat-lajm { color: #4c7620; }
.eureka-cat-njoftim { color: #205e7d; }
/* etiketat brenda kartave: overlay-i tani është zonë e bardhë statike
   (varianti C) — e bardha e temës për tekstin e overlay-it mposhtet */
.tl-widget.portfolio .card-overlay .post-holder-tags a.eureka-cat-lajm,
.tl-widget.portfolio .card-content .post-holder-tags a.eureka-cat-lajm { color: #4c7620 !important; }
.tl-widget.portfolio .card-overlay .post-holder-tags a.eureka-cat-njoftim,
.tl-widget.portfolio .card-content .post-holder-tags a.eureka-cat-njoftim { color: #205e7d !important; }
/* Empty-state i listës së njoftimeve: fëmijë direkt i .row (margin negativ
   Bootstrap) — pa margin anësor prekte skajin e viewport-it */
p.eureka-empty {
  padding: 40px 0 60px;
  margin-left: 15px;
  margin-right: 15px;
  font-size: 1.15rem;
  color: #5a626c;
}
/* Menuja me 5 zëra + ndërruesi: pak më kompakte 768-1280 që të nxërë */
@media (min-width: 768px) and (max-width: 1280px) {
  .navbar-nav.items .nav-link { padding-left: 10px; padding-right: 10px; }
  .eureka-lang { margin-left: 10px; }
  .eureka-lang-item { padding: 5px 5px; }
}

/* ------------------------------------------------------------------
   KARTAT E PUBLIKIMEVE — Varianti C "Modern hover-lift" (zgjedhja e
   përdoruesit): kartë e pastër me kënde 14px, imazh 16:9 fiks (zero CLS),
   hover me ngritje -4px + hije më e thellë + zoom 1.03 i imazhit.
   Transitions ≤300ms; respekton prefers-reduced-motion.
   Zbatohet te Kreu ("Publikimet e fundit") + listat /lajme e /njoftime. */
.tl-widget.portfolio .stack-item { margin-bottom: 30px; }
.tl-widget.portfolio .card-item.portfolio-item {
  position: relative;
  height: auto !important;
  min-height: 0 !important;
  background: #fff !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  box-shadow: 0 6px 18px rgba(10, 17, 33, 0.08);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.tl-widget.portfolio .card-item.portfolio-item:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 16px 36px rgba(10, 17, 33, 0.16);
}
.tl-widget.portfolio .image-holder {
  position: relative !important;
  height: auto !important;
  min-height: 0 !important;
  padding-bottom: 0 !important;
}
/* dy strukturat e temës: Kreu (a.card-thumb > img + .card-overlay) dhe
   listimi "metro" (a > .image-holder > div.card-thumb > img + .card-content) */
.tl-widget.portfolio .card-thumb {
  display: block !important;
  overflow: hidden !important;
  height: auto !important;
  /* tema përdor trukun padding-bottom:100% me img absolute — e heqim */
  padding: 0 !important;
}
.tl-widget.portfolio .image-holder img {
  position: static !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 16 / 9;
  object-fit: cover !important;
  object-position: 50% 30% !important;
  display: block;
  transition: transform 0.3s ease;
}
.tl-widget.portfolio .card-item:hover .image-holder img { transform: scale(1.03); }
/* tema jep lartësi vh nga stilet inline (pa precedence, pas overrides në DOM)
   — mposhtet me specificitet më të lartë; KUJDES: jo mbi .image-holder,
   se te Kreu ai përmban edhe overlay-in me titujt */
@media (max-width: 767px) {
  .tl-widget.portfolio .card-item .card-thumb,
  .tl-widget.portfolio .card-item .card-thumb img.card-img-top.wp-post-image {
    height: auto !important;
    min-height: 0 !important; /* tema jep min-height 50vh — fiton mbi max-height */
    max-height: calc(100vw * 0.5625) !important;
  }
  .tl-widget.portfolio .card-item .image-holder {
    height: auto !important;
    max-height: none !important;
  }
}
/* Overlay-i i temës bëhet zonë statike titulli nën imazh */
.tl-widget.portfolio .card-overlay {
  position: static !important;
  inset: auto !important;
  height: auto !important;
  opacity: 1 !important;
  visibility: visible !important;
  background: #fff !important;
  background-image: none !important;
  transform: none !important;
  padding: 18px 22px 20px !important;
}
.tl-widget.portfolio .card-overlay .heading { position: static !important; transform: none !important; padding: 0 !important; }
.tl-widget.portfolio .show-project {
  opacity: 1 !important; visibility: visible !important; transform: none !important;
  height: auto !important; max-height: none !important; overflow: visible !important;
}
.tl-widget.portfolio .card-overlay .title,
.tl-widget.portfolio .card-content .title {
  color: #0a1121 !important;
  font-size: 1.35rem !important;
  line-height: 1.3;
  margin: 0 0 8px !important;
}
/* .card-content i kartave metro: e njëjta zonë titulli si overlay-i */
.tl-widget.portfolio .card-content {
  padding: 18px 22px 20px !important;
  margin-top: 0 !important;
}
.tl-widget.portfolio .card-overlay .eureka-cat,
.tl-widget.portfolio .card-content .eureka-cat { font-size: 0.9rem; }
/* linku "Shiko artikullin" dublon linkun e kartës — fshihet */
.tl-widget.portfolio .project-link { display: none !important; }
@media (prefers-reduced-motion: reduce) {
  .tl-widget.portfolio .card-item.portfolio-item,
  .tl-widget.portfolio .card-item.portfolio-item:hover,
  .tl-widget.portfolio .card-item:hover .image-holder img,
  .tl-widget.portfolio .image-holder img { transition: none !important; transform: none !important; }
}

/* ------------------------------------------------------------------
   HISTORIA E EUREKA-S (kryefaqja): 2–3 karta metro me numër hapi,
   përmbledhje dhe link "Lexo historinë"; kartat me lartësi të barabartë.
   Ngjyrat: #4C7620 (AA mbi të bardhë), #5A626C për tekstin dytësor. */
.eureka-story-intro {
  margin: 10px 0 0;
  max-width: 640px;
  font-size: 1.15rem;
  line-height: 1.5;
  color: #5a626c;
}
.eureka-story .tl-widget.portfolio .row.items > [class*="col-"] {
  display: flex;
  margin-bottom: 30px;
}
.eureka-story .tl-widget.portfolio .card-item.portfolio-item {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.eureka-story .tl-widget.portfolio .card-content { flex: 1; display: flex; }
/* "Lexo historinë" në fund të çdo karte, në një vijë mes kartave */
.eureka-story .tl-widget.portfolio .card-content .heading { display: flex; flex-direction: column; width: 100%; }
.eureka-story .tl-widget.portfolio .card-content .show-project { margin-top: auto; }
.eureka-story-step {
  display: block;
  margin-bottom: 6px;
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  color: #4c7620;
}
.eureka-story-excerpt {
  margin: 0 0 12px;
  font-size: 0.98rem;
  line-height: 1.55;
  color: #5a626c;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.tl-widget.portfolio .card-content .post-holder-tags a.eureka-story-more {
  font-weight: 600;
  font-size: 0.95rem;
  color: #4c7620 !important;
  text-decoration: none;
}
.eureka-story-more::after { content: " →"; }
.tl-widget.portfolio .card-content .post-holder-tags a.eureka-story-more:hover { text-decoration: underline; }

/* ------------------------------------------------------------------
   KARUSELI I VIDEOVE: slide-t unifikohen me kartat e publikimeve
   (Varianti C). Lëvizja horizontale (Swiper) NUK preket — hover-i
   vihet mbi .sa-player-wrapper, jo mbi .swiper-slide (transformat e
   Swiper-it mbeten të lira). Thumbnails maxresdefault të lokalizuara. */
.sa-glory-player .swiper-slide { background: transparent !important; }
/* Lartësia fikse e temës (350px @mobile) linte 90px+ hapësirë të vdekur nën
   kartat më të shkurtra — lartësi sipas përmbajtjes, slide-t të barabartë */
.sa-glory-player { height: auto !important; }
.sa-glory-player .swiper-slide {
  height: auto !important;
  display: flex;
  align-items: stretch;
}
.sa-glory-player .swiper-slide .sa-player-wrapper { width: 100%; }
.sa-glory-player .swiper-slide .sa-player-wrapper {
  position: relative;
  height: 100% !important;
  display: flex;
  flex-direction: column;
  background: #fff !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  box-shadow: 0 6px 18px rgba(10, 17, 33, 0.08);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.sa-glory-player .swiper-slide:hover .sa-player-wrapper {
  transform: translateY(-4px);
  box-shadow: 0 16px 36px rgba(10, 17, 33, 0.16);
}
.sa-glory-player img.sa-player-poster {
  position: static !important;
  display: block;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: 16 / 9;
  object-fit: cover !important;
  transition: transform 0.3s ease;
}
.sa-glory-player .swiper-slide:hover img.sa-player-poster { transform: scale(1.03); }
/* butoni play (rrethi i kuq) i qendërzuar mbi zonën 16:9 të thumbnail-it */
.sa-glory-player .sa-play-button-wrapper {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 16 / 9;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  pointer-events: none;
  z-index: 3;
}
.sa-glory-player .sa-play-button { pointer-events: auto; }
/* titulli poshtë thumbnail-it, brenda kartës — i dukshëm në ÇDO slide
   (tema e tregonte vetëm në aktivin; kartat duhen konsistente) */
.sa-glory-player .sa-player-content-wrapper {
  position: relative !important;
  inset: auto !important;
  z-index: 2;
  background: #fff !important;
  padding: 16px 20px 18px !important;
  transform: none !important;
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  /* zgjerohet të mbushë kartën kur slide-t fqinjë kanë tituj më të gjatë */
  flex: 1 0 auto;
}
.sa-glory-player .sa-player-title {
  color: #0a1121 !important;
  font-size: 1.15rem !important;
  line-height: 1.35 !important;
  margin: 0 !important;
  text-shadow: none !important;
}
/* iframe-i pas klikimit mbulon vetëm zonën 16:9 (titulli mbetet i dukshëm).
   Para klikimit rri POSHTË play-it dhe pa pointer-events (ndrizhe bllokonte
   klikimin); Behaviors e ngre me z-index 5 + pointer-events auto në play */
.sa-glory-player .sa-video-player {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 16 / 9;
  z-index: 1;
  pointer-events: none;
}
.sa-glory-player .sa-player-iframe { width: 100%; height: 100%; }
@media (prefers-reduced-motion: reduce) {
  .sa-glory-player .swiper-slide .sa-player-wrapper,
  .sa-glory-player .swiper-slide:hover .sa-player-wrapper,
  .sa-glory-player img.sa-player-poster,
  .sa-glory-player .swiper-slide:hover img.sa-player-poster { transition: none !important; transform: none !important; }
}

/* Rreth nesh, seksioni "Historiku": tema i jep kolonave 34%/66% — e para del
   fill i ngushtë, e dyta fill i gjerë. Barazohen 50/50 me gap të qartë; nën
   768px Elementor i rrëzon vetë njëra mbi tjetrën (media query e temës mbetet
   në fuqi se këtu prekim vetëm >=768px). */
@media (min-width: 768px) {
  .elementor-element-67d0be7 > .e-con-inner {
    gap: 40px;
  }
  .elementor-element-67d0be7 > .e-con-inner > .elementor-element-e74699f,
  .elementor-element-67d0be7 > .e-con-inner > .elementor-element-b5e8bc6 {
    width: calc(50% - 20px) !important;
    max-width: calc(50% - 20px) !important;
    flex: 0 0 calc(50% - 20px) !important;
  }
}

/* Kryefaqja @768px: .row.items (marzhe -12px Bootstrap) del 2px jashtë se
   kontenieri Elementor jep vetëm 10px padding në atë brez — scroll horizontal
   2px në gjithë faqen. Clip i padëmshëm te widget-i pronar: tejkalimi është
   vetëm gutter bosh; në gjerësi të tjera padding-u ≥12px → zero efekt. */
.tl-widget.portfolio { overflow-x: clip; }