/* ============================================================
   TENUIS Laboratories — dizajni 3 "e bardhë ajrore" (v42)
   Karakteri: shumë hapësirë e bardhë, tituj serif majtas,
   vijat diagonale të logos si motiv i heshtur, blloku i errët
   vjollcë për certifikimet, kutia jeshile e WhatsApp-it.
   Ngjyrat: vetëm ato të logos — rozë, flori, blu-deti, vjollcë
   e errët — plus korali i butonave i trashëguar nga faqja.
   Kthimi mbrapa: _arkiv/dizajni-2-klasik-v41/.
   ============================================================ */

:root {
  /* Ngjyrat e logos */
  --pink:      #e0245e;
  --gold:      #f0a914;
  --teal:      #2196b1;
  --teal-dark: #14708a;
  --teal-soft: #eaf5f8;
  --plum:      #3d1a50;
  --plum-soft: #f5f0f8;
  --coral:     #f0725f;   /* butonat e veprimit */
  --coral-dark:#d95f4d;
  --green:     #3bb273;   /* vetëm për ikonat e nënfaqeve */

  /* emra të vjetër klasash/ngjyrash që përdoren në nënfaqe */
  --purple:      var(--plum);
  --purple-soft: var(--plum-soft);
  --violet:      var(--plum);
  --orange:      var(--gold);

  /* Shiriti shumëngjyrësh i logos — nënshkrimi i faqes */
  --stripe: linear-gradient(90deg,
    var(--teal) 0%, var(--gold) 33%, var(--pink) 66%, var(--plum) 100%);

  /* Vijat diagonale të globit të logos, si motiv dekorativ i zbehtë */
  --diagonale: repeating-linear-gradient(45deg,
    var(--teal) 0 6px,   transparent 6px 26px,
    var(--gold) 26px 32px, transparent 32px 52px,
    var(--pink) 52px 58px, transparent 58px 78px,
    var(--plum) 78px 84px, transparent 84px 104px);

  --ink:   #241b2e;       /* titujt, me nuancë vjollce si logoja */
  --text:  #52485e;       /* teksti bazë */
  --line:  #e9e4ee;
  --radius: 16px;
  --shadow: 0 10px 34px rgba(61, 26, 80, 0.10);
  --shadow-sm: 0 3px 14px rgba(61, 26, 80, 0.06);

  --serif:   'Libre Baskerville', Georgia, serif;
  --sans:    'Poppins', -apple-system, 'Segoe UI', Arial, sans-serif;
  --poppins: var(--sans);
  --body-font: var(--sans);
}

/* ---------- Bazat ---------- */

* { margin: 0; padding: 0; box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  font-family: var(--sans);
  font-size: 16px;
  font-weight: 400;
  color: var(--text);
  background: #fff;
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
}

img { display: block; max-width: 100%; height: auto; }

::selection { background: var(--teal-soft); color: var(--teal-dark); }

a { color: var(--teal-dark); text-decoration: none; transition: color 0.2s; }
a:hover { color: var(--plum); }

a:focus-visible,
button:focus-visible,
.nav-toggle-btn:focus-visible {
  outline: 2px solid var(--teal);
  outline-offset: 3px;
  border-radius: 3px;
}

.container {
  width: min(1180px, 92%);
  margin-inline: auto;
}

.section { padding: clamp(64px, 9vw, 110px) 0; }

/* ankorat të mos fshihen nën kokën e ngjitur */
[id] { scroll-margin-top: 96px; }

/* Shiriti shumëngjyrësh, i hollë, si nënshkrim */
.shiriti {
  display: block;
  height: 3px;
  background: var(--stripe);
}

/* Vijat diagonale të logos si dekor shumë i zbehtë */
.vija-diagonale {
  position: absolute;
  background: var(--diagonale);
  opacity: 0.07;
  pointer-events: none;
}

/* ---------- Etiketat dhe titujt ---------- */

.etiketa,
.pse-etiketa,
.faqe-etiketa {
  display: block;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--teal-dark);
}

.etiketa-light { color: rgba(255, 255, 255, 0.75); }

/* titulli i madh majtas (faqja kryesore) */
.titulli {
  font-family: var(--serif);
  font-weight: 700;
  font-size: clamp(28px, 4vw, 42px);
  color: var(--ink);
  line-height: 1.25;
  text-wrap: balance;
  margin-top: 8px;
}

.titulli::after {
  content: "";
  display: block;
  width: 58px;
  height: 4px;
  border-radius: 2px;
  background: var(--stripe);
  margin-top: 16px;
}

.titulli-light { color: #fff; }

/* titulli në qendër (nënfaqet) */
.section-title {
  font-family: var(--serif);
  font-weight: 700;
  font-size: clamp(28px, 4.2vw, 42px);
  color: var(--ink);
  text-align: center;
  line-height: 1.25;
  text-wrap: balance;
}

.section-title::after {
  content: "";
  display: block;
  width: 58px;
  height: 4px;
  border-radius: 2px;
  background: var(--stripe);
  margin: 16px auto 0;
}

.section-sub {
  text-align: center;
  margin: 16px auto 0;
  max-width: 640px;
  font-size: 17px;
}

/* koka e seksionit: titulli majtas, lidhja djathtas */
.section-koka {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: clamp(34px, 5vw, 54px);
}

.lidhja-krahu {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
  font-size: 15px;
  color: var(--teal-dark);
  white-space: nowrap;
  padding-bottom: 6px;
}

.lidhja-krahu svg { transition: transform 0.2s; }
.lidhja-krahu:hover svg { transform: translateX(4px); }

/* ---------- Butonat ---------- */

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: var(--sans);
  font-weight: 600;
  font-size: 15.5px;
  line-height: 1;
  padding: 15px 28px;
  border-radius: 999px;
  transition: background 0.2s, color 0.2s, border-color 0.2s, transform 0.15s;
}

.btn-coral {
  background: var(--coral);
  color: #fff;
}
.btn-coral:hover { background: var(--coral-dark); color: #fff; transform: translateY(-1px); }

.btn-bosh {
  background: transparent;
  color: var(--ink);
  border: 1.5px solid var(--line);
}
.btn-bosh:hover { border-color: var(--teal); color: var(--teal-dark); }

/* butonat e trashëguar të nënfaqeve dhe formularit */
.btn-kontakt, .btn-dergo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  cursor: pointer;
  font-family: var(--sans);
  font-weight: 600;
  font-size: 15.5px;
  line-height: 1;
  padding: 15px 28px;
  border-radius: 999px;
  background: var(--coral);
  color: #fff;
  transition: background 0.2s, color 0.2s, transform 0.15s;
}

.btn-kontakt:hover, .btn-dergo:hover {
  background: var(--coral-dark);
  color: #fff;
  transform: translateY(-1px);
}

.btn-dergo { margin-top: 20px; }

/* ---------- Koka e faqes ---------- */

.koka {
  position: sticky;
  top: 0;
  z-index: 60;
  background: #fff;
}

.koka-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  min-height: 78px;
}

/* logoja në kokë: emri me stilin e shkrimit të logos */
.logo-emri {
  display: block;
  font-weight: 700;
  font-size: 23px;
  letter-spacing: 0.1em;
  line-height: 1;
  color: var(--plum);
}

.logo-emri span {
  display: block;
  font-weight: 400;
  font-size: 10px;
  letter-spacing: 0.44em;
  text-transform: uppercase;
  color: var(--plum);
  opacity: 0.78;
  margin-top: 4px;
}

.logo:hover .logo-emri { color: var(--plum); }

/* logoja e vërtetë, horizontale: globi majtas, shkrimi djathtas.
   Skedari i logos (1840x869) ka globin lart majtas dhe shkrimin poshtë;
   çdo pjesë pritet me një dritare me "overflow: hidden" nga i njëjti skedar,
   i zvogëluar në 227px gjerësi (shkalla 0.1235). */
.logo {
  display: inline-flex;
  align-items: center;
  gap: 9px;
}

.logo-globi,
.logo-shkrimi {
  position: relative;
  display: block;
  overflow: hidden;
}

.logo-globi img,
.logo-shkrimi img {
  position: absolute;
  width: 177px;
  height: auto;
  max-width: none;
}

/* globi: zona x 110-630, y 0-505 e skedarit, pak më i vogël se shkrimi (shkalla 0.082) */
.logo-globi { width: 43px; height: 41px; }
.logo-globi img { width: 151px; left: -9px; top: 0; }

/* shkrimi TENUIS Laboratories: zona x 495-1410, y 510-850 e skedarit (shkalla 0.096) */
.logo-shkrimi { width: 88px; height: 33px; }
.logo-shkrimi img { left: -48px; top: -49px; }

.nav {
  display: flex;
  align-items: center;
  gap: clamp(18px, 2.4vw, 34px);
}

.nav > a,
.nav-item > a {
  font-weight: 500;
  font-size: 15.5px;
  color: var(--ink);
  padding: 8px 0;
  position: relative;
}

/* nënvizimi shumëngjyrësh në hover dhe te zëri aktiv */
.nav > a::after,
.nav-item > a::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 3px;
  border-radius: 2px;
  background: var(--stripe);
  opacity: 0;
  transition: opacity 0.2s;
}
.nav > a:hover::after,
.nav-item:hover > a::after,
.nav > a.active::after,
.nav-item > a.active::after { opacity: 1; }

/* nënmenutë */
.nav-item { position: relative; }

.sub-menu {
  position: absolute;
  top: calc(100% + 10px);
  left: -18px;
  min-width: 250px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: var(--shadow);
  padding: 10px;
  display: flex;
  flex-direction: column;
  opacity: 0;
  visibility: hidden;
  transform: translateY(6px);
  transition: opacity 0.18s, transform 0.18s, visibility 0.18s;
}

.nav-item:hover .sub-menu,
.nav-item:focus-within .sub-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.sub-menu a {
  padding: 10px 14px;
  border-radius: 8px;
  font-size: 14.5px;
  font-weight: 500;
  color: var(--ink);
}
.sub-menu a:hover { background: var(--teal-soft); color: var(--teal-dark); }

/* butoni i menusë në celular */
.nav-toggle { display: none; }

.nav-toggle-btn {
  display: none;
  flex-direction: column;
  gap: 5px;
  cursor: pointer;
  padding: 8px;
}
.nav-toggle-btn span {
  width: 24px;
  height: 2.5px;
  border-radius: 2px;
  background: var(--ink);
  transition: transform 0.2s, opacity 0.2s;
}

/* lidhja e kthimit në faqet ligjore */
.kthim {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink);
  white-space: nowrap;
}
.kthim:hover { color: var(--teal-dark); }

/* ---------- Hero i faqes kryesore ---------- */

.hero {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  min-height: min(620px, 78vh);
  padding: clamp(56px, 8vw, 100px) 0 clamp(60px, 8vw, 110px);
  background: #fff;
}

/* fotoja e plotë si sfond, vialet djathtas; zbardhet nga e majta që teksti të lexohet */
.hero-sfondi {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: 82% center;
  animation: hyrje-foto 0.9s ease 0.1s backwards;
}

.hero-sfondi::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg,
    #fff 0%,
    rgba(255, 255, 255, 0.97) 44%,
    rgba(255, 255, 255, 0.82) 58%,
    rgba(255, 255, 255, 0.35) 74%,
    rgba(255, 255, 255, 0) 100%);
}

/* kolona qendrore (e njëjta gjerësi si .container), e qendruar */
.hero-inner { position: relative; }

/* teksti fillon në skajin e majtë të kolonës qendrore,
   në vijë të drejtë me foton e bllokut "Pse Tenuis" poshtë */
.hero-teksti { max-width: 600px; }

.hero-teksti h1 {
  font-family: var(--serif);
  font-weight: 700;
  font-size: clamp(30px, 4.6vw, 52px);
  line-height: 1.22;
  color: var(--ink);
  text-wrap: balance;
  margin-top: 14px;
}

/* hyrja e lehtë: titulli e teksti ngjiten butësisht, fotot shfaqen me radhë */
@keyframes hyrje-lart {
  from { opacity: 0; transform: translateY(18px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes hyrje-foto {
  from { opacity: 0; transform: translateY(24px) scale(0.97); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

.hero-teksti h1        { animation: hyrje-lart 0.65s ease 0.05s backwards; }
.hero-pershkrimi       { animation: hyrje-lart 0.65s ease 0.18s backwards; }
.hero-butonat          { animation: hyrje-lart 0.65s ease 0.30s backwards; }
.hero-distinktivet     { animation: hyrje-lart 0.65s ease 0.42s backwards; }

.hero-pershkrimi {
  margin-top: 18px;
  font-size: 17.5px;
  max-width: 520px;
}

.hero-butonat {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 30px;
}

/* distinktivët nën hero, si rreshti i besimit */
.hero-distinktivet {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 40px;
  padding-top: 26px;
  border-top: 1px solid var(--line);
}

.distinktiv {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13.5px;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--plum);
  background: var(--plum-soft);
  border: 1px solid transparent;
  border-radius: 999px;
  padding: 7px 16px;
  white-space: nowrap;
  transition: border-color 0.2s, background 0.2s;
}
.distinktiv:hover,
a.distinktiv:hover { border-color: var(--plum); background: #fff; color: var(--plum); }
.distinktiv svg { color: var(--plum); flex: 0 0 auto; }

/* ---------- Banderola e nënfaqeve ---------- */

.banderola {
  position: relative;
  overflow: hidden;
  background: #fff;
  padding: clamp(64px, 9vw, 110px) 0;
}

/* fotoja e plotë, zbardhet nga e majta që titulli të lexohet */
.banderola-foto {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
}

.banderola-foto::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg,
    #fff 0%,
    rgba(255, 255, 255, 0.96) 30%,
    rgba(255, 255, 255, 0.72) 52%,
    rgba(255, 255, 255, 0.16) 76%,
    rgba(255, 255, 255, 0) 100%);
}

.banderola-inner { position: relative; }

.banderola .etiketa,
.banderola .faqe-etiketa { animation: hyrje-lart 0.65s ease 0.05s backwards; }

.banderola h1 {
  font-family: var(--serif);
  font-weight: 700;
  font-size: clamp(32px, 4.8vw, 52px);
  line-height: 1.2;
  color: var(--ink);
  margin-top: 10px;
  animation: hyrje-lart 0.65s ease 0.15s backwards;
}

.banderola h1::after {
  content: "";
  display: block;
  width: 58px;
  height: 4px;
  border-radius: 2px;
  background: var(--stripe);
  margin-top: 18px;
}

@media (max-width: 760px) {
  .banderola-foto::after { background: rgba(255, 255, 255, 0.9); }
}
/* ---------- Pse TENUIS (kreu) dhe blloqet foto-tekst (nënfaqet) ---------- */

.pse { background: #fff; }

/* në kreun: blloku pas fotos kryesore merr një ton shumë të lehtë vjollce,
   që ndarja nga fotoja të bëhet me ndryshim toni, pa vijë */
.hero + .pse { background: #faf8fc; }

.pse-inner {
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: clamp(36px, 6vw, 80px);
  align-items: center;
}

.pse-media { position: relative; }

.pse-media img {
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  position: relative;
  z-index: 1;
  width: 100%;
  height: auto;
}

/* kornizë e butë pas fotos në nënfaqe */
.pse-media::before {
  content: "";
  position: absolute;
  inset: 18px -18px -18px 18px;
  border-radius: var(--radius);
  background: linear-gradient(135deg, var(--teal-soft), var(--plum-soft));
}

/* në kreun kornizën e zëvendësojnë vijat diagonale */
.pse .pse-media::before { content: none; }

/* këndi me vija diagonale pas fotos (kreu) */
.vd-foto {
  left: -34px;
  bottom: -34px;
  width: 220px;
  height: 220px;
  border-radius: var(--radius);
  opacity: 0.25;
}

/* vula ISO/IEC 17025 mbi cepin e sipërm djathtas të fotos "Pse TENUIS" (kreu),
   gjysmë e tejdukshme, pa sfond dhe pa hije */
.pse-media .vula-iso {
  position: absolute;
  top: -34px;
  right: -34px;
  width: 112px;
  height: 112px;
  z-index: 2;
  opacity: 0.75;
  border-radius: 0;
  box-shadow: none;
}

@media (max-width: 760px) {
  .pse-media .vula-iso {
    width: 84px;
    height: 84px;
    top: -22px;
    right: -12px;
  }
}

/* titujt e blloqeve foto-tekst në nënfaqe */
.pse-text h2 {
  font-family: var(--serif);
  font-weight: 700;
  font-size: clamp(26px, 3.6vw, 38px);
  color: var(--ink);
  line-height: 1.25;
  margin-top: 8px;
}

.pse-text h2::after {
  content: "";
  display: block;
  width: 58px;
  height: 4px;
  border-radius: 2px;
  background: var(--stripe);
  margin-top: 14px;
}

.pse-hyrja { margin-top: 18px; max-width: 560px; }

.pse-pikat {
  list-style: none;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px 26px;
  margin-top: 30px;
}

.pse-pikat li {
  display: flex;
  gap: 14px;
  align-items: flex-start;
}

.pika-ikona {
  flex: none;
  width: 46px;
  height: 46px;
  border-radius: 12px;
  display: grid;
  place-items: center;
}

.pk-teal   { background: var(--teal-soft); color: var(--teal-dark); }
.pk-plum,
.pk-violet { background: var(--plum-soft); color: var(--plum); }
.pk-coral  { background: #fdeeeb; color: var(--coral-dark); }
.pk-gold   { background: #fdf3dd; color: #b47d0a; }
.pk-green  { background: #e8f6ee; color: #23794d; }

.pika-teksti { font-size: 15px; line-height: 1.6; }
.pika-teksti strong {
  display: block;
  font-weight: 600;
  color: var(--ink);
  margin-bottom: 3px;
}

/* ---------- Kartat e shërbimeve ---------- */

/* kreu: karta vertikale me shiritin që ndizet lart */
.sherbimet { background: linear-gradient(180deg, #fff 0%, var(--teal-soft) 160%); }

.sherbimet-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}

.karte {
  position: relative;
  display: block;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 28px 26px 30px;
  transition: border-color 0.2s, box-shadow 0.2s, transform 0.2s;
}

.karte::before {
  content: "";
  position: absolute;
  top: 0; left: 22px; right: 22px;
  height: 3px;
  border-radius: 0 0 3px 3px;
  background: var(--stripe);
  opacity: 0;
  transition: opacity 0.2s;
}

.karte:hover {
  border-color: transparent;
  box-shadow: var(--shadow);
  transform: translateY(-3px);
}
.karte:hover::before { opacity: 1; }

.karte-ikona {
  width: 54px;
  height: 54px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  margin-bottom: 18px;
}

/* ikonat me sfond të butë, në ngjyrat e markës */
.ik-teal   { background: var(--teal-soft); color: var(--teal-dark); }
.ik-blu    { background: #e7f2fb; color: #1c6ca8; }
.ik-green  { background: #e8f6ee; color: #23794d; }
.ik-gold,
.ik-orange { background: #fdf3dd; color: #b47d0a; }
.ik-plum,
.ik-violet { background: var(--plum-soft); color: var(--plum); }
.ik-pink   { background: #fcebf1; color: var(--pink); }

.karte h3 {
  font-weight: 600;
  font-size: 18px;
  color: var(--ink);
  margin-bottom: 6px;
}

.karte p { font-size: 15px; line-height: 1.65; }

.karte-shigjeta {
  display: inline-flex;
  margin-top: 16px;
  color: var(--teal-dark);
  opacity: 0.55;
  transition: opacity 0.2s, transform 0.2s;
}
.karte:hover .karte-shigjeta { opacity: 1; transform: translateX(4px); }

/* nënfaqet: karta horizontale me ikonë majtas (klasat e vjetra) */
.sherbimet-kreu { background: #f7fafb; }

.sherbimet-kreu .sherbimet-grid { margin-top: clamp(36px, 5vw, 55px); }

.sherbim-karte {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 24px 22px;
  transition: transform 0.22s, box-shadow 0.22s, border-color 0.22s;
}

.sherbim-karte:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow);
  border-color: transparent;
}

.sherbim-ikona {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  flex: 0 0 auto;
  border-radius: 14px;
}

.sherbim-teksti { flex: 1; }

.sherbim-karte h3 {
  font-size: 15.5px;
  font-weight: 600;
  color: var(--ink);
  margin-bottom: 4px;
}

.sherbim-teksti p {
  font-size: 13.5px;
  line-height: 1.6;
}

.sherbim-karte .shigjeta {
  color: #c4bacf;
  margin-top: 4px;
  transition: transform 0.22s, color 0.22s;
}

.sherbim-karte:hover .shigjeta { transform: translateX(4px); color: var(--teal-dark); }

/* ---------- Çertifikime, blloku i errët (kreu) ---------- */

.certifikime {
  position: relative;
  overflow: hidden;
  background: var(--plum);
}

.vd-cert {
  top: -120px;
  left: -160px;
  width: 560px;
  height: 560px;
  border-radius: 50%;
  opacity: 0.1;
}

.cert-grid {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.cert-karte {
  display: block;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: var(--radius);
  padding: 26px 24px;
  color: rgba(255, 255, 255, 0.82);
  transition: background 0.2s, border-color 0.2s, transform 0.2s;
}

a.cert-karte:hover {
  background: rgba(255, 255, 255, 0.11);
  border-color: rgba(255, 255, 255, 0.3);
  transform: translateY(-3px);
  color: rgba(255, 255, 255, 0.9);
}

.cert-ikona {
  width: 46px;
  height: 46px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: rgba(255, 255, 255, 0.1);
  color: var(--gold);
  margin-bottom: 16px;
}

.cert-karte h3 {
  color: #fff;
  font-weight: 600;
  font-size: 17px;
  margin-bottom: 6px;
}

.cert-karte p { font-size: 14.5px; line-height: 1.6; }

/* lidhja me shigjetë: teal në faqet e bardha, flori brenda bllokut të errët */
.cert-shiko {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  font-weight: 600;
  color: var(--teal-dark);
}

.cert-shiko svg { transition: transform 0.2s; }
.cert-shiko:hover svg { transform: translateX(3px); }

.cert-leshuesi,
.certifikime .cert-shiko {
  display: inline-flex;
  width: 100%;
  align-items: center;
  gap: 6px;
  margin-top: 14px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--gold);
}

a.cert-karte:hover .cert-shiko svg { transform: translateX(3px); }

/* lidhja e vogël e verifikimit pranë organit të akreditimit (DPA) */
.cert-verifiko-link {
  display: block;
  width: 100%;
  margin-top: 8px;
  font-size: 12px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.5);
  transition: color 0.2s;
}
.cert-verifiko-link:hover { color: rgba(255, 255, 255, 0.85); }

/* ---------- Procesi në 3 hapa ---------- */

.procesi {
  position: relative;
  overflow: hidden;
}

/* vijat diagonale të logos, dekor i zbehtë në qoshen e djathtë */
.vd-procesi {
  top: -90px;
  right: -130px;
  width: 440px;
  height: 440px;
  border-radius: 50%;
  opacity: 0.09;
}

.hapat {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}

.hapi {
  position: relative;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 30px 26px;
}

.hapi-numri {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  font-family: var(--serif);
  font-weight: 700;
  font-size: 20px;
  color: #fff;
  margin-bottom: 18px;
}

.hn-teal { background: var(--teal); }
.hn-gold { background: var(--gold); }
.hn-pink { background: var(--pink); }

.hapi h3 {
  font-weight: 600;
  font-size: 18px;
  color: var(--ink);
  margin-bottom: 6px;
}

.hapi p { font-size: 15px; line-height: 1.65; }
.hapi a { font-weight: 600; }

/* ---------- Përshtypjet ---------- */

.pershtypjet { background: var(--teal-soft); }

.quotes-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}

.quote-karte {
  background: #fff;
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  padding: 30px 28px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.quote-karte blockquote {
  font-size: 15px;
  line-height: 1.7;
  flex: 1;
}

.quote-karte blockquote::before {
  content: "\201C";
  display: block;
  font-family: var(--serif);
  font-size: 44px;
  line-height: 0.6;
  color: var(--teal);
  margin-bottom: 12px;
}

.quote-karte figcaption strong {
  display: block;
  font-weight: 600;
  color: var(--ink);
  font-size: 15px;
}

.quote-karte figcaption span { font-size: 13.5px; }

/* ---------- Ftesa për bashkëpunim (kreu) ---------- */

.ftesa { padding-top: 0; }

.ftesa-karte {
  position: relative;
  overflow: hidden;
  background: var(--plum);
  border-radius: 22px;
  padding: clamp(36px, 5vw, 56px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 28px;
}

.vd-ftesa {
  top: -100px;
  right: -120px;
  width: 380px;
  height: 380px;
  border-radius: 50%;
  opacity: 0.12;
}

.ftesa-teksti h2 {
  font-family: var(--serif);
  font-weight: 700;
  font-size: clamp(24px, 3.2vw, 34px);
  color: #fff;
}

.ftesa-teksti p {
  margin-top: 8px;
  color: rgba(255, 255, 255, 0.78);
  max-width: 480px;
}

.ftesa-veprimet {
  position: relative;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 20px;
}

.ftesa-tel {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #fff;
  font-weight: 600;
  font-size: 16px;
}
.ftesa-tel:hover { color: var(--gold); }

/* ---------- Bashkëpunoni (nënfaqet) ---------- */

.bashkepunoni {
  background: linear-gradient(180deg, #fff 0%, var(--teal-soft) 100%);
  padding: clamp(44px, 7vw, 70px) 0;
}

.bashk-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(24px, 5vw, 60px);
  flex-wrap: wrap;
}

.bashk-inner p {
  font-family: var(--serif);
  font-size: clamp(22px, 3vw, 30px);
  color: var(--ink);
}

/* ---------- Historia jonë (rrëfim editorial) ---------- */

.historia-inner {
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: clamp(36px, 6vw, 80px);
  align-items: start;
}

.historia-lead h2 {
  font-family: var(--serif);
  font-weight: 700;
  font-size: clamp(32px, 4.6vw, 52px);
  line-height: 1.18;
  color: var(--ink);
  max-width: 400px;
}

.historia-lead h2::after {
  content: "";
  display: block;
  width: 58px;
  height: 4px;
  border-radius: 2px;
  background: var(--stripe);
  margin-top: 18px;
}

.historia-teksti p {
  font-size: 16.5px;
  margin-bottom: 20px;
}

.historia-teksti p:last-child { margin-bottom: 0; }

.historia-teksti strong {
  font-size: 18px;
  font-weight: 700;
}

.theks-teal   { color: var(--teal-dark); }
.theks-violet { color: var(--plum); }
.theks-coral  { color: var(--coral-dark); }

.historia-foto {
  width: 100%;
  aspect-ratio: 21 / 9;
  object-fit: cover;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  margin-top: clamp(36px, 5vw, 55px);
}

/* ---------- Qëllimi, Misioni, Vizioni dhe kartat me ikona ---------- */

.qmv { background: #f8f6fa; }

.qmv-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: clamp(36px, 5vw, 55px);
}

.qmv-karte {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 30px 26px;
}

.qmv-ikona {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 12px;
  margin-bottom: 16px;
}

.qmv-karte h3 {
  font-size: 17px;
  font-weight: 600;
  color: var(--ink);
  margin-bottom: 8px;
}

.qmv-karte p { font-size: 14.5px; }
.qmv-karte p + p { margin-top: 8px; }

.teknologjia-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  margin-top: clamp(36px, 5vw, 55px);
}

/* ---------- Lista me shenja të markës ---------- */

.lista-shenja {
  list-style: none;
  display: grid;
  gap: 10px;
  margin-top: 22px;
}

.lista-shenja li {
  position: relative;
  padding-left: 32px;
  font-size: 15px;
}

.lista-shenja.dy-kolona { grid-template-columns: 1fr 1fr; gap: 10px 26px; }

@media (max-width: 700px) {
  .lista-shenja.dy-kolona { grid-template-columns: 1fr; }
}

.lista-shenja li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 1px;
  width: 21px;
  height: 21px;
  border-radius: 50%;
  background: var(--teal-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2314708a' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 13 5 5L19 7'/%3E%3C/svg%3E") center / 11px no-repeat;
}

/* ---------- Akordioni i markës ---------- */

.palos details { border-bottom: 1px solid var(--line); }
.palos details:first-child { border-top: 1px solid var(--line); }

.palos summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 18px 4px;
  font-size: 15px;
  font-weight: 600;
  color: var(--ink);
  transition: color 0.2s;
}

.palos summary:hover { color: var(--teal-dark); }

.palos summary::-webkit-details-marker { display: none; }

.palos summary::after {
  content: "+";
  font-size: 24px;
  font-weight: 400;
  color: var(--teal);
  line-height: 1;
  flex: 0 0 auto;
  transition: transform 0.25s;
}

.palos details[open] summary::after { transform: rotate(45deg); }

.palos .panel { padding: 4px 4px 24px; }

/* ---------- Tabela e analizave ---------- */

.tabela-analizash {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}

.tabela-analizash td {
  padding: 10px 8px;
  vertical-align: top;
  border-bottom: 1px solid #f0ecf4;
}

.tabela-analizash tr:last-child td { border-bottom: none; }

.tabela-analizash td:first-child { color: var(--ink); font-weight: 500; }

.tabela-analizash td:last-child {
  color: #6f6580;
  font-size: 13px;
  text-align: right;
}

.tabela-analizash th {
  padding: 10px 8px;
  text-align: left;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--teal-dark);
  border-bottom: 2px solid var(--line);
}

.tabela-analizash th:last-child { text-align: right; }

/* rreshta zebra: syri ndjek më lehtë vijën analizë-metodë */
.tabela-analizash tr:nth-child(even) td { background: #f8f6fa; }
.tabela-analizash tr:hover td { background: var(--teal-soft); }

@media (max-width: 700px) {
  .tabela-analizash td { display: block; text-align: left; }
  .tabela-analizash td:first-child { border-bottom: none; padding-bottom: 2px; }
  .tabela-analizash td:last-child { padding-top: 0; text-align: left; }
  .tabela-analizash thead { display: none; }
}

/* ---------- Blloqet karte-tekst (aplikimi-grid) ---------- */

.aplikimi { background: #f8f6fa; }

.aplikimi-grid {
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: clamp(24px, 4vw, 40px);
  align-items: start;
  margin-top: clamp(36px, 5vw, 55px);
}

.aplikimi-karte {
  background: var(--teal-soft);
  border-radius: var(--radius);
  padding: 30px 28px;
}

.aplikimi-karte h3 {
  font-size: 18px;
  font-weight: 600;
  color: var(--teal-dark);
  margin-bottom: 12px;
}

.aplikimi-karte p { font-size: 14.5px; margin-bottom: 12px; }
.aplikimi-karte p:last-child { margin-bottom: 0; }
.aplikimi-karte a { font-weight: 600; }

/* ikona e vetme, në vend të tekstit, pranë formularit të kontaktit — pa kuti, e shkrirë me sfondin */
.kontakt-ikona-shfaqja {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100%;
}

.kontakt-foto-duarve {
  width: 100%;
  height: auto;
  /* skajet shkrihen butë me sfondin, pa kornizë e pa hije */
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 14%, #000 86%, transparent),
                      linear-gradient(180deg, transparent, #000 14%, #000 86%, transparent);
          mask-image: linear-gradient(90deg, transparent, #000 14%, #000 86%, transparent),
                      linear-gradient(180deg, transparent, #000 14%, #000 86%, transparent);
  -webkit-mask-composite: source-in;
          mask-composite: intersect;
}

/* te kontakti fotoja mbush gjithë lartësinë e formularit dhe afrohet te tavolina */
.kontakt-grid { grid-template-columns: 1fr 1fr; align-items: stretch; }
.kontakt-grid .kontakt-ikona-shfaqja picture { display: block; width: 100%; height: 100%; }
.kontakt-grid .kontakt-foto-duarve { height: 100%; object-fit: cover; object-position: 55% 60%; }
@media (max-width: 900px) {
  .kontakt-grid .kontakt-foto-duarve { height: auto; }
}

/* ---------- Formulari i kontaktit ---------- */

.forma {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 30px 28px;
}

.forma label {
  display: block;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink);
  margin: 16px 0 6px;
}

.forma label:first-of-type { margin-top: 0; }

.forma input, .forma textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 11px 14px;
  font-family: inherit;
  font-size: 14px;
  color: var(--text);
  background: #fff;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.forma input:focus, .forma textarea:focus {
  outline: none;
  border-color: var(--teal);
  box-shadow: 0 0 0 3px rgba(33, 150, 177, 0.12);
}

.forma textarea { min-height: 130px; resize: vertical; }

/* kurthi për robotët: jashtë ekranit, i padukshëm për njerëzit */
.forma .kurth {
  position: absolute;
  left: -9999px;
  opacity: 0;
}

/* kutia e pranimit të privatësisë */
.forma .pranimi {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 20px 0 0;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.55;
  color: var(--text);
}

.forma .pranimi input {
  width: auto;
  margin-top: 3px;
  accent-color: var(--teal);
}

/* ---------- Organigrama me kod ---------- */

.org { margin-top: clamp(36px, 5vw, 55px); }

.org-kuti {
  display: block;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 10px 14px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink);
  text-align: center;
  line-height: 1.35;
}

.org-kreu { display: flex; justify-content: center; }

/* kutia e administratorit, në vjollcën e markës */
.org-a {
  background: var(--plum);
  border-color: var(--plum);
  color: #fff;
  padding: 12px 28px;
}

/* departamentet, me ton të markës */
.niveli-1 {
  background: var(--teal-soft);
  border-color: rgba(33, 150, 177, 0.25);
  color: var(--teal-dark);
}

/* vijat lidhëse */
.org-stub { width: 2px; height: 20px; background: #ded7e5; margin: 0 auto; }
.org-lidhja { height: 2px; background: #ded7e5; margin: 0 10%; }

.org-kolonat {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0 14px;
}

.org-kolona { display: flex; flex-direction: column; }

.org-kolona .org-kuti { position: relative; margin-top: 20px; }

.org-kolona .org-kuti::before {
  content: "";
  position: absolute;
  top: -20px;
  left: 50%;
  transform: translateX(-50%);
  width: 2px;
  height: 20px;
  background: #ded7e5;
}

/* ---------- Kontakti: harta ---------- */

.harta-mbeshtjellese {
  position: relative;
  margin-top: clamp(30px, 4vw, 45px);
}

.harta-kuadri {
  display: block;
  width: 100%;
  height: clamp(400px, 50vw, 520px);
  border: 0;
  filter: saturate(0.85);
}

/* e bardha venitet nga skajet mbi hartë: konturet shkrihen me faqen
   (maskat nuk zbatohen mbi iframe, prandaj pikturohet sipër) */
.harta-mbeshtjellese::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(90deg, #fff 0%, rgba(255, 255, 255, 0) 12%, rgba(255, 255, 255, 0) 88%, #fff 100%),
    linear-gradient(180deg, #fff 0%, rgba(255, 255, 255, 0) 14%, rgba(255, 255, 255, 0) 86%, #fff 100%);
}

/* karta e adresës mbi hartë */
.harta-karte {
  position: absolute;
  top: 26px;
  left: 26px;
  z-index: 2;
  background: #fff;
  border-radius: 12px;
  box-shadow: var(--shadow);
  padding: 18px 20px;
  max-width: 300px;
}

.harta-karte strong {
  display: block;
  font-size: 15px;
  font-weight: 700;
  color: var(--ink);
  margin-bottom: 4px;
}

.harta-karte p { font-size: 13px; margin-bottom: 12px; }

@media (max-width: 600px) {
  .harta-karte {
    position: static;
    max-width: none;
    border-radius: 0;
    box-shadow: none;
    border-bottom: 1px solid var(--line);
  }
}

/* ---------- Faqet ligjore ---------- */

.ligjore { max-width: 760px; }

.ligjore h1 {
  font-family: var(--serif);
  font-weight: 700;
  font-size: clamp(28px, 4vw, 40px);
  color: var(--ink);
  margin-bottom: 8px;
}

.ligjore-data {
  font-size: 13px;
  color: #6f6580;
  margin-bottom: 30px;
}

.ligjore h2 {
  font-size: 18px;
  font-weight: 600;
  color: var(--ink);
  margin: 28px 0 10px;
}

.ligjore p, .ligjore li { font-size: 15px; margin-bottom: 10px; }

.ligjore ul { padding-left: 20px; margin-bottom: 10px; }

/* ---------- Shiriti i distinktivëve (nënfaqet) ---------- */

.besimi {
  background: #fff;
  border-bottom: 1px solid var(--line);
  padding: 22px 0;
}

.besimi-inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 14px 18px;
}

.besimi-etiketa {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #6f6580;
  margin-right: 8px;
}

/* shënimi i NUIS-it në kartat e kontaktit dhe në fund */
.footer-nuis,
.fundi-nuis {
  margin-top: 12px;
  font-size: 13px;
  color: #6f6580;
}

/* ---------- Fundi i faqes ---------- */

.fundi {
  background: #2b1239;
  color: rgba(255, 255, 255, 0.72);
}

.fundi-grid {
  display: grid;
  grid-template-columns: 1.3fr 1fr 1fr;
  gap: clamp(30px, 5vw, 70px);
  padding: clamp(46px, 6vw, 70px) 0 40px;
}

.fundi-emri {
  font-weight: 700;
  font-size: 22px;
  letter-spacing: 0.06em;
  color: #fff;
}
.fundi-emri span {
  display: block;
  font-weight: 400;
  font-size: 12.5px;
  letter-spacing: 0.34em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.55);
}

.fundi-pershkrim {
  margin-top: 14px;
  font-size: 14.5px;
  max-width: 300px;
}

.socials { display: flex; gap: 10px; margin-top: 20px; }

.soc {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.25);
  color: rgba(255, 255, 255, 0.8);
  transition: background 0.2s, color 0.2s, border-color 0.2s;
}
.soc:hover { background: #fff; color: var(--plum); border-color: #fff; }

.fundi h4 {
  color: #fff;
  font-weight: 600;
  font-size: 15px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 16px;
}

.fundi-col p { font-size: 14.5px; margin-bottom: 6px; }
.fundi-col a { color: rgba(255, 255, 255, 0.72); }
.fundi-col a:hover { color: #fff; }

.fundi-nuis { color: rgba(255, 255, 255, 0.45); }

.fundi-lidhje {
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-size: 14.5px;
}

.fundi-privatesia {
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  font-size: 13.5px;
}

.fundi-fund {
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  padding: 20px 0;
  font-size: 13.5px;
  text-align: center;
}

/* fundi i shkurtër i faqeve ligjore s'ka rrjetë sipër */
.fundi-vetem .fundi-fund { border-top: none; }

/* ---------- Kutia e WhatsApp-it pluskuese ---------- */

.kontakt-pluskues {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 70;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: #25d366;      /* jeshilja e WhatsApp-it */
  color: #fff;
  font-weight: 600;
  font-size: 15px;
  padding: 13px 20px;
  border-radius: 999px;
  box-shadow: 0 10px 26px rgba(37, 211, 102, 0.4);
  transition: background 0.2s, transform 0.15s;
}

.kontakt-pluskues:hover {
  background: #1da851;
  color: #fff;
  transform: translateY(-2px);
}

/* ---------- Letra milimetrike në seksionet gri ---------- */

.qmv, .aplikimi, .sherbimet-kreu {
  background-image:
    linear-gradient(rgba(33, 150, 177, 0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(33, 150, 177, 0.05) 1px, transparent 1px),
    linear-gradient(rgba(33, 150, 177, 0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(33, 150, 177, 0.025) 1px, transparent 1px);
  background-size: 40px 40px, 40px 40px, 8px 8px, 8px 8px;
}

/* ---------- Zbulimi gjatë lëvizjes së faqes (Chrome/Edge) ---------- */

@supports (animation-timeline: view()) {

  .section-title, .section-sub, .pse-text,
  .titulli, .section-koka, .besimi-inner {
    animation: zbulim-lart both ease;
    animation-timeline: view();
    animation-range: entry 0% entry 38%;
  }

  .karte, .sherbim-karte, .hapi, .quote-karte, .cert-karte,
  .qmv-karte, .historia-teksti p, .kontakt-foto-duarve {
    animation: zbulim-bute both ease;
    animation-timeline: view();
    animation-range: entry 0% entry 35%;
  }

}

@keyframes zbulim-lart {
  from { opacity: 0; transform: translateY(34px); }
  to   { opacity: 1; transform: none; }
}

@keyframes zbulim-bute {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* ---------- Lëvizje më pak (aksesueshmëri) ---------- */

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

/* ---------- Përshtatja për tablet ---------- */

@media (max-width: 1024px) {
  .sherbimet-grid { grid-template-columns: 1fr 1fr; }
  .cert-grid { grid-template-columns: 1fr 1fr; }
  .hero { min-height: 0; }
  .hero-sfondi { background-position: 70% center; }
}

@media (max-width: 760px) {
  .hero-sfondi::after { background: rgba(255, 255, 255, 0.88); }
}

@media (max-width: 900px) {
  .pse-inner { grid-template-columns: 1fr; gap: 30px; }
  .qmv-grid { grid-template-columns: 1fr; }
  .historia-inner { grid-template-columns: 1fr; gap: 26px; }
  .historia-foto { aspect-ratio: 16 / 10; }
  .aplikimi-grid { grid-template-columns: 1fr; }
  .teknologjia-grid { grid-template-columns: repeat(2, 1fr); }
  .org-stub, .org-lidhja { display: none; }
  .org-kolonat { grid-template-columns: 1fr 1fr; gap: 22px 14px; margin-top: 22px; }
  .org-kolona > .org-kuti:first-child { margin-top: 0; }
  .org-kolona > .org-kuti:first-child::before { display: none; }
}

/* ---------- Përshtatja për telefon ---------- */

@media (max-width: 860px) {
  /* menuja bëhet panel që hapet nga butoni */
  .nav-toggle-btn { display: flex; }

  .nav {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    background: #fff;
    border-bottom: 1px solid var(--line);
    box-shadow: var(--shadow);
    padding: 10px 4vw 18px;
    display: none;
  }

  .nav-toggle:checked ~ .nav { display: flex; }

  .nav-toggle:checked ~ .nav-toggle-btn span:nth-child(1) { transform: translateY(7.5px) rotate(45deg); }
  .nav-toggle:checked ~ .nav-toggle-btn span:nth-child(2) { opacity: 0; }
  .nav-toggle:checked ~ .nav-toggle-btn span:nth-child(3) { transform: translateY(-7.5px) rotate(-45deg); }

  .nav > a,
  .nav-item > a {
    display: block;
    padding: 13px 4px;
    border-bottom: 1px solid var(--line);
  }

  .nav > a::after,
  .nav-item > a::after { display: none; }

  .nav-item { display: flex; flex-direction: column; }

  .sub-menu {
    position: static;
    opacity: 1;
    visibility: visible;
    transform: none;
    border: none;
    box-shadow: none;
    padding: 0 0 6px 16px;
    min-width: 0;
  }

  .pse-media { order: 2; }
  .pse-pikat { grid-template-columns: 1fr; }

  .hapat { grid-template-columns: 1fr; }
  .quotes-grid { grid-template-columns: 1fr; }

  .fundi-grid { grid-template-columns: 1fr; gap: 34px; }

  .section-koka { flex-direction: column; align-items: flex-start; gap: 10px; }

  /* kutia pluskuese bëhet rreth i vogël, vetëm me ikonën */
  .kontakt-pluskues span { display: none; }
  .kontakt-pluskues { padding: 15px; }
}

@media (max-width: 560px) {
  .sherbimet-grid { grid-template-columns: 1fr; }
  .cert-grid { grid-template-columns: 1fr; }
  .teknologjia-grid { grid-template-columns: 1fr; }
  .hero-butonat .btn { width: 100%; }
}

/* ---------- Kërkimi i analizave të akredituara ----------
   Faqja "Laboratori": një kuti kërkimi mbi listën e akreditimit
   (akreditimi.json, mbushet nga kerkimi.js). Rezultatet përdorin
   të njëjtën tabelë si listat e laboratorëve. */

.kerkimi {
  max-width: 780px;
  margin: clamp(28px, 4vw, 44px) auto 0;
}

.kerkimi-fusha { position: relative; }

.kerkimi-fusha svg {
  position: absolute;
  left: 20px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--teal-dark);
  pointer-events: none;
}

.kerkimi-fusha input {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 15px 22px 15px 54px;
  font-family: inherit;
  font-size: 16px;
  color: var(--text);
  background: #fff;
  box-shadow: var(--shadow-sm);
  transition: border-color 0.2s, box-shadow 0.2s;
  -webkit-appearance: none;
  appearance: none;
}

.kerkimi-fusha input:focus {
  outline: none;
  border-color: var(--teal);
  box-shadow: 0 0 0 3px rgba(33, 150, 177, 0.12);
}

.kerkimi-info {
  margin: 12px 6px 0;
  min-height: 20px;
  font-size: 13.5px;
  color: #6f6580;
}

.kerkimi-rezultatet {
  margin-top: 12px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
}

.kerkimi-rezultatet:empty { display: none; }

.kerkimi-rezultatet .tabela-analizash td,
.kerkimi-rezultatet .tabela-analizash th { padding: 10px 14px; }

.kerkimi-rezultatet .tabela-analizash td:first-child { width: 40%; }

.kerkimi-rezultatet .tabela-analizash td:nth-child(2) {
  width: 32%;
  color: #6f6580;
  font-size: 13px;
}

.kerkimi-grupi {
  display: block;
  margin-top: 2px;
  font-size: 12px;
  font-weight: 400;
  color: #6f6580;
}

.kerkimi-asgje {
  margin: 0;
  padding: 22px 20px;
  font-size: 15px;
}

.kerkimi-asgje a { color: var(--teal-dark); font-weight: 600; }

.kerkimi-shenim {
  margin: 14px 6px 0;
  font-size: 12.5px;
  color: #6f6580;
  text-align: center;
}

.kerkimi-shenim a { color: var(--teal-dark); }

@media (max-width: 640px) {
  .kerkimi-rezultatet thead { display: none; }
  .kerkimi-rezultatet .tabela-analizash td {
    display: block;
    text-align: left;
    padding: 4px 14px;
    border-bottom: none;
  }
  .kerkimi-rezultatet .tabela-analizash td:first-child { padding-top: 12px; }
  .kerkimi-rezultatet .tabela-analizash td:last-child {
    padding-bottom: 12px;
    border-bottom: 1px solid #f0ecf4;
  }
}

/* ---------- Ndërrimi i gjuhës në menu ----------
   Flamur i vogël dhe kodi i gjuhës (AL / EN), pak më larg nga zërat e menusë. */

.nav > a.nav-gjuha {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-left: clamp(10px, 1.6vw, 26px);
  font-size: 14px;
  letter-spacing: 0.05em;
}

.nav-gjuha img {
  width: 22px;
  height: 15px;
  object-fit: cover;
  border-radius: 2px;
  box-shadow: 0 0 0 1px var(--line);
}

/* faqet ligjore s'kanë menu: ndërruesi i gjuhës rri pranë "Kthehuni te kreu" */
.kthim-grup {
  display: flex;
  align-items: center;
  gap: clamp(14px, 2vw, 26px);
}

.kthim-grup .nav-gjuha {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.12em;
  color: var(--ink);
}
.kthim-grup .nav-gjuha:hover { color: var(--teal-dark); }

@media (max-width: 520px) {
  .kthim-grup { flex-direction: column; align-items: flex-end; gap: 6px; }
}

@media (max-width: 860px) {
  .nav > a.nav-gjuha {
    display: flex;
    margin-left: 0;
    margin-top: 6px;
    border-bottom: none;
  }
}

/* ---------- Printimi ----------
   Klientët printojnë listat e analizave: letra mban emrin dhe
   përmbajtjen, pa menu, hero, hartë e fund faqeje. Vetëm seksionet
   e hapura të akordionit dalin në letër (kufizim i shfletuesve). */

@media print {
  .nav, .nav-toggle-btn, .hero, .banderola, .besimi,
  .bashkepunoni, .ftesa, .fundi, .socials,
  .kontakt-pluskues, .harta-kuadri, .vija-diagonale { display: none !important; }

  .koka { position: static; background: #fff; }

  body { color: #000; }
  .section { padding: 18px 0; }

  .qmv-karte, .sherbim-karte, .karte, .hapi, .quote-karte, .cert-karte,
  .forma, .aplikimi-karte { box-shadow: none; border: 1px solid #ccc; }
}