/* =========================================================
   DEOS&K — Stilet kryesore (mbi Bootstrap 5.3 + Bootstrap Icons)
   ---------------------------------------------------------
   FONTET: Caelia, Minion 3 dhe Gill Sans Nova janë fonte me licencë
   (Adobe Fonts / Monotype). Këtu përdoren zëvendësues falas nga
   Google Fonts. Kur të keni licencën web, ndryshoni vetëm 3 variablat
   --f-display / --f-serif / --f-ui më poshtë.
   ========================================================= */

:root {
  /* Ngjyrat e brandit */
  --ink: #0e0e0e;
  --ink-2: #171615;
  --paper: #ffffff;
  --sand: #ccb093;          /* KUJDES: mos e përdor si ngjyrë teksti mbi të bardhë (kontrast 2:1) */
  --sand-light: #e2d0bc;
  --sand-deep: #8a6d4a;     /* varianti i errët i sand-it për tekst/link (kontrast 4.9:1) */
  --sand-wash: #f6f1ea;     /* sfond i butë seksionesh */
  --stone: #5f5f5f;         /* tekst dytësor */
  --line: #e7e1d7;
  --line-dark: rgba(255,255,255,.12);

  /* Tipografia: një familje e vetme (Cabin, si te etiketat "Pasuri të paluajtshme · Tiranë"), e zgjedhur nga klienti.
     --f-display / --f-serif mbeten si emra që rregullat ekzistuese të mos ndryshojnë. */
  --f-ui: "Cabin", "Gill Sans Nova", "Gill Sans", "Segoe UI", sans-serif;
  --f-display: var(--f-ui);
  --f-serif: var(--f-ui);

  --t-sm: 0.875rem;
  --t-base: 1.0625rem;
  --t-lg: clamp(1.125rem, 1.05rem + 0.35vw, 1.3rem);
  --t-h3: clamp(1.375rem, 1.2rem + 0.6vw, 1.75rem);
  --t-h2: clamp(2rem, 1.4rem + 2vw, 3.25rem);
  --t-h1: clamp(2.75rem, 1.6rem + 4.6vw, 6rem);

  --header-h: 84px;
  --radius: 4px;
  --radius-lg: 14px;
  --section-y: clamp(3rem, 2.25rem + 3.2vw, 6rem);
  --gutter: 1.25rem;
  --ease: cubic-bezier(.22,.8,.2,1);
  --ease-in-out: cubic-bezier(.77,0,.18,1);
  --shadow-sm: 0 2px 10px rgba(14,14,14,.06);
  --shadow-lg: 0 30px 60px -20px rgba(14,14,14,.25);

  /* Bootstrap overrides */
  --bs-body-font-family: var(--f-serif);
  --bs-body-font-size: var(--t-base);
  --bs-body-line-height: 1.7;
  --bs-body-color: var(--ink);
  --bs-link-color-rgb: 14, 14, 14;
  --bs-link-hover-color-rgb: 138, 109, 74;
  --bs-border-color: var(--line);
  --bs-border-radius: var(--radius);
}

html { scroll-padding-top: calc(var(--header-h) + 16px); }
body { background: var(--paper); text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; overflow-x: hidden; overflow-x: clip; }
html { overflow-x: clip; }   /* elementet që hyjnë anash (data-reveal left/right) nuk zgjerojnë faqen në celular */
::selection { background: var(--sand); color: var(--ink); }

/* Scrollbar-i sipas paletës; ::-webkit-scrollbar vetëm për Safari / Chrome < 121 (pa scrollbar-color) */
html { scrollbar-color: var(--sand) var(--sand-wash); }
.dlg-dark, .dlg-dark * { scrollbar-color: rgba(204,176,147,.55) transparent; }
@supports not (scrollbar-color: auto) {
  ::-webkit-scrollbar { width: 12px; height: 12px; }
  ::-webkit-scrollbar-track { background: var(--sand-wash); }
  ::-webkit-scrollbar-thumb { background: var(--sand); border: 3px solid var(--sand-wash); border-radius: 999px; }
  ::-webkit-scrollbar-thumb:hover { background: var(--sand-deep); }
  .dlg-dark ::-webkit-scrollbar-track, .dlg-dark::-webkit-scrollbar-track { background: transparent; }
  .dlg-dark ::-webkit-scrollbar-thumb, .dlg-dark::-webkit-scrollbar-thumb { background: rgba(204,176,147,.55); border-color: transparent; }
}

h1, h2, h3, h4, .h1, .h2, .h3, .h4 {
  font-family: var(--f-display);
  font-weight: 500;
  letter-spacing: -0.02em;
  line-height: 1.1;
}
p { max-width: 68ch; }
em { font-style: normal; }   /* Cabin pa italik: theksimi bëhet me ngjyrë (sand), jo me kursiv të simuluar */
a { text-underline-offset: 0.2em; text-decoration-thickness: 1px; transition: color .25s; }
img { max-width: 100%; height: auto; }

.small-ui, .breadcrumb, .btn { font-family: var(--f-ui); }
.small-ui { font-size: var(--t-sm); }

:focus-visible { outline: 2px solid var(--sand-deep); outline-offset: 3px; }

.skip-link {
  position: absolute; left: 1rem; top: -100px; z-index: 3000;
  background: var(--ink); color: var(--paper); padding: .5rem 1rem; font-family: var(--f-ui);
}
.skip-link:focus { top: 1rem; }

/* ---------- Shiriti i progresit të scroll-it ---------- */
.scroll-progress { position: fixed; top: 0; left: 0; height: 2px; width: 100%; z-index: 2000; background: var(--sand); transform-origin: left; transform: scaleX(0); }

/* ---------- Dritaret: e njëjta strukturë kudo ----------
   .dlg (e çelët) / .dlg.dlg-dark (e errët) → .dlg-head [.dlg-title (ikonë + titull + <small>)] [.dlg-btn … .dlg-close] → përmbajtja → .dlg-foot
   Përdoret nga: lightbox-i i fotove, menuja mobile, paneli i filtrave, paneli i hartës. */
.dlg { --dlg-fg: var(--ink); --dlg-inv: var(--paper); --dlg-muted: var(--stone); --dlg-line: var(--line); --dlg-chip: var(--sand-wash); --dlg-chip-fg: var(--sand-deep); --dlg-px: 1.25rem; }
.dlg-dark { --dlg-fg: var(--paper); --dlg-inv: var(--ink); --dlg-muted: rgba(255,255,255,.55); --dlg-line: rgba(255,255,255,.1); --dlg-chip: rgba(204,176,147,.15); --dlg-chip-fg: var(--sand); }
.dlg-head {
  display: flex; align-items: center; gap: .9rem; min-height: 68px; color: var(--dlg-fg);
  padding: calc(.75rem + env(safe-area-inset-top)) var(--dlg-px) .75rem; border-bottom: 1px solid var(--dlg-line);
}
.dlg-title { display: flex; align-items: center; gap: .75rem; min-width: 0; margin: 0; font-family: var(--f-display); font-weight: 600; font-size: 1.15rem; line-height: 1.2; color: inherit; }
.dlg-title > .bi { flex: 0 0 38px; height: 38px; border-radius: 50%; display: grid; place-content: center; background: var(--dlg-chip); color: var(--dlg-chip-fg); font-size: 1rem; }
.dlg-title > span { min-width: 0; }
.dlg-title small { display: block; font-family: var(--f-ui); font-weight: 400; font-size: .8125rem; color: var(--dlg-muted); margin-top: .15rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dlg-btn, .dlg-close {
  flex: 0 0 auto; width: 42px; height: 42px; padding: 0; border-radius: 50%; border: 1px solid var(--dlg-line); background: transparent;
  color: var(--dlg-fg); display: grid; place-content: center; font-size: 1rem; transition: background-color .25s, border-color .25s, color .25s, transform .35s var(--ease);
}
.dlg-close { margin-left: auto; }
.dlg-btn:hover, .dlg-btn[aria-pressed="true"], .dlg-close:hover { background: var(--dlg-fg); border-color: var(--dlg-fg); color: var(--dlg-inv); }
.dlg-close:hover { transform: rotate(90deg); }
.dlg-btn:focus-visible, .dlg-close:focus-visible { outline: 2px solid var(--sand); outline-offset: 2px; }
.dlg-foot { border-top: 1px solid var(--dlg-line); padding: .9rem var(--dlg-px) calc(.9rem + env(safe-area-inset-bottom)); }
@media (max-width: 575.98px) { .dlg-head { min-height: 60px; } .dlg-btn, .dlg-close { width: 40px; height: 40px; } }

/* ---------- Butonat ---------- */
.btn {
  border-radius: var(--radius); font-weight: 500; letter-spacing: .02em; padding: .85rem 1.6rem; font-size: 1rem;
  display: inline-flex; align-items: center; justify-content: center; gap: .6rem;
  position: relative; overflow: hidden; isolation: isolate;
  transition: color .35s var(--ease), background-color .35s var(--ease), border-color .35s var(--ease), transform .35s var(--ease);
}
.btn .bi { font-size: 1.05em; transition: transform .35s var(--ease); }
.btn:hover .bi-arrow-right, .btn:hover .bi-arrow-up-right { transform: translateX(4px); }
.btn-sm { padding: .45rem 1rem; font-size: .875rem; }
.btn-lg { padding: 1.05rem 2rem; font-size: 1.0625rem; }
/* efekt "fill" nga poshtë */
.btn-brand, .btn-sand, .btn-ghost-light, .btn-outline-dark { --fill: var(--sand); }
.btn-brand::before, .btn-sand::before, .btn-ghost-light::before, .btn-outline-dark::before {
  content: ""; position: absolute; inset: 0; z-index: -1; background: var(--fill);
  transform: translateY(101%); transition: transform .45s var(--ease);
}
.btn-brand:hover::before, .btn-sand:hover::before, .btn-ghost-light:hover::before, .btn-outline-dark:hover::before,
.btn-brand:focus-visible::before, .btn-sand:focus-visible::before { transform: translateY(0); }

.btn-brand { background: var(--ink); color: var(--paper); border: 1px solid var(--ink); }
.btn-brand:hover, .btn-brand:focus-visible { background: var(--ink); color: var(--ink); border-color: var(--sand); }
.btn-outline-dark { --bs-btn-border-color: var(--ink); --bs-btn-color: var(--ink); --bs-btn-hover-bg: transparent; --bs-btn-hover-color: var(--paper); --bs-btn-active-bg: var(--ink); --fill: var(--ink); }
.btn-sand { background: var(--sand); color: var(--ink); border: 1px solid var(--sand); --fill: var(--paper); }
.btn-sand:hover { background: var(--sand); color: var(--ink); border-color: var(--paper); }
.btn-ghost-light { color: var(--paper); border: 1px solid rgba(255,255,255,.45); --fill: var(--paper); }
.btn-ghost-light:hover { color: var(--ink); border-color: var(--paper); }

.link-arrow {
  font-family: var(--f-ui); color: var(--ink); text-decoration: none; display: inline-flex; align-items: center; gap: .5rem;
  font-weight: 500; position: relative; padding-bottom: .2rem;
}
.link-arrow::after { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; background: currentColor; transform-origin: right; transition: transform .45s var(--ease); }
.link-arrow:hover::after { transform: scaleX(0); }
.link-arrow .bi { transition: transform .35s var(--ease); }
.link-arrow:hover .bi { transform: translateX(5px); }

/* ---------- Etiketat e seksioneve ---------- */
.eyebrow {
  font-family: var(--f-ui); font-size: .8125rem; letter-spacing: .22em; text-transform: uppercase; font-weight: 500;
  color: var(--sand-deep); display: inline-flex; align-items: center; gap: .8rem; margin-bottom: 1.1rem;
}
.eyebrow::before { content: ""; width: 34px; height: 1px; background: currentColor; }
.on-dark .eyebrow, .eyebrow.light { color: var(--sand); }

/* ---------- Header ---------- */
.site-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 1030;
  height: var(--header-h);
  display: flex; align-items: center;
  background: rgba(255,255,255,.92);
  backdrop-filter: saturate(160%) blur(14px);
  -webkit-backdrop-filter: saturate(160%) blur(14px);
  border-bottom: 1px solid transparent;
  transition: background-color .4s, border-color .4s, height .4s var(--ease), transform .5s var(--ease);
}
body { padding-top: var(--header-h); }
.has-hero { padding-top: 0; }
.site-header.is-scrolled { border-bottom-color: var(--line); --header-h: 70px; height: 70px; box-shadow: var(--shadow-sm); }
.site-header.is-hidden { transform: translateY(-100%); }
.brand { display: block; position: relative; }
.brand img { height: 54px; width: auto; display: block; transition: height .4s var(--ease), opacity .3s; }
.is-scrolled .brand img { height: 46px; }
.brand .logo-light { position: absolute; inset: 0; opacity: 0; }

/* Header transparent mbi hero */
.has-hero .site-header:not(.is-scrolled) { background: transparent; backdrop-filter: none; -webkit-backdrop-filter: none; }
.has-hero .site-header:not(.is-scrolled) .logo-dark { opacity: 0; }
.has-hero .site-header:not(.is-scrolled) .logo-light { opacity: 1; }
.has-hero .site-header:not(.is-scrolled) .nav-link-x,
.has-hero .site-header:not(.is-scrolled) .header-phone { color: var(--paper); }
.has-hero .site-header:not(.is-scrolled) .menu-toggle span { background: var(--paper); }
.has-hero .site-header:not(.is-scrolled) .btn-brand { background: transparent; border-color: rgba(255,255,255,.5); }

.main-nav { gap: 2.4rem; }
.nav-link-x {
  font-family: var(--f-ui); font-size: .975rem; color: var(--ink); text-decoration: none; letter-spacing: .02em;
  padding: .35rem 0; position: relative;
}
.nav-link-x::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--sand);
  transform: scaleX(0); transform-origin: right; transition: transform .45s var(--ease);
}
.nav-link-x:hover::after, .nav-link-x.active::after { transform: scaleX(1); transform-origin: left; }
.header-phone { font-family: var(--f-ui); font-size: .95rem; text-decoration: none; color: var(--ink); display: inline-flex; align-items: center; gap: .5rem; }
.header-phone .bi { width: 34px; height: 34px; border-radius: 50%; display: grid; place-content: center; border: 1px solid currentColor; opacity: .8; font-size: .85rem; }

/* Ndërruesi i gjuhës (gjuhët vijnë nga SITE.languages te data.js – shtohen pa ndryshuar CSS) */
.lang-btn {
  display: inline-flex; align-items: center; gap: .35rem; height: 36px; padding: 0 .75rem;
  border: 1px solid var(--line); border-radius: 999px; background: transparent; color: var(--ink);
  font-family: var(--f-ui); font-size: .85rem; font-weight: 500; letter-spacing: .04em; transition: border-color .25s, background-color .25s, color .25s;
}
.lang-btn:hover, .lang-btn[aria-expanded="true"] { border-color: var(--ink); }
.lang-btn .bi-chevron-down { font-size: .65rem; transition: transform .25s var(--ease); }
.lang-btn[aria-expanded="true"] .bi-chevron-down { transform: rotate(180deg); }
.has-hero .site-header:not(.is-scrolled) .lang-btn { color: var(--paper); border-color: rgba(255,255,255,.45); }
.has-hero .site-header:not(.is-scrolled) .lang-btn:hover { border-color: var(--paper); }
.lang-menu { min-width: 180px; padding: .35rem; margin-top: .5rem !important; border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); font-family: var(--f-ui); }
.lang-menu .dropdown-item { display: flex; align-items: center; gap: .7rem; padding: .55rem .75rem; border-radius: 8px; font-size: .95rem; color: var(--ink); }
.lang-menu .dropdown-item:hover { background: var(--sand-wash); }
.lang-menu .dropdown-item.active, .lang-menu .dropdown-item:active { background: var(--ink); color: var(--paper); }
.lang-flag { flex: none; width: 20px; height: 15px; border-radius: 2px; object-fit: cover; box-shadow: 0 0 0 1px rgba(14,14,14,.12); }
@media (max-width: 575.98px) { .lang-btn { height: 40px; padding: 0 .7rem; } }
/* Menuja në celular */
.lang-mobile { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1.25rem; }
.mobile-contact .lang-pill { display: inline-flex; align-items: center; gap: .5rem; padding: .45rem .9rem; border: 1px solid rgba(255,255,255,.25); border-radius: 999px; }
.mobile-contact .lang-pill.active { background: var(--sand); border-color: var(--sand); color: var(--ink); }

.menu-toggle { width: 44px; height: 44px; border: 0; background: none; display: grid; place-content: center; gap: 7px; }
.menu-toggle span { display: block; width: 26px; height: 2px; background: var(--ink); transition: transform .3s var(--ease), width .3s; }
.menu-toggle span:last-child { width: 18px; justify-self: end; }
.menu-toggle:hover span:last-child { width: 26px; }

.mobile-nav { --bs-offcanvas-width: min(90vw, 420px); background: var(--ink); color: var(--paper); }
.mobile-nav .offcanvas-body { padding: .5rem var(--dlg-px) 1rem; }
.mobile-nav .dlg-foot { display: grid; gap: .15rem; }
.mobile-nav-logo { height: 42px; width: auto; }
.mobile-link {
  font-family: var(--f-display); font-size: 2rem; font-weight: 600; color: var(--paper);
  text-decoration: none; padding: .7rem 0; border-bottom: 1px solid var(--line-dark);
  display: flex; justify-content: space-between; align-items: center;
  opacity: 0; transform: translateX(30px); transition: opacity .5s var(--ease), transform .5s var(--ease), color .25s;
}
.mobile-link .bi { font-size: 1.2rem; color: var(--sand); }
.mobile-link:hover, .mobile-link.active { color: var(--sand); }
.mobile-nav.show .mobile-link { opacity: 1; transform: none; }
.mobile-nav.show .mobile-link:nth-child(2) { transition-delay: .06s; }
.mobile-nav.show .mobile-link:nth-child(3) { transition-delay: .12s; }
.mobile-nav.show .mobile-link:nth-child(4) { transition-delay: .18s; }
.mobile-contact a { color: var(--paper); text-decoration: none; display: flex; gap: .7rem; align-items: center; padding: .35rem 0; }
.mobile-contact .bi { color: var(--sand); }

/* ---------- Seksionet ---------- */
.section { padding-block: var(--section-y); position: relative; }
.section-wash { background: var(--sand-wash); }
.section-dark { background: var(--ink); color: var(--paper); }
.section-dark p { color: rgba(255,255,255,.75); }
.section-title { font-size: var(--t-h2); margin-bottom: 1rem; }
.section-intro { font-size: var(--t-lg); color: var(--stone); max-width: 52ch; }
.section-dark .section-intro { color: rgba(255,255,255,.7); }
.section-head { display: flex; justify-content: space-between; align-items: end; gap: 1rem 2rem; flex-wrap: wrap; margin-bottom: clamp(1.5rem, 1.25rem + 1.25vw, 2.75rem); }
.section-head .section-title { margin-bottom: 0; }
.lead-serif { font-size: var(--t-lg); line-height: 1.55; color: #2a2a2a; }

/* ---------- HERO ---------- */
/* Lartësia si te kokat e faqeve të tjera (Rreth nesh): sa përmbajtja + hapësira, jo ekran i plotë */
.hero {
  position: relative; display: flex; align-items: flex-end; color: var(--paper);
  padding-block: calc(var(--header-h) + clamp(2rem, 1.5rem + 3vw, 4.5rem)) calc(clamp(2rem, 1.5rem + 2.5vw, 3.75rem) + var(--car-lift, var(--car-lift-est))); overflow: hidden; background: var(--hero-navy);
  --hero-navy: #0c2038;     /* blu e errët nga qielli i imazhit: errëson pa e bërë foton gri */
}
.hero-bg { position: absolute; inset: 0; z-index: 0; }
/* Imazhi i kreut (16:9, ditë me qiell blu): pa zmadhim të tepërt, që të duket sa më shumë nga pamja.
   Animacioni vetëm 1.03 → 1 nga lart (maja e kullës s'shtyhet nën menu). Lëvizja e parallax-it (deri 40px poshtë)
   mbetet gjithmonë nën kokën e faqes, prandaj lartësia 100% mjafton. */
.hero-bg img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 0%; transform-origin: 50% 0; animation: kenburnsSoft 10s var(--ease) both; will-change: transform; }
@keyframes kenburnsSoft { from { transform: scale(1.03); } to { transform: scale(1); } }
@keyframes kenburns { from { transform: scale(1.18); } to { transform: scale(1.02); } }
/* Tonet blu (jo të zeza) që përputhen me qiellin: lart për menunë, majtas për tekstin, poshtë për kartat */
.hero::before {
  content: ""; position: absolute; inset: 0; z-index: 1;
  background:
    linear-gradient(180deg, rgba(12,32,56,.6) 0%, rgba(12,32,56,0) 24%, rgba(12,32,56,0) 55%, rgba(12,32,56,.55) 100%),
    linear-gradient(90deg, rgba(12,32,56,.78) 0%, rgba(12,32,56,.5) 32%, rgba(12,32,56,0) 58%);
}
.hero-title, .hero-text, .hero .eyebrow { text-shadow: 0 2px 18px rgba(12,32,56,.45); }
.hero .container-xl { position: relative; z-index: 2; }
.hero-title { font-size: clamp(2.6rem, 1.6rem + 3.6vw, 5rem); line-height: 1.02; letter-spacing: -0.03em; margin-bottom: 1.1rem; max-width: 18ch; }
.hero-title .line { display: block; overflow: hidden; padding-bottom: .06em; }
.hero-title .line > span { display: block; animation: heroLine 1.2s var(--ease) both; }
/* Fjala e theksuar: i njëjti font (Cabin) në kursiv, me ngjyrë rëre */
.hero-title em { font-family: var(--f-display); font-style: italic; font-weight: 500; color: var(--sand); padding-right: .04em; }
.hero-title .line:has(em) { padding-bottom: .16em; margin-bottom: -.1em; }   /* vend për bishtin e "j" */
.hero-title .line:nth-child(2) > span { animation-delay: .12s; }
@keyframes heroLine { from { transform: translateY(110%); } }
.hero-text { font-size: var(--t-lg); color: rgba(255,255,255,.9); max-width: 46ch; }
/* Desktop: kreu më i ulët (më pak hapësirë, titull pak më i vogël, paragrafi në një rresht),
   që karuseli të duket i plotë pa scroll */
@media (min-width: 992px) {
  .hero { padding-block: calc(var(--header-h) + clamp(1rem, .25rem + 1.5vw, 2rem)) calc(1.5rem + var(--car-lift, var(--car-lift-est))); }
  .hero-title { font-size: clamp(2.6rem, 1.6rem + 2.6vw, 4.1rem); margin-bottom: .75rem; }
  .hero-text { max-width: 62ch; margin-bottom: 0; }
  .hero .eyebrow { margin-bottom: .6rem; }
}
/* Laptopë me ekran të ulët (p.sh. 1366×768): titull dhe paragraf edhe pak më të vegjël */
@media (min-width: 992px) and (max-height: 820px) {
  .hero { padding-top: calc(var(--header-h) + .5rem); }
  .hero-title { font-size: clamp(2.4rem, 1.4rem + 2.2vw, 3.4rem); }
  .hero-text { font-size: 1.05rem; }
}
/* Animacionet e kreut janë vetëm CSS: nisin me vizatimin e parë, pa pritur JS-në (Speed Index / LCP në celular) */
.hero-fade { animation: heroFade 1s var(--ease) calc(.5s + var(--d, 0s)) both; }
@keyframes heroFade { from { opacity: 0; transform: translateY(24px); } }


/* ---------- Rreth nesh (kompozim me imazhe) ---------- */
.about-media { position: relative; padding: 0 12% 14% 0; }
.about-media .img-main { aspect-ratio: 4 / 5; overflow: hidden; border-radius: var(--radius); }
.about-media .img-float { position: absolute; right: 0; bottom: 0; width: 52%; aspect-ratio: 1; overflow: hidden; border: 10px solid var(--paper); border-radius: var(--radius); box-shadow: var(--shadow-lg); }
.about-media img { width: 100%; height: 100%; object-fit: cover; }
.about-media .img-main img[src*="rreth-kulla"] { object-position: 76% 50%; }   /* kulla është djathtas në foto */
.about-media .img-float.is-video { width: 40%; aspect-ratio: 9 / 16; background: var(--ink); }
.about-media video { display: block; width: 100%; height: 100%; object-fit: cover; }
.vid-toggle { position: absolute; right: .6rem; bottom: .6rem; z-index: 2; }

.check-list { list-style: none; padding: 0; margin: 1.25rem 0 1.75rem; display: grid; gap: .75rem; }
.check-list li { display: flex; gap: .9rem; align-items: flex-start; font-size: 1.0625rem; }
.check-list .bi { flex: 0 0 30px; height: 30px; display: grid; place-content: center; border-radius: 50%; background: var(--sand-wash); color: var(--sand-deep); font-size: 1rem; margin-top: .1rem; }

/* ---------- Karta e pronës ---------- */
.prop-card { height: 100%; background: var(--paper); border-radius: var(--radius); transition: transform .5s var(--ease), box-shadow .5s var(--ease); }
.prop-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.prop-link { display: flex; flex-direction: column; color: inherit; text-decoration: none; height: 100%; }
.prop-media { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: var(--sand-wash); border-radius: var(--radius) var(--radius) 0 0; }
.prop-media img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
.prop-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 55%, rgba(14,14,14,.45)); opacity: .7; transition: opacity .5s; }
.prop-link:hover .prop-media img { transform: scale(1.08); }
.prop-link:hover .prop-media::after { opacity: 1; }
.prop-view {
  position: absolute; right: 1rem; bottom: 1rem; z-index: 2; width: 46px; height: 46px; border-radius: 50%;
  background: var(--paper); color: var(--ink); display: grid; place-content: center; font-size: 1.1rem;
  transform: scale(.6) rotate(-45deg); opacity: 0; transition: all .5s var(--ease);
}
.prop-link:hover .prop-view { transform: none; opacity: 1; }
.prop-body { padding: 1.4rem 1.4rem 1.3rem; display: flex; flex-direction: column; flex: 1; border: 1px solid var(--line); border-top: 0; border-radius: 0 0 var(--radius) var(--radius); }
.section-wash .prop-body { border-color: transparent; }
.prop-project { font-family: var(--f-ui); font-size: .78rem; letter-spacing: .16em; text-transform: uppercase; color: var(--sand-deep); margin-bottom: .45rem; }
.prop-title { font-size: var(--t-h3); margin-bottom: .3rem; }
.prop-loc { color: var(--stone); font-size: 1rem; margin-bottom: 1.1rem; display: flex; gap: .4rem; align-items: center; }
.prop-loc .bi { color: var(--sand-deep); }
.prop-facts {
  display: grid; grid-template-columns: repeat(3, auto); justify-content: space-between; column-gap: 1rem;
  border-top: 1px solid var(--line); padding-top: 1rem; margin: auto 0 0;
}
.prop-facts dt { font-family: var(--f-ui); font-weight: 400; font-size: .78rem; color: var(--stone); display: flex; gap: .35rem; align-items: center; }
.prop-facts dt .bi { color: var(--sand-deep); }
.prop-facts dd { font-family: var(--f-ui); font-size: .975rem; font-weight: 500; margin: .15rem 0 0; }

.status {
  position: absolute; left: 1rem; top: 1rem; z-index: 2; border-radius: 999px;
  font-family: var(--f-ui); font-size: .78rem; letter-spacing: .04em; padding: .35rem .8rem; background: var(--paper); color: var(--ink);
  display: inline-flex; align-items: center; gap: .4rem;
}
.status::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #3aa76d; }
/* Unaza që pulson: transform + opacity (GPU), jo box-shadow (ri-vizatim në çdo frame) */
.status.is-available::after { content: ""; position: absolute; left: .8rem; top: 50%; width: 7px; height: 7px; margin-top: -3.5px; border-radius: 50%; background: rgba(58,167,109,.6); animation: pulse 2s infinite; pointer-events: none; }
.status.is-reserved { background: var(--sand); }
.status.is-reserved::before { background: var(--ink); }
.status.is-sold { background: var(--ink); color: var(--paper); }
.status.is-sold::before { background: #c9574a; }
@keyframes pulse { 0% { transform: scale(1); opacity: 1; } 70%, 100% { transform: scale(3); opacity: 0; } }

/* ---------- Karuseli i pronave (kreu) ---------- */
/* --car-lift = gjysma e lartësisë së kartës (main.js e mat); seksioni ngjitet aq lart mbi kreun.
   Para JS-së përdoret --car-lift-est: gjysma e kartës e llogaritur nga gjerësia e ekranit
   (imazhi 4:3 → 0.375 × gjerësia e kartës + ~92px gjysma e tekstit), që faqja të mos kërcejë gjatë ngarkimit */
:root { --car-lift-est: calc(min(100vw, 1320px) * .0833 + 64px); }              /* 4 karta, imazh 3:2 */
@media (max-width: 1199.98px) { :root { --car-lift-est: calc(11.11vw + 65px); } }  /* 3 karta, imazh 3:2 */
@media (max-width: 767.98px) { :root { --car-lift-est: calc(23.25vw + 82px); } }  /* 62% */
@media (max-width: 575.98px) { :root { --car-lift-est: calc(27vw + 83px); } }     /* 72% */
.car-section {
  z-index: 3; margin-top: calc(-1 * var(--car-lift, var(--car-lift-est))); padding-top: 0;
  background: linear-gradient(transparent var(--car-lift, var(--car-lift-est)), var(--sand-wash) 0);
}
.car-ctrl { display: flex; gap: .5rem; }
.car-btn {
  width: 52px; height: 52px; border-radius: 50%; border: 1px solid var(--ink); background: transparent; color: var(--ink);
  display: grid; place-content: center; font-size: 1.15rem; transition: background-color .3s, color .3s, transform .3s var(--ease);
}
.car-btn:hover { background: var(--ink); color: var(--paper); }
.car-btn:active { transform: scale(.93); }
.car-btn[hidden] { display: none; }
.car-track {
  --per: 4; --gap: clamp(1rem, .6rem + 1.2vw, 1.75rem);
  display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - (var(--per) - 1) * var(--gap)) / var(--per)); gap: var(--gap);
  overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none;   /* pa scroll-snap: lëvizja automatike është e vazhdueshme */
  padding: 1.5rem 28px 3.5rem; margin: -1.5rem -28px -3.5rem; scroll-padding-inline: 28px;   /* vend për zmadhimin + hijen e errët të kartës (pa u prerë nga overflow) */
  cursor: grab; -webkit-user-select: none; user-select: none;
}
.car-track::-webkit-scrollbar { display: none; }
.car-track.is-dragging { cursor: grabbing; scroll-snap-type: none; }
.car-track.is-dragging .prop-card { pointer-events: none; }
.car-slide { min-width: 0; }
/* Karta kompakte: pa çmim ("Me kërkesë"), tekst më i vogël */
.car-slide .prop-body { padding: 1rem 1.1rem .95rem; }
.car-slide .prop-project { font-size: .7rem; margin-bottom: .3rem; }
.car-slide .prop-title { font-size: clamp(1.15rem, 1.05rem + .35vw, 1.35rem); }
.car-slide .prop-loc { font-size: .9rem; margin-bottom: .8rem; }
.car-slide .prop-facts { grid-template-columns: repeat(2, auto); padding-top: .75rem; }
.car-slide .prop-facts > div:nth-child(3) { display: none; }
.car-slide .prop-facts dd { font-size: .9rem; }
.car-slide .status { font-size: .72rem; padding: .3rem .7rem; }
/* Tablet/desktop: karta më e ulët (imazh 3:2 në vend të 4:3, tekst më kompakt), që karuseli të duket i plotë */
@media (min-width: 768px) {
  .car-slide .prop-media { aspect-ratio: 3 / 2; }
  .car-slide .prop-body { padding: .8rem 1rem .75rem; }
  .car-slide .prop-project { margin-bottom: .2rem; }
  .car-slide .prop-title { font-size: clamp(1.1rem, 1rem + .3vw, 1.25rem); margin-bottom: .2rem; }
  .car-slide .prop-loc { font-size: .85rem; margin-bottom: .55rem; }
  .car-slide .prop-facts { padding-top: .55rem; }
  .car-slide .prop-facts dt { font-size: .72rem; }
  .car-slide .prop-facts dd { font-size: .85rem; margin-top: .05rem; }
}
.car-foot { display: flex; align-items: center; gap: 1rem 1.5rem; margin-top: clamp(1.5rem, 1.25rem + 1vw, 2.25rem); }
.car-progress { flex: 1; height: 2px; background: var(--line); overflow: hidden; }
.car-progress span { display: block; height: 100%; width: 0; background: var(--ink); transition: transform .4s var(--ease), width .4s var(--ease); }
.car-foot .link-arrow { white-space: nowrap; }
/* Fokusi te karta: korniza sand + zmadhim i lehtë; kartat e tjera zbehen që vëmendja të shkojë te prona */
/* Kartat hipin mbi imazhin e kreut: kornizë e hollë + hije e errët me shtresa (afër, mesme, e largët), që karta
   dallohet edhe kur imazhi i saj ka të njëjtat ngjyra si sfondi. Hija s'kalon 3.5rem poshtë / 28px anash (padding-u i track-ut) */
.car-slide .prop-card {
  --rx: 0deg; --ry: 0deg; position: relative; isolation: isolate;
  --card-shadow: 0 0 0 1px rgba(8,18,32,.16), 0 2px 4px rgba(8,18,32,.22), 0 10px 16px -6px rgba(8,18,32,.4), 0 26px 36px -18px rgba(8,18,32,.72);
  box-shadow: var(--card-shadow);
  transition: transform .6s var(--ease), box-shadow .5s var(--ease), opacity .45s var(--ease), filter .45s var(--ease);
}
/* Drita që ndjek mausin (efekti 3D, main.js vendos --gx/--gy) */
.car-slide .prop-card::after {
  content: ""; position: absolute; inset: 0; z-index: 3; border-radius: inherit; pointer-events: none; opacity: 0; transition: opacity .4s var(--ease);
  background: radial-gradient(circle at var(--gx, 50%) var(--gy, 0%), rgba(255,255,255,.38), rgba(255,255,255,0) 55%);
  mix-blend-mode: soft-light;
}
.car-slide .prop-card.is-tilting { transition: transform .12s linear, box-shadow .5s var(--ease), opacity .45s var(--ease), filter .45s var(--ease); }
.car-slide .prop-card.is-tilting::after { opacity: 1; }
.car-slide .prop-card:focus-within { box-shadow: 0 0 0 2px var(--sand), var(--card-shadow); }
/* Vija midis imazhit dhe tekstit: planimetritë kanë sfond të bardhë dhe përndryshe shkrihen me kartën */
.car-slide .prop-body { border-top: 1px solid var(--line); }
@media (hover: hover) {
  .car-slide .prop-card:hover { transform: perspective(1000px) rotateX(var(--rx)) rotateY(var(--ry)) translateY(-6px) scale(1.035); box-shadow: 0 0 0 2px var(--sand), 0 4px 8px rgba(8,18,32,.25), 0 30px 40px -18px rgba(8,18,32,.78); z-index: 1; position: relative; }
  .car-track:has(.prop-card:hover) .car-slide:not(:hover) .prop-card { opacity: .5; filter: saturate(.5); transform: scale(.97); }
  .car-slide .prop-card:hover .prop-view { background: var(--sand); }
}
@media (prefers-reduced-motion: reduce) { .car-slide .prop-card:hover { transform: none; } .car-track:has(.prop-card:hover) .car-slide:not(:hover) .prop-card { transform: none; } }
@media (max-width: 1199.98px) { .car-track { --per: 3; } }
@media (max-width: 767.98px) {
  .car-track { grid-auto-columns: 62%; gap: .85rem; margin-inline: calc(-1 * var(--gutter)); padding-inline: var(--gutter); scroll-padding-inline: var(--gutter); }
  .car-btn { width: 44px; height: 44px; font-size: 1rem; }
}
@media (max-width: 575.98px) {
  .car-track { grid-auto-columns: 72%; }
  .car-foot { flex-wrap: wrap; }
  .car-progress { flex-basis: 100%; }
  .car-foot .link-arrow { margin-left: auto; }
}

/* ---------- Projektet ---------- */
.project-row { align-items: center; }
.project-row + .project-row { margin-top: clamp(2.75rem, 2rem + 3.5vw, 5.5rem); }
.project-media { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: var(--sand-wash); border-radius: var(--radius); }
.project-media img { position: absolute; left: 0; top: -9%; width: 100%; height: 118%; object-fit: cover; will-change: transform; }
.project-num { font-family: var(--f-display); font-size: clamp(4rem, 3rem + 4vw, 7.5rem); line-height: .8; font-weight: 600; color: transparent; -webkit-text-stroke: 1px var(--sand); display: block; margin-bottom: .75rem; }
.project-name { font-size: var(--t-h2); margin-bottom: .75rem; }
.project-meta { font-family: var(--f-ui); color: var(--stone); font-size: 1rem; margin-bottom: 1.25rem; display: flex; flex-wrap: wrap; gap: .4rem 1.4rem; }
.project-meta span { display: inline-flex; gap: .45rem; align-items: center; }
.project-meta .bi { color: var(--sand-deep); }
.project-meta strong { color: var(--ink); font-weight: 500; }
.project-tag { position: absolute; left: 1.25rem; top: 1.25rem; z-index: 2; background: rgba(14,14,14,.75); color: var(--paper); font-family: var(--f-ui); font-size: .8rem; padding: .4rem .9rem; border-radius: 999px; backdrop-filter: blur(6px); }

/* ---------- Karakteristikat me ikona ---------- */
.features { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--line-dark); border-left: 1px solid var(--line-dark); }
.feature { padding: 2rem 1.75rem; border-right: 1px solid var(--line-dark); border-bottom: 1px solid var(--line-dark); position: relative; overflow: hidden; transition: background-color .5s var(--ease); }
.feature::before { content: ""; position: absolute; inset: auto 0 0 0; height: 2px; background: var(--sand); transform: scaleX(0); transform-origin: left; transition: transform .6s var(--ease); }
.feature:hover { background: rgba(255,255,255,.03); }
.feature:hover::before { transform: scaleX(1); }
.feature-icon { width: 60px; height: 60px; display: grid; place-content: center; font-size: 1.6rem; color: var(--sand); border: 1px solid rgba(204,176,147,.35); border-radius: 50%; margin-bottom: 1.25rem; transition: transform .6s var(--ease), background-color .4s, color .4s; }
.feature:hover .feature-icon { transform: rotate(-8deg) scale(1.06); background: var(--sand); color: var(--ink); }
.feature h3 { font-size: 1.4rem; margin-bottom: .6rem; color: var(--paper); }
.feature p { font-size: 1.05rem; margin: 0; }
@media (max-width: 991.98px) { .features { grid-template-columns: repeat(2, minmax(0, 1fr)); } }   /* 6 karta → 3×2 / 2×3 / 1 kolonë, pa rreshta gjysmë bosh */
.features.light { border-color: var(--line); }
.features.light .feature { border-color: var(--line); }
.features.light .feature h3 { color: var(--ink); }
.features.light .feature p { color: var(--stone); }
.features.light .feature-icon { color: var(--sand-deep); border-color: var(--sand-light); }
.features.light .feature:hover { background: var(--paper); }

/* Seksion i errët me imazh sfondi (Pse DEOS&K): imazhi në të djathtë, teksti mbi pjesën e errët */
.section-bg { overflow: hidden; isolation: isolate; }
.section-bg-media { position: absolute; inset: 0; z-index: -1; }
.section-bg-media picture { position: absolute; inset: 0; display: block; }
.section-bg-media img { position: absolute; left: 0; top: -8%; width: 100%; height: 116%; object-fit: cover; object-position: 75% center; will-change: transform; }
.section-bg-media::after {
  content: ""; position: absolute; inset: 0;
  background:
    linear-gradient(90deg, rgba(14,14,14,.9) 0%, rgba(14,14,14,.7) 40%, rgba(14,14,14,.35) 75%, rgba(14,14,14,.45) 100%),
    linear-gradient(180deg, rgba(14,14,14,.55) 0%, rgba(14,14,14,.15) 30%, rgba(14,14,14,.7) 75%, rgba(14,14,14,.92) 100%);
}
.section-bg .feature { background: rgba(14,14,14,.42); }
.section-bg .feature:hover { background: rgba(14,14,14,.62); }
@media (max-width: 767.98px) {
  .section-bg-media img { object-position: center top; }
  .section-bg-media::after { background: linear-gradient(180deg, rgba(14,14,14,.6) 0%, rgba(14,14,14,.78) 30%, rgba(14,14,14,.9) 100%); }
}

.modal-backdrop.show { opacity: .92; }

/* ---------- Vendndodhja ---------- */
.location-media { position: relative; aspect-ratio: 4 / 3.4; overflow: hidden; border-radius: var(--radius); }
.location-media img { width: 100%; height: 100%; object-fit: cover; }
.location-pin {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 64px; height: 64px; border-radius: 50%;   /* qendra e hartës = koordinata e saktë */
  background: var(--sand); color: var(--ink); display: grid; place-content: center; font-size: 1.6rem;
}
.location-pin::after { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: 50%; background: rgba(204,176,147,.7); animation: pin 2.4s infinite; pointer-events: none; }
@keyframes pin { 0% { transform: scale(1); opacity: 1; } 70%, 100% { transform: scale(1.875); opacity: 0; } }
.location-card { position: absolute; left: 1.25rem; bottom: 1.25rem; right: 1.25rem; background: rgba(255,255,255,.94); backdrop-filter: blur(8px); padding: 1rem 1.25rem; border-radius: var(--radius); font-family: var(--f-ui); display: flex; gap: .8rem; align-items: center; font-size: .95rem; }
.location-card .bi { font-size: 1.4rem; color: var(--sand-deep); }

/* Harta e klikueshme → paneli me butonat e aplikacioneve të hartës */
[data-map] { cursor: pointer; }
[data-map]:focus-visible { outline: 2px solid var(--sand-deep); outline-offset: 4px; }
[data-map] img { transition: transform 1.2s var(--ease), filter .5s var(--ease); }
[data-map]:hover img { transform: scale(1.04); }
.location-hint {
  position: absolute; left: 1rem; top: 1rem; z-index: 2; display: inline-flex; align-items: center; gap: .45rem;   /* majtas: atribuimi OSM është lart djathtas */
  background: var(--ink); color: var(--paper); border-radius: 999px; padding: .45rem .9rem; font-family: var(--f-ui); font-size: .8125rem;
  box-shadow: 0 8px 20px rgba(0,0,0,.18); transition: transform .35s var(--ease), opacity .3s;
}
.location-hint .bi { color: var(--sand); }
[data-map]:hover .location-hint { transform: translateY(-2px); }
.map-panel {
  position: absolute; inset: 0; z-index: 4; display: grid; place-items: center; padding: 1rem;
  background: rgba(14,14,14,.55); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  opacity: 0; visibility: hidden; transition: opacity .35s var(--ease), visibility 0s .35s;
}
[data-map].is-open .map-panel { opacity: 1; visibility: visible; transition: opacity .35s var(--ease); }
[data-map].is-open .location-hint, [data-map].is-open .location-pin { opacity: 0; }
[data-map].is-open img { filter: grayscale(.4); }
.map-panel-card {
  width: min(100%, 360px); background: rgba(14,14,14,.94); border: 1px solid rgba(255,255,255,.12); border-radius: var(--radius-lg);
  overflow: hidden; cursor: default; box-shadow: var(--shadow-lg); transform: translateY(12px) scale(.97); transition: transform .45s var(--ease);
}
[data-map].is-open .map-panel-card { transform: none; }
.map-panel .dlg-head { min-height: 0; padding: .9rem .9rem .9rem var(--dlg-px); }
.map-panel-actions { display: grid; gap: .5rem; padding: 1rem var(--dlg-px) 1.1rem; }
.map-panel-actions .btn { width: 100%; justify-content: center; padding: .75rem 1rem; font-size: .9375rem; }
.map-panel-actions .btn-sand, .map-panel-actions .btn-sand:focus-visible, .map-panel-actions .btn-sand:active { color: var(--ink); background: var(--sand); }
.map-panel-actions .btn-ghost-light:focus-visible, .map-panel-actions .btn-ghost-light:active { color: var(--ink); }
.map-panel-actions .btn-link-light { color: rgba(255,255,255,.75); border: 0; background: none; text-decoration: underline; text-underline-offset: .25em; padding-block: .4rem; }
.map-panel-actions .btn-link-light:hover { color: var(--paper); }
@media (max-width: 575.98px) {
  .map-panel { padding: .6rem; }
  .map-panel .dlg { --dlg-px: .9rem; }
  .map-panel .dlg-head { padding-block: .65rem; gap: .6rem; }
  .map-panel .dlg-title { font-size: 1.05rem; }
  .map-panel .dlg-title > .bi { flex-basis: 32px; height: 32px; font-size: .9rem; }
  .map-panel-actions { grid-template-columns: 1fr 1fr; gap: .4rem; padding-block: .75rem .8rem; }
  .map-panel-actions .btn { padding: .6rem .5rem; font-size: .8125rem; gap: .4rem; }
  .map-panel-actions .btn:only-child, .map-panel-actions .btn-link-light { grid-column: 1 / -1; }
  .map-panel-actions .btn-link-light { padding-block: .2rem; }
}
.nearby { list-style: none; margin: 0; padding: 0; }
.nearby li { display: grid; grid-template-columns: 48px 1fr auto; gap: 1rem; align-items: center; padding: .9rem 0; border-bottom: 1px solid var(--line); transition: padding .4s var(--ease); }
.nearby li:hover { padding-left: .5rem; }
.nearby .bi { width: 48px; height: 48px; display: grid; place-content: center; background: var(--sand-wash); color: var(--sand-deep); border-radius: 50%; font-size: 1.15rem; transition: background-color .3s, color .3s; }
.nearby li:hover .bi { background: var(--ink); color: var(--sand); }
.nearby strong { font-family: var(--f-display); font-weight: 600; font-size: 1.2rem; display: block; }
.nearby span { font-family: var(--f-ui); color: var(--stone); font-size: .875rem; }
.nearby em { font-family: var(--f-ui); font-style: normal; font-weight: 500; font-size: .95rem; white-space: nowrap; }

/* ---------- Procesi ---------- */
.steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 1.5rem; counter-reset: step; position: relative; }
.step { position: relative; padding-top: 1rem; }
.step-icon { width: 72px; height: 72px; border-radius: 50%; background: var(--paper); border: 1px solid var(--line); display: grid; place-content: center; font-size: 1.6rem; color: var(--ink); position: relative; z-index: 1; margin-bottom: 1.25rem; transition: all .5s var(--ease); }
.step:hover .step-icon { background: var(--ink); color: var(--sand); border-color: var(--ink); transform: translateY(-4px); }
.step-icon::after { counter-increment: step; content: "0" counter(step); position: absolute; right: -10px; top: -6px; background: var(--sand); color: var(--ink); font-family: var(--f-ui); font-size: .72rem; font-weight: 600; border-radius: 999px; padding: .15rem .45rem; }
.step h3 { font-size: 1.35rem; margin-bottom: .5rem; }
.step p { color: var(--stone); font-size: 1.05rem; margin: 0; }
@media (min-width: 992px) {
  .steps::before { content: ""; position: absolute; top: calc(1rem + 36px); left: 36px; right: 10%; height: 1px; background: repeating-linear-gradient(90deg, var(--sand) 0 6px, transparent 6px 12px); }
}

/* ---------- Deklarata (sfond i zi) ---------- */
/* Animacioni: vija e sipërme vizatohet → thonjëzat rrotullohen në vend → fjalët ngjiten një nga një
   dhe "ndizen" sipas scroll-it (--p, nga main.js) → nënvizimi i "vlera afatgjata" → shtyllat rriten. */
.statement { --p: 1; background: var(--ink); color: var(--paper); position: relative; overflow: hidden; isolation: isolate; }
.statement::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 1px; z-index: 1;
  background: linear-gradient(90deg, transparent, var(--sand) 30%, var(--sand) 70%, transparent);
  transform: scaleX(0); transition: transform 1.6s var(--ease-in-out);
}
.statement::after {
  content: ""; position: absolute; right: -10%; bottom: -30%; width: 70%; aspect-ratio: 1; z-index: -1; pointer-events: none;
  background: radial-gradient(closest-side, rgba(204,176,147,.13), transparent); opacity: 0; transition: opacity 2s var(--ease);
}
.statement.is-visible::before { transform: scaleX(1); }
.statement.is-visible::after { opacity: 1; }
.statement .quote-icon { font-size: 3rem; color: var(--sand); line-height: 1; display: block; margin-bottom: 1.1rem; }
.js .statement .quote-icon[data-reveal] { transform: scale(.4) rotate(-25deg); transform-origin: 20% 80%; transition-duration: 1.2s; transition-delay: .25s; }
.js .statement .quote-icon.is-visible { transform: none; }
.statement p { font-family: var(--f-serif); font-size: clamp(1.6rem, 1.1rem + 2vw, 3rem); line-height: 1.25; max-width: 28ch; margin: 0; color: var(--paper); }
.statement p em {
  color: var(--sand); background: linear-gradient(var(--sand), var(--sand)) no-repeat 0 96% / 0 1px;
  -webkit-box-decoration-break: clone; box-decoration-break: clone; transition: background-size 1.2s var(--ease);
}
.statement.is-lit p em { background-size: 100% 1px; }
/* Fjalët (i ndan main.js): maska + ngjitje me vonesë sipas radhës (--i) */
.st-w { display: inline-block; clip-path: inset(-.15em -.1em -.3em -.1em); opacity: var(--o, 1); transition: opacity .35s linear; }
.st-w > span { display: inline-block; transform: translateY(110%); transition: transform 1.1s var(--ease); transition-delay: calc(.35s + var(--i) * 40ms); }
.statement.is-visible .st-w > span { transform: none; }

/* Tri pallate në mbrëmje (dritaret i gjeneron main.js): ngrihen kat pas kati, pastaj ndizen dritat */
.statement .bars { --k: 1; position: absolute; right: 6%; bottom: 0; height: 80%; display: flex; gap: calc(12px * var(--k)); align-items: end; transform: translate3d(0, calc((1 - var(--p)) * 70px), 0); }
.statement .bars span {
  --w: 62px; --c: 3; --wh: 11px;
  position: relative; display: flex; flex-direction: column; width: calc(var(--w) * var(--k));
  padding: calc(10px * var(--k)) calc(6px * var(--k)) 0;
  background:
    linear-gradient(90deg, rgba(204,176,147,.5) 0 1px, transparent 1px calc(100% - 1px), rgba(0,0,0,.5) calc(100% - 1px)),
    linear-gradient(90deg, #2c2722, #221e1a 55%, #181613);
  clip-path: inset(100% -4px 0 -4px); transition: clip-path 1.8s var(--ease-in-out) .5s;
}
.statement .bars span::before { content: ""; position: absolute; left: -2px; right: -2px; top: 0; height: 3px; background: #6d5c4a; box-shadow: 0 1px 0 rgba(204,176,147,.35); }
.statement .bars span:nth-child(1) { height: 55%; }
.statement .bars span:nth-child(2) { --w: 76px; --c: 4; --wh: 14px; height: 75%; transition-delay: .7s; }
.statement .bars span:nth-child(3) { --w: 98px; --c: 4; height: 100%; transition-delay: .9s; }
.statement.is-visible .bars span { clip-path: inset(-60px -4px 0 -4px); }
@media (min-width: 1400px) { .statement .bars { --k: 1.15; } }
/* Kulla e ashensorit në çati + antena me dritë sinjalizuese te pallati më i lartë */
.bld-roof { position: absolute; left: 22%; width: 38%; top: calc(-14px * var(--k)); height: calc(14px * var(--k)); background: #26221d; border-top: 2px solid #6d5c4a; }
.statement .bars span:nth-child(3)::after {
  content: ""; position: absolute; left: 64%; top: calc(-44px * var(--k)); width: 2px; height: calc(44px * var(--k)); background: linear-gradient(#8a7660, #3a332c);
}
.bld-beacon { position: absolute; left: calc(64% - 2px); top: calc(-48px * var(--k)); width: 6px; height: 6px; border-radius: 50%; background: #e0574a; box-shadow: 0 0 10px 2px rgba(224,87,74,.7); animation: beacon 2.4s ease-in-out infinite; }
@keyframes beacon { 0%, 100% { opacity: .25; } 50% { opacity: 1; } }
.bld-win {
  flex: 1; min-height: 0; overflow: hidden; display: grid; align-content: start;
  grid-template-columns: repeat(var(--c), 1fr); grid-auto-rows: calc(var(--wh) * var(--k)); gap: calc(7px * var(--k)) calc(5px * var(--k));
}
.bld-win b { background: rgba(204,176,147,.09); border-radius: 1px; transition: background-color .9s, box-shadow .9s; }
.statement.is-visible .bld-win b.on { background: #f2cf98; box-shadow: 0 0 9px rgba(242,207,152,.5); transition-delay: var(--d, 0s); }
.statement.is-visible .bld-win b.on.dim { background: #b98f5c; box-shadow: none; }
.bld-base {
  position: relative; flex: 0 0 calc(26px * var(--k)); margin: calc(8px * var(--k)) calc(-6px * var(--k)) 0;
  background: linear-gradient(#3b332b, #26211c); border-top: 2px solid rgba(204,176,147,.55);
}
.bld-base::after { content: ""; position: absolute; left: 50%; bottom: 0; width: 28%; height: 62%; transform: translateX(-50%); background: linear-gradient(#f2cf98, #b98f5c); opacity: .85; box-shadow: 0 0 14px rgba(242,207,152,.45); }

/* ---------- CTA ---------- */
.cta { background: var(--sand); position: relative; overflow: hidden; }
.cta::after { content: ""; position: absolute; right: -10%; top: -40%; width: 60%; aspect-ratio: 1; border-radius: 50%; border: 1px solid rgba(14,14,14,.12); box-shadow: 0 0 0 60px rgba(255,255,255,.08), 0 0 0 130px rgba(255,255,255,.05); pointer-events: none; }
.cta h2 { font-size: var(--t-h2); }
.cta .container-xl { position: relative; z-index: 1; }
.contact-tiles { display: grid; gap: .75rem; }
.contact-tile {
  display: flex; align-items: center; gap: 1rem; padding: 1rem 1.2rem; background: rgba(255,255,255,.55); border-radius: var(--radius);
  text-decoration: none; color: var(--ink); font-family: var(--f-ui); transition: background-color .35s, transform .35s var(--ease);
}
.contact-tile:hover { background: var(--paper); transform: translateX(6px); color: var(--ink); }
.contact-tile > .bi:first-child { width: 46px; height: 46px; border-radius: 50%; background: var(--ink); color: var(--sand); display: grid; place-content: center; font-size: 1.15rem; flex-shrink: 0; }
.contact-tile small { display: block; font-size: .78rem; color: #4a3d2e; letter-spacing: .06em; text-transform: uppercase; }
.contact-tile strong { font-weight: 500; font-size: 1.05rem; }
.contact-tile .bi-arrow-up-right { margin-left: auto; transition: transform .35s var(--ease); }
.contact-tile:hover .bi-arrow-up-right { transform: translate(3px,-3px); }

/* ---------- Kokat e faqeve të brendshme ---------- */
.page-head {
  position: relative; color: var(--paper); background: var(--ink); overflow: hidden;
  padding-block: calc(var(--header-h) + clamp(2rem, 1.5rem + 3vw, 4.5rem)) clamp(2rem, 1.5rem + 2.5vw, 3.75rem);
}
.page-head-bg { position: absolute; inset: 0; }
.page-head-bg img { width: 100%; height: 100%; object-fit: cover; opacity: .45; transform: scale(1.08); animation: kenburns 12s var(--ease) forwards; }
.page-head::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(14,14,14,.85), rgba(14,14,14,.25)); }
.page-head .container-xl { position: relative; z-index: 2; }
.page-head h1 { font-size: var(--t-h1); margin-bottom: .9rem; }
.page-head .lead-serif { color: rgba(255,255,255,.8); }
.page-head .breadcrumb { --bs-breadcrumb-divider-color: rgba(255,255,255,.5); --bs-breadcrumb-item-active-color: var(--sand); margin-bottom: 1.25rem; }
.page-head .breadcrumb a { color: rgba(255,255,255,.75); text-decoration: none; }
.page-head .breadcrumb a:hover { color: var(--paper); }

/* ---------- Faqja e listës (pronat.html) ---------- */
.page-head-listing { padding-bottom: clamp(1.75rem, 1.25rem + 2vw, 3rem); }

.listing { padding-block: clamp(1.25rem, 1rem + 1.5vw, 2.5rem) var(--section-y); }
/* Zgjedhja e llojit (apartamente / biznes): karta të mëdha, të qarta për çdo moshë */
.type-pick { margin-bottom: clamp(2.25rem, 1.75rem + 2vw, 3.5rem); }
.tp-q { font-family: var(--f-ui); font-size: clamp(1.2rem, 1.1rem + .4vw, 1.4rem); font-weight: 500; margin: 0 0 1rem; }
.tp-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(.75rem, .5rem + 1vw, 1.25rem); }
.tp-card {
  display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-areas: "media text" "go go"; gap: 1rem 1.25rem; align-items: center;
  padding: 1rem; border: 2px solid var(--line); border-radius: var(--radius-lg); background: var(--paper); color: var(--ink); text-decoration: none;
  transition: border-color .3s, box-shadow .4s var(--ease), transform .4s var(--ease);
}
.tp-card:hover, .tp-card:focus-visible { border-color: var(--ink); box-shadow: var(--shadow-lg); transform: translateY(-3px); color: var(--ink); }
.tp-media { grid-area: media; width: clamp(84px, 70px + 4vw, 128px); aspect-ratio: 1; border-radius: 10px; overflow: hidden; background: var(--sand-wash); }
.tp-media img { width: 100%; height: 100%; object-fit: cover !important; }
.tp-text { grid-area: text; display: flex; flex-direction: column; gap: .2rem; min-width: 0; }
.tp-text small { display: inline-flex; align-items: center; gap: .45rem; font-size: .8rem; letter-spacing: .16em; text-transform: uppercase; font-weight: 500; color: var(--sand-deep); }
.tp-text strong { font-family: var(--f-display); font-weight: 500; font-size: clamp(1.4rem, 1.2rem + .9vw, 1.9rem); line-height: 1.15; letter-spacing: -.01em; }
.tp-text > span { color: var(--stone); font-size: 1rem; }
.tp-go {
  grid-area: go; display: flex; justify-content: space-between; align-items: center; gap: 1rem;
  padding: .85rem 1.1rem; border-radius: var(--radius); background: var(--ink); color: var(--paper); font-family: var(--f-ui); font-weight: 500; font-size: 1.05rem;
}
.tp-go .bi { font-size: 1.2rem; color: var(--sand); transition: transform .35s var(--ease); }
.tp-card:hover .tp-go .bi { transform: translateY(3px); }
@media (max-width: 767.98px) { .tp-grid { grid-template-columns: 1fr; } }
.lg-title:focus { outline: none; }

/* Grupet sipas projektit */
.listing-group { scroll-margin-top: calc(var(--header-h) + 1rem); }
.listing-group + .listing-group { margin-top: clamp(2.5rem, 2rem + 2.5vw, 4.5rem); }
.lg-head {
  display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem 2rem; flex-wrap: wrap;
  padding-bottom: 1.1rem; margin-bottom: clamp(1.25rem, 1rem + 1vw, 1.75rem); border-bottom: 1px solid var(--line);
}
.lg-head .eyebrow { margin-bottom: .6rem; }
.lg-title { font-size: var(--t-h2); margin-bottom: .35rem; }
.lg-loc { margin: 0; color: var(--stone); display: flex; gap: .4rem; align-items: center; }
.lg-loc .bi { color: var(--sand-deep); }

/* Rrjeti */
.listing-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 272px), 1fr)); gap: clamp(1rem, .6rem + 1.2vw, 1.75rem); }
/* Pa content-visibility: paint containment pret hijen e kartës në hover */
.listing-item { animation: itemIn .6s var(--ease) both; animation-delay: calc(var(--i, 0) * 45ms); }
@keyframes itemIn { from { opacity: 0; transform: translateY(18px); } }
/* Karta nën maus: ngrihet, hije e thellë + kornizë rëre */
@media (hover: hover) and (pointer: fine) {
  .listing-grid .prop-card { position: relative; box-shadow: 0 1px 3px rgba(14,14,14,.05); }
  .listing-grid .prop-card:hover {
    z-index: 1; transform: translateY(-8px);
    box-shadow: 0 0 0 1px var(--sand), 0 6px 14px rgba(14,14,14,.08), 0 38px 70px -24px rgba(14,14,14,.5);
  }
}
.listing-grid .prop-card:focus-within { box-shadow: 0 0 0 2px var(--sand), 0 24px 50px -24px rgba(14,14,14,.45); }
@media (prefers-reduced-motion: reduce) { .listing-grid .prop-card:hover { transform: none; } }

.prop-desc { display: none; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; color: var(--stone); font-size: 1rem; margin: -.4rem 0 1rem; max-width: 60ch; }
@media (hover: none) { .prop-card:hover { transform: none; box-shadow: none; } }

.listing-cta {
  margin-top: clamp(2.5rem, 2rem + 2vw, 4rem); display: flex; justify-content: space-between; align-items: center; gap: 1.25rem 2rem; flex-wrap: wrap;
  padding: clamp(1.5rem, 1rem + 2vw, 2.5rem); background: var(--ink); color: var(--paper); border-radius: var(--radius-lg); position: relative; overflow: hidden;
}
.listing-cta::after { content: ""; position: absolute; right: -60px; top: -60px; width: 220px; height: 220px; border-radius: 50%; border: 1px solid rgba(204,176,147,.25); box-shadow: 0 0 0 40px rgba(204,176,147,.05); pointer-events: none; }
.listing-cta h2 { color: var(--paper); }
.listing-cta p { color: rgba(255,255,255,.7); font-size: 1.05rem; }
.listing-cta > * { position: relative; z-index: 1; }

@media (max-width: 575.98px) {
  .listing-cta .btn { width: 100%; }
}
.empty-state { border: 1px dashed #cfc8bc; padding: 2.5rem 1.25rem; text-align: center; border-radius: var(--radius); }
.empty-state .bi { font-size: 2.4rem; color: var(--sand-deep); display: block; margin-bottom: 1rem; }
.empty-state p { margin-inline: auto; }

/* ---------- Detajet e pronës (prona.html) ---------- */
.breadcrumb a { color: var(--stone); text-decoration: none; }
.breadcrumb a:hover { color: var(--ink); }
.detail-top { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding-top: clamp(1rem, .75rem + 1vw, 1.75rem); margin-bottom: clamp(1.25rem, 1rem + 1vw, 2rem); }
.detail-top .breadcrumb { flex-wrap: nowrap; overflow: hidden; }
.detail-top .breadcrumb-item { white-space: nowrap; }
.detail-top .breadcrumb-item.active { overflow: hidden; text-overflow: ellipsis; }
.detail-actions { display: flex; gap: .5rem; flex-shrink: 0; }
.act {
  display: inline-flex; align-items: center; gap: .45rem; font-family: var(--f-ui); font-size: .875rem; color: var(--ink); text-decoration: none;
  border: 1px solid var(--line); border-radius: 999px; padding: .45rem .95rem; background: var(--paper); transition: border-color .25s, background-color .25s;
}
.act:hover { border-color: var(--ink); color: var(--ink); }

/* Informacionet: brez i errët premium — shkëlqim i ngrohtë sand, numri i pronës me konturë në sfond, karta si xham */
.pd-top {
  position: relative; overflow: hidden; isolation: isolate; color: var(--paper);
  padding-block: calc(var(--header-h) + clamp(1.25rem, 1rem + 1vw, 2rem)) clamp(3rem, 2.25rem + 3vw, 5.5rem);
  background:
    radial-gradient(900px 480px at 88% -10%, rgba(204,176,147,.22), transparent 62%),
    radial-gradient(700px 420px at -10% 110%, rgba(204,176,147,.10), transparent 60%),
    linear-gradient(180deg, #141312 0%, #0d0d0c 100%);
}
.pd-top::after {   /* vijë e hollë sand në fund */
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; z-index: 1;
  background: linear-gradient(90deg, transparent, rgba(204,176,147,.55) 30%, rgba(204,176,147,.55) 70%, transparent);
}
.pd-bgnum {
  position: absolute; right: -.04em; bottom: -.2em; z-index: -1; pointer-events: none; user-select: none; white-space: nowrap;
  font-family: var(--f-display); font-weight: 600; font-size: clamp(9rem, 6rem + 16vw, 24rem); line-height: 1; letter-spacing: -.04em;
  color: transparent; -webkit-text-stroke: 1px rgba(204,176,147,.16);
  animation: pdNum 2.2s var(--ease) .3s both;
}
@keyframes pdNum { from { opacity: 0; transform: translateY(6%); } }
.pd-top .detail-top { padding-top: 0; margin-bottom: clamp(1.75rem, 1.25rem + 2vw, 3rem); }
.pd-top .breadcrumb { --bs-breadcrumb-divider-color: rgba(255,255,255,.4); --bs-breadcrumb-item-active-color: var(--sand); }
.pd-top .breadcrumb a { color: rgba(255,255,255,.7); }
.pd-top .breadcrumb a:hover { color: var(--paper); }
.pd-top .act { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.2); color: var(--paper); }
.pd-top .act:hover { background: var(--paper); color: var(--ink); border-color: var(--paper); }

.pd-intro { display: grid; grid-template-columns: minmax(0, 1fr) 420px; gap: 2.25rem clamp(2rem, 1rem + 4vw, 5rem); align-items: center; }
@media (max-width: 1199.98px) { .pd-intro { grid-template-columns: minmax(0, 1fr) 380px; } }
@media (max-width: 991.98px) { .pd-intro { grid-template-columns: 1fr; } }
.pd-cat { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem 1rem; margin-bottom: 1.1rem; }
.pd-cat .status { position: relative; left: auto; top: auto; white-space: nowrap; }   /* relative: unaza që pulson mbetet te pika */
.pd-project { font-size: clamp(2.4rem, 1.5rem + 3.4vw, 4.75rem); letter-spacing: -.025em; margin-bottom: .6rem; color: var(--paper); }
.pd-project span { display: block; font-family: var(--f-ui); font-weight: 500; font-size: .8rem; letter-spacing: .18em; text-transform: uppercase; color: var(--sand); margin-top: .6rem; }
.pd-addr { font-family: var(--f-ui); color: rgba(255,255,255,.75); font-size: 1rem; display: flex; gap: .45rem; margin: 0 0 clamp(1.25rem, 1rem + 1vw, 1.75rem); }
.pd-addr .bi { color: var(--sand); }
.pd-desc { font-size: var(--t-lg); line-height: 1.6; color: rgba(255,255,255,.88); margin-bottom: 1rem; max-width: 58ch; }
.pd-proj { color: rgba(255,255,255,.58); margin-bottom: 1.25rem; max-width: 60ch; }
.pd-top .link-arrow { color: var(--paper); }

.pd-card {
  position: relative; border-radius: var(--radius-lg); padding: clamp(1.35rem, 1.1rem + 1vw, 2rem);
  background: linear-gradient(160deg, rgba(255,255,255,.08), rgba(255,255,255,.02));
  border: 1px solid rgba(204,176,147,.28); box-shadow: 0 40px 80px -40px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
}
.pd-card::before {   /* shkëlqim i hollë që kalon një herë mbi skajin e sipërm */
  content: ""; position: absolute; left: 1.5rem; right: 1.5rem; top: -1px; height: 1px;
  background: linear-gradient(90deg, transparent, var(--sand), transparent); background-size: 50% 100%; background-repeat: no-repeat;
  animation: pdShine 3.2s var(--ease) 1s both;
}
@keyframes pdShine { from { background-position: -60% 0; } to { background-position: 160% 0; } }
.pd-card-h { font-family: var(--f-ui); font-size: .78rem; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--sand); margin: 0 0 .5rem; }
.pd-facts { display: grid; grid-template-columns: 1fr 1fr; margin: 0 0 1.35rem; }
.pd-facts > div { padding: 1rem 0; border-bottom: 1px solid rgba(255,255,255,.1); min-width: 0; }
.pd-facts > div:nth-child(odd) { padding-right: 1rem; }
.pd-facts > div:nth-child(even) { padding-left: 1.1rem; border-left: 1px solid rgba(255,255,255,.1); }
.pd-facts > div:last-child:nth-child(odd) { grid-column: 1 / -1; }   /* numër tek të dhënash → e fundit zë gjithë rreshtin */
.pd-facts dt { font-family: var(--f-ui); font-weight: 400; font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; color: rgba(255,255,255,.55); }
.pd-facts dd { font-family: var(--f-display); font-weight: 500; font-size: clamp(1.35rem, 1.15rem + .7vw, 1.75rem); line-height: 1.2; margin: .25rem 0 0; color: var(--paper); }
.pd-note { font-family: var(--f-ui); font-size: .78rem; line-height: 1.4; color: rgba(255,255,255,.55); margin: .35rem 0 0; }
.pd-card-cta { font-family: var(--f-ui); font-size: .95rem; color: rgba(255,255,255,.65); margin-bottom: .9rem; }
.pd-card-cta strong { color: var(--paper); }
.pd-card .pd-pdf { display: inline-flex; align-items: center; gap: .45rem; margin-top: 1rem; font-family: var(--f-ui); font-size: .9rem; text-decoration: none; color: var(--paper); }
.pd-card .pd-pdf .bi { color: var(--sand); }

/* Pamjet: brez me nuancë të ngrohtë, 2D majtas | 3D djathtas, pastaj miniaturat e fotove të tjera */
.pd-gallery { padding-block: clamp(2.75rem, 2rem + 3vw, 5rem); background: linear-gradient(180deg, var(--sand-wash) 0%, #faf6f0 100%); }
.pd-gallery .pd-sec-head { margin-bottom: clamp(1.25rem, 1rem + 1vw, 2rem); }
.pd-gallery .pv { box-shadow: 0 24px 50px -34px rgba(14,14,14,.35); border-color: #ece5da; transition: box-shadow .5s var(--ease), border-color .4s; }
.pd-gallery .pv:hover { box-shadow: 0 34px 70px -30px rgba(14,14,14,.4); border-color: var(--sand); }
.pd-more { margin-top: clamp(1.5rem, 1.25rem + 1vw, 2.25rem); }
.pd-more-l { display: inline-flex; align-items: center; gap: .5rem; font-family: var(--f-ui); font-size: .875rem; color: var(--stone); margin-bottom: .75rem; }
.pd-more-l .bi { color: var(--sand-deep); font-size: 1.05rem; }
.pd-more-l b { font-weight: 600; color: var(--ink); background: var(--paper); border-radius: 999px; padding: .05rem .55rem; font-size: .8125rem; }
.pd-thumbs { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(30%, 150px), 1fr)); gap: clamp(.5rem, .35rem + .5vw, .85rem); }
.pd-thumb { position: relative; aspect-ratio: 4 / 3; padding: 0; border: 1px solid #ece5da; border-radius: var(--radius); overflow: hidden; background: #fff; cursor: zoom-in; transition: border-color .3s, box-shadow .4s var(--ease); }
.pd-thumb img { width: 100%; height: 100%; object-fit: cover !important; display: block; transition: transform .8s var(--ease); }
.pd-thumb-z { position: absolute; inset: 0; display: grid; place-content: center; background: rgba(14,14,14,.35); color: var(--paper); font-size: 1.1rem; opacity: 0; transition: opacity .35s; }
.pd-thumb:hover, .pd-thumb:focus-visible { border-color: var(--sand); box-shadow: 0 18px 40px -24px rgba(14,14,14,.45); }
.pd-thumb:hover img { transform: scale(1.08); }
.pd-thumb:hover .pd-thumb-z, .pd-thumb:focus-visible .pd-thumb-z { opacity: 1; }
.pd-gallery .dnote { margin-top: 1.25rem; }

/* Pamjet 2D dhe 3D – dy blloqe të mëdha krah njëri-tjetrit, në celular njëra pas tjetrës */
.pd-views { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(.75rem, .5rem + 1vw, 1.5rem); }
.pd-views.is-single { grid-template-columns: 1fr; max-width: 900px; }
@media (max-width: 767.98px) { .pd-views { grid-template-columns: 1fr; } }
.pd-views-more { grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); margin-top: clamp(1rem, .75rem + 1vw, 1.75rem); }
.pd-views-more .pv { aspect-ratio: 3 / 4; }
.pd-views-more .pv-contain img { padding: 0; }
.pd-views-more .pv-tag { font-size: .8125rem; padding: .25rem .7rem; min-width: 0; }
@media (max-width: 991.98px) { .pd-views-more { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575.98px) {
  .pd-views-more { gap: .6rem; }
  .pd-views-more .pv-tag { left: .5rem; top: .5rem; font-size: .75rem; }
  .pd-views-more .pv-zoom { right: .5rem; bottom: .5rem; padding: .35rem .5rem; font-size: 0; gap: 0; }
  .pd-views-more .pv-zoom .bi { font-size: .8rem; }
  .pd-views-more figcaption { font-size: .8125rem; margin-top: .4rem; }
}
.pv-item { margin: 0; min-width: 0; }
.pv-item figcaption { font-family: var(--f-ui); font-size: .875rem; color: var(--stone); margin-top: .6rem; }
.pv {
  position: relative; display: block; width: 100%; aspect-ratio: 4 / 3; padding: 0; overflow: hidden; cursor: zoom-in;
  border: 1px solid var(--line); border-radius: var(--radius-lg); background: #fff;
}
.pv img { width: 100%; height: 100%; display: block; transition: transform .9s var(--ease); }
.pv-contain img { object-fit: contain !important; padding: clamp(.5rem, .25rem + 1vw, 1.25rem); }
.pv-cover img { object-fit: cover !important; }
.pv:hover img { transform: scale(1.03); }
.pv-tag {
  position: absolute; left: 1rem; top: 1rem; z-index: 1; min-width: 46px; text-align: center;
  background: var(--ink); color: var(--paper); border-radius: 999px; padding: .3rem .8rem;
  font-family: var(--f-display); font-weight: 600; font-size: .95rem; letter-spacing: .04em;
}
.pv-zoom {
  position: absolute; right: 1rem; bottom: 1rem; z-index: 1; display: inline-flex; align-items: center; gap: .45rem;
  background: rgba(255,255,255,.94); color: var(--ink); border: 1px solid var(--line); border-radius: 999px; padding: .4rem .85rem;
  font-family: var(--f-ui); font-size: .8125rem; transition: background-color .25s, color .25s;
}
.pv:hover .pv-zoom { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.dnote { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem 1.5rem; font-family: var(--f-ui); font-size: .8125rem; color: var(--stone); margin: .9rem 0 0; }
.dnote .bi { margin-right: .4rem; }
.pd-pdf { color: var(--ink); font-weight: 500; }
.pd-pdf .bi { color: #b3261e; }

/* Harta: mbi të bardhë, në gjithë gjerësinë */
.pd-map { padding-block: clamp(2.75rem, 2rem + 3vw, 5rem) 0; scroll-margin-top: 90px; }
.pd-sec-head { display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: .5rem 1rem; margin-bottom: 1rem; }
.pd-h { font-size: clamp(1.5rem, 1.25rem + .8vw, 2rem); margin-bottom: 1rem; }
.map-embed { aspect-ratio: 21 / 9; border-radius: var(--radius-lg); overflow: hidden; background: var(--sand-wash); border: 1px solid var(--line); box-shadow: 0 30px 60px -40px rgba(14,14,14,.35); }
.map-embed iframe { width: 100%; height: 100%; border: 0; display: block; }
.map-embed.is-static { position: relative; }
.map-embed.is-static img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 767.98px) { .map-embed { aspect-ratio: 4 / 3.4; } }
.prop-pager { margin-block: clamp(2.5rem, 2rem + 2vw, 4rem); }

/* "+N" mbi miniaturat (përdoret te galeria e projekteve) */
.pg-more { position: absolute; inset: 0; z-index: 1; display: grid; place-content: center; background: rgba(14,14,14,.55); color: var(--paper); font-family: var(--f-display); font-weight: 600; font-size: 1.6rem; }

.prop-pager { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; padding-top: 1.5rem; border-top: 1px solid var(--line); }
.pp { display: flex; align-items: center; gap: 1rem; padding: 1rem 1.2rem; border: 1px solid var(--line); border-radius: var(--radius); color: var(--ink); text-decoration: none; transition: border-color .3s, background-color .3s; min-width: 0; }
.pp:hover { border-color: var(--ink); background: var(--sand-wash); color: var(--ink); }
.pp-next { justify-content: flex-end; text-align: right; grid-column: 2; }
.pp span { min-width: 0; }
.pp small { display: block; font-family: var(--f-ui); font-size: .7rem; letter-spacing: .14em; text-transform: uppercase; color: var(--stone); }
.pp strong { display: block; font-family: var(--f-display); font-weight: 600; font-size: 1.1rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pp em { font-family: var(--f-ui); font-style: normal; font-size: .8125rem; color: var(--sand-deep); }
.pp .bi { font-size: 1.2rem; transition: transform .35s var(--ease); flex-shrink: 0; }
.pp-prev:hover .bi { transform: translateX(-4px); }
.pp-next:hover .bi { transform: translateX(4px); }
@media (max-width: 575.98px) { .pp { padding: .85rem .9rem; gap: .6rem; } .pp em { display: none; } .pp strong { font-size: 1rem; } }

/* Prona të ngjashme */
.similar-track { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); gap: 1.5rem; }
@media (max-width: 767.98px) {
  .similar-track {
    grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 84%; gap: 1rem;
    overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none;
    margin-inline: calc(-1 * var(--gutter)); padding: .25rem var(--gutter) 1rem; scroll-padding-inline: var(--gutter);
  }
  .similar-track::-webkit-scrollbar { display: none; }
  .similar-track > * { scroll-snap-align: start; }
}

/* Shiriti i kontaktit në celular */
.detail-bar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 1035; display: flex; align-items: center; gap: .5rem;
  padding: .65rem 1rem calc(.65rem + env(safe-area-inset-bottom)); background: rgba(255,255,255,.96);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-top: 1px solid var(--line); box-shadow: 0 -10px 30px rgba(14,14,14,.07);
}
.db-label { flex: 1; min-width: 0; }
.db-label small { display: block; font-family: var(--f-ui); font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; color: var(--stone); }
.db-label strong { display: block; font-family: var(--f-display); font-weight: 600; font-size: 1.05rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.db-icon { flex: 0 0 44px; height: 44px; border-radius: 50%; border: 1px solid var(--line); display: grid; place-content: center; color: var(--ink); font-size: 1.1rem; text-decoration: none; }
.detail-bar .btn { padding: .7rem 1.1rem; white-space: nowrap; }
@media (min-width: 992px) { .detail-bar { display: none; } }
@media (max-width: 991.98px) {
  .has-detail-bar { padding-bottom: calc(70px + env(safe-area-inset-bottom)); }
  .has-detail-bar .wa-float { display: none; }
  .has-detail-bar .float-stack { bottom: calc(84px + env(safe-area-inset-bottom)); }
}

/* Lightbox i fotove */
.plb { --plb-bg: #0c0c0c; }
.plb .modal-content { background: var(--plb-bg); color: var(--paper); display: flex; flex-direction: column; border: 0; }
.plb.fade .plb-frame img { transform: scale(.97); opacity: 0; transition: transform .6s var(--ease), opacity .5s var(--ease); }
.plb.show .plb-frame.is-loaded img { transform: none; opacity: 1; }

/* Shiriti i sipërm: numëruesi · titulli + përshkrimi · veglat */
.plb { --dlg-px: clamp(1rem, 2vw, 1.75rem); }
.plb-top { justify-content: space-between; font-family: var(--f-ui); }
.plb-meta { display: flex; align-items: center; gap: 1.1rem; min-width: 0; }
.plb-count { display: inline-flex; align-items: baseline; gap: .35rem; padding-right: 1.1rem; border-right: 1px solid rgba(255,255,255,.14); white-space: nowrap; }
.plb-count b { font-family: var(--f-display); font-weight: 600; font-size: 1.35rem; color: var(--sand); line-height: 1; }
.plb-count span { font-size: .8rem; color: rgba(255,255,255,.5); }
.plb-text { display: flex; flex-direction: column; min-width: 0; line-height: 1.3; }
.plb-title { font-weight: 500; font-size: .95rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.plb-cap { font-size: .8125rem; color: rgba(255,255,255,.55); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.plb-cap:empty { display: none; }
.plb-tools { display: flex; gap: .5rem; flex-shrink: 0; }
.plb-nav:focus-visible, .plb-thumbs button:focus-visible { outline: 2px solid var(--sand); outline-offset: 2px; }

/* Të dhënat kryesore të pronës brenda galerisë (tipologjia, sipërfaqja, kati, çmimi + WhatsApp) */
.plb-info {
  display: flex; align-items: center; justify-content: space-between; gap: .75rem 1.5rem;
  padding: .7rem var(--dlg-px); border-bottom: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.03); font-family: var(--f-ui);
}
.plb-info[hidden] { display: none; }
.plb-facts { display: flex; gap: 0; margin: 0; min-width: 0; overflow-x: auto; scrollbar-width: none; }
.plb-facts::-webkit-scrollbar { display: none; }
.plb-facts > div { flex: 0 0 auto; padding-inline: clamp(1.25rem, .75rem + 2vw, 2.75rem); }
.plb-facts > div:first-child { padding-left: 0; }
.plb-facts > div + div { border-left: 1px solid rgba(255,255,255,.1); }
.plb-facts dt { font-weight: 400; font-size: .68rem; letter-spacing: .16em; text-transform: uppercase; color: rgba(255,255,255,.5); }
.plb-facts dd { margin: .1rem 0 0; font-weight: 500; font-size: 1.05rem; color: var(--paper); white-space: nowrap; }
.plb-wa { flex-shrink: 0; padding: .55rem 1.1rem; font-size: .9rem; }
@media (max-width: 767.98px) {
  .plb-info { padding-block: .55rem; gap: .75rem; }
  .plb-facts > div { padding-inline: 1rem; }
  .plb-facts > div:first-child { padding-left: 0; }
  .plb-facts dd { font-size: .95rem; }
  .plb-wa { width: 42px; height: 42px; padding: 0; border-radius: 50%; display: grid; place-content: center; }
  .plb-wa span { display: none; }
  .plb-wa .bi { margin: 0; font-size: 1.1rem; }
}

/* Skena: foto e qendërzuar, me kënde të rrumbullakëta dhe hije; ngarkuesi derisa të vijë foto */
.plb-stage { position: relative; flex: 1; min-height: 0; }
.plb .carousel-inner { overflow: hidden; }
.plb-frame { position: relative; height: 100%; display: flex; align-items: center; justify-content: center; padding: clamp(.75rem, 2.5vw, 2rem) clamp(.75rem, 7vw, 7rem); }
.plb-frame::before {
  content: ""; position: absolute; left: 50%; top: 50%; width: 34px; height: 34px; margin: -17px 0 0 -17px; border-radius: 50%;
  border: 2px solid rgba(255,255,255,.15); border-top-color: var(--sand); animation: plb-spin .8s linear infinite;
}
.plb-frame.is-loaded::before { display: none; }
@keyframes plb-spin { to { transform: rotate(360deg); } }
.plb-frame img {
  position: relative; display: block; width: auto; height: auto; max-width: 100%; max-height: 100%;
  border-radius: 10px; box-shadow: 0 30px 80px -20px rgba(0,0,0,.8); cursor: zoom-in; user-select: none; -webkit-user-drag: none;
}
.plb-frame img.zoomed { transform: scale(2.2) !important; cursor: zoom-out; border-radius: 0; box-shadow: none; transition: transform-origin .08s linear, transform .45s var(--ease); }
.plb.is-zoomed .plb-nav, .plb.is-zoomed .plb-thumbs { opacity: 0; pointer-events: none; }
.plb.is-zoomed .plb-frame { overflow: hidden; touch-action: none; }

.plb-nav {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 3; width: 54px; height: 54px; border-radius: 50%;
  border: 1px solid rgba(255,255,255,.16); background: rgba(20,20,20,.55); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  color: var(--paper); display: grid; place-content: center; font-size: 1.2rem; transition: background-color .25s, color .25s, opacity .25s, transform .25s;
}
.plb-nav:hover { background: var(--paper); color: var(--ink); }
.plb-nav.prev { left: clamp(.75rem, 2vw, 1.75rem); } .plb-nav.next { right: clamp(.75rem, 2vw, 1.75rem); }
.plb-nav.prev:hover { transform: translate(-3px, -50%); } .plb-nav.next:hover { transform: translate(3px, -50%); }

/* Miniaturat */
.plb-thumbs {
  display: flex; gap: .5rem; padding: .85rem clamp(1rem, 2vw, 1.75rem) calc(.85rem + env(safe-area-inset-bottom));
  overflow-x: auto; justify-content: safe center; scrollbar-width: none; border-top: 1px solid rgba(255,255,255,.08);
  transition: opacity .25s;
}
.plb-thumbs::-webkit-scrollbar { display: none; }
.plb-thumbs:empty { display: none; }
.plb-thumbs button {
  position: relative; flex: 0 0 88px; aspect-ratio: 4 / 3; padding: 0; border: 0; border-radius: 8px; overflow: hidden; background: #1c1c1c;
  opacity: .45; transition: opacity .25s, transform .25s;
}
.plb-thumbs button::after { content: ""; position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 0 0 2px transparent; transition: box-shadow .25s; }
.plb-thumbs button:hover { opacity: .85; }
.plb-thumbs button.active { opacity: 1; }
.plb-thumbs button.active::after { box-shadow: inset 0 0 0 2px var(--sand); }
.plb-thumbs img { width: 100%; height: 100%; object-fit: cover; display: block; }
.plb.is-single .plb-nav, .plb.is-single .plb-count { display: none; }

@media (max-width: 767.98px) {
  .plb-meta { gap: .7rem; }
  .plb-count { padding-right: .7rem; }
  .plb-count b { font-size: 1.15rem; }
  .plb-title { font-size: .875rem; }
  .plb-cap { font-size: .75rem; }
  .plb-frame { padding: .5rem; }
  .plb-frame img { border-radius: 6px; }
  .plb-nav { top: auto; bottom: .75rem; transform: none; width: 42px; height: 42px; font-size: 1rem; }
  .plb-nav.prev:hover, .plb-nav.next:hover { transform: none; }
  .plb-frame { padding-bottom: 4rem; }
  .plb.is-single .plb-frame { padding-bottom: .5rem; }
  .plb-thumbs { justify-content: flex-start; padding-block: .6rem calc(.6rem + env(safe-area-inset-bottom)); }
  .plb-thumbs button { flex-basis: 62px; border-radius: 6px; }
}
/* Celular horizontal: më shumë vend për foton */
@media (max-height: 500px) and (orientation: landscape) {
  .plb-thumbs, .plb-info { display: none; }
  .plb-top { min-height: 0; padding-block: calc(.4rem + env(safe-area-inset-top)) .4rem; }
  .plb-frame { padding: .4rem 4rem; }
  .plb-nav { top: 50%; bottom: auto; transform: translateY(-50%); }
}

/* Njoftim i shkurtër */
.toast-x {
  position: fixed; left: 50%; bottom: calc(1.5rem + env(safe-area-inset-bottom)); z-index: 3000; transform: translate(-50%, 20px); opacity: 0;
  display: inline-flex; align-items: center; gap: .5rem; background: var(--ink); color: var(--paper); padding: .75rem 1.2rem; border-radius: 999px;
  font-family: var(--f-ui); font-size: .9rem; box-shadow: 0 12px 30px rgba(0,0,0,.25); transition: all .35s var(--ease);
}
.toast-x .bi { color: var(--sand); }
.toast-x.show { opacity: 1; transform: translate(-50%, 0); }
@media (max-width: 991.98px) { .has-detail-bar .toast-x { bottom: calc(86px + env(safe-area-inset-bottom)); } }

/* ---------- Faqja e projekteve (projektet.html) ---------- */
.proj-nav {
  position: sticky; top: 70px; z-index: 1020; background: rgba(255,255,255,.95); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--line); transition: top .5s var(--ease);
}
@media (max-width: 991.98px) { .proj-nav { top: 62px; } }
body:has(.site-header.is-hidden) .proj-nav { top: 0; }
.proj-nav .container-xl { padding-inline: 0; }
@media (min-width: 992px) { .proj-nav .container-xl { padding-inline: 2rem; } }
.proj-nav-inner { display: flex; gap: .25rem; overflow-x: auto; scrollbar-width: none; padding-inline: var(--gutter); }
@media (min-width: 992px) { .proj-nav-inner { padding-inline: 0; } }
.proj-nav-inner::-webkit-scrollbar { display: none; }
.pn-link { flex: 0 0 auto; display: flex; align-items: center; gap: .7rem; padding: .85rem 1rem; text-decoration: none; color: var(--stone); font-family: var(--f-ui); position: relative; transition: color .25s; }
.pn-link:first-child { padding-left: 0; }
.pn-link::after { content: ""; position: absolute; left: 1rem; right: 1rem; bottom: -1px; height: 2px; background: var(--ink); transform: scaleX(0); transform-origin: left; transition: transform .45s var(--ease); }
.pn-link:first-child::after { left: 0; }
.pn-link:hover, .pn-link.active { color: var(--ink); }
.pn-link.active::after { transform: scaleX(1); }
.pn-num { font-family: var(--f-display); font-weight: 600; font-size: 1.15rem; color: transparent; -webkit-text-stroke: 1px var(--sand-deep); }
.pn-link.active .pn-num { color: var(--sand); -webkit-text-stroke: 0; }
.pn-name { font-weight: 500; font-size: .95rem; line-height: 1.2; }
.pn-name small { display: block; font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: var(--stone); font-weight: 400; }

/* Kartat e përmbledhjes */
.proj { padding-block: var(--section-y); scroll-margin-top: 120px; }
/* Pjesa hyrëse e projektit përdor .project-row / .project-media / .project-num nga kreu */
.proj .project-row { margin-bottom: clamp(2.5rem, 2rem + 2.5vw, 4.5rem); }
.proj .project-media { border-radius: var(--radius-lg); }
.proj .project-num { margin-bottom: .5rem; }
.proj .project-name { margin-bottom: .5rem; }
.proj-keys { display: flex; flex-wrap: wrap; gap: 1rem 2.5rem; margin: 1.5rem 0 1.75rem; padding: 1.1rem 0; border-block: 1px solid var(--line); }
.proj-keys dt { font-family: var(--f-ui); font-weight: 500; font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; color: var(--stone); margin-bottom: .2rem; }
.proj-keys dd { font-family: var(--f-display); font-weight: 500; font-size: 1.2rem; margin: 0; }
.proj-where { margin-top: clamp(2.5rem, 2rem + 2.5vw, 4.5rem); padding-top: clamp(2.5rem, 2rem + 2.5vw, 4.5rem); border-top: 1px solid var(--line); }
.proj-where-title { font-size: var(--t-h3); margin-bottom: .75rem; }
.proj-where .nearby { margin-top: 1.25rem; }
.proj-gal-btn {
  position: absolute; right: 1rem; bottom: 1rem; z-index: 4; display: inline-flex; align-items: center; gap: .5rem;
  border: 0; border-radius: 999px; background: var(--paper); color: var(--ink); padding: .6rem 1.1rem; font-family: var(--f-ui); font-size: .875rem; box-shadow: 0 8px 24px rgba(0,0,0,.18); transition: transform .3s var(--ease);
}
.proj-gal-btn:hover { transform: translateY(-2px); }
/* Slider-i te "Projektet" (main.js → [data-slider]): parallax-i te pista */
.project-media .pm-track { position: absolute; left: 0; top: -9%; width: 100%; height: 118%; will-change: transform; }
.project-media .pm-track img { top: 0; height: 100%; opacity: 0; will-change: auto; }
.project-media .pm-track img.is-active { opacity: 1; z-index: 1; }
.js [data-reveal="clip"] img.pm-slide { transition: opacity 1.2s var(--ease), transform 2s var(--ease), filter 1.6s var(--ease); }
.pm-nav {
  position: absolute; top: 50%; z-index: 4; display: grid; place-content: center; width: 42px; height: 42px; margin-top: -21px; padding: 0;
  border: 0; border-radius: 50%; background: rgba(255,255,255,.9); color: var(--ink); font-size: 1rem; box-shadow: 0 6px 18px rgba(0,0,0,.18);
  opacity: .45; transition: opacity .3s var(--ease), transform .3s var(--ease), background-color .3s;
}
.pm-prev { left: 1rem; }
.pm-next { right: 1rem; }
.project-media:hover .pm-nav { opacity: .7; }
.project-media .pm-nav:hover, .pm-nav:focus-visible { opacity: 1; background: var(--paper); transform: scale(1.08); }
.pm-ctrl { position: absolute; left: 1rem; bottom: 1rem; z-index: 4; display: flex; align-items: center; gap: .5rem; padding: 3px .7rem 3px 3px; border-radius: 999px; background: rgba(14,14,14,.5); backdrop-filter: blur(6px); }
.pm-pause { display: grid; place-content: center; width: 34px; height: 34px; padding: 0; border: 0; border-radius: 50%; background: rgba(14,14,14,.55); color: var(--paper); font-size: .95rem; backdrop-filter: blur(4px); }
.pm-ctrl .pm-pause { width: 30px; height: 30px; background: rgba(255,255,255,.14); backdrop-filter: none; }
.pm-pause:hover, .pm-ctrl .pm-pause:hover { background: var(--ink); }
.pm-dots { display: flex; gap: .35rem; }
.pm-dots button { position: relative; width: 18px; height: 24px; padding: 0; border: 0; background: none; }
.pm-dots button::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 3px; margin-top: -1.5px; border-radius: 2px; background: rgba(255,255,255,.55); box-shadow: 0 1px 4px rgba(0,0,0,.3); transition: background-color .3s, transform .3s var(--ease); }
.pm-dots button[aria-current]::before { background: var(--paper); transform: scaleY(1.6); }
@media (max-width: 575.98px) {
  .pm-nav { width: 36px; height: 36px; margin-top: -18px; font-size: .85rem; }
  .pm-prev { left: .6rem; }
  .pm-next { right: .6rem; }
  .pm-ctrl { left: .75rem; bottom: .75rem; gap: .4rem; }
  .pm-dots { gap: .2rem; }
  .pm-dots button { width: 12px; }
  .proj-gal-btn { right: .75rem; bottom: .75rem; padding: .5rem .85rem; font-size: .8125rem; }
}
.proj-body { display: grid; gap: 2rem; align-items: start; }
@media (min-width: 992px) { .proj-body { grid-template-columns: minmax(0, 1fr) 370px; gap: 3rem; } }
@media (min-width: 1200px) { .proj-body { grid-template-columns: minmax(0, 1fr) 400px; } }
.proj-about h3, .proj-avail h3 { font-size: 1.4rem; margin-bottom: 1rem; }
.proj-highlights { list-style: none; padding: 0; margin: 1.75rem 0 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); gap: 1.25rem 1.75rem; }
.proj-highlights li { display: flex; gap: .9rem; align-items: flex-start; }
.proj-highlights .bi { flex: 0 0 44px; height: 44px; display: grid; place-content: center; border-radius: 50%; background: var(--sand-wash); color: var(--sand-deep); font-size: 1.1rem; }
.section-wash .proj-highlights .bi { background: var(--paper); }
.proj-highlights strong { display: block; font-family: var(--f-display); font-weight: 600; font-size: 1.1rem; margin-bottom: .1rem; }
.proj-highlights span { color: var(--stone); font-size: .975rem; line-height: 1.45; }

.proj-avail { border: 1px solid var(--line); border-radius: var(--radius-lg); padding: clamp(1.25rem, 1rem + 1vw, 1.75rem); background: var(--paper); box-shadow: 0 24px 60px -34px rgba(14,14,14,.3); }
.proj-avail h3 { display: flex; align-items: center; gap: .55rem; }
.proj-avail h3 .bi { color: var(--sand-deep); font-size: 1.1rem; }
.avail-list { list-style: none; padding: 0; margin: 0 0 1.25rem; border-top: 1px solid var(--line); }
.avail-list a { display: grid; grid-template-columns: minmax(0, 1fr) 16px; gap: .75rem; align-items: center; padding: .9rem 0; border-bottom: 1px solid var(--line); color: var(--ink); text-decoration: none; transition: padding .35s var(--ease), color .25s; }
.avail-list a:hover { padding-left: .4rem; color: var(--sand-deep); }
.al-main { display: flex; flex-wrap: wrap; align-items: baseline; gap: .1rem .75rem; min-width: 0; }
.al-type { font-family: var(--f-display); font-weight: 600; font-size: 1.15rem; }
.al-area { font-family: var(--f-ui); font-size: .85rem; color: var(--stone); }
.avail-list .bi { color: var(--stone); font-size: .85rem; }


/* Tabela e krahasimit */

/* ---------- Rreth nesh / tekst ---------- */
.values { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1.5rem; }
.values h3 { font-size: var(--t-h3); }
.values > div { border-top: 2px solid var(--sand); padding-top: 1.25rem; }
.values .bi { font-size: 2rem; color: var(--sand-deep); display: block; margin-bottom: 1rem; }

/* ---------- Faqja e privatësisë: përmbajtja anësore + seksione të numëruara ---------- */
.legal-grid { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: clamp(2rem, 1rem + 4vw, 5rem); align-items: start; }
.legal-aside { position: sticky; top: calc(var(--header-h) + 1.5rem); }
.legal-toc-h { font-family: var(--f-ui); font-size: .75rem; letter-spacing: .16em; text-transform: uppercase; color: var(--stone); margin-bottom: .75rem; }
.legal-toc ol { list-style: none; padding: 0; margin: 0; border-left: 1px solid var(--line); }
.legal-toc a { display: flex; gap: .65rem; padding: .4rem 0 .4rem 1rem; margin-left: -1px; border-left: 2px solid transparent; font-family: var(--f-ui); font-size: .875rem; color: var(--stone); text-decoration: none; transition: color .25s, border-color .25s; }
.legal-toc a span { color: var(--sand-deep); font-variant-numeric: tabular-nums; }
.legal-toc a:hover { color: var(--ink); }
.legal-toc a.active { color: var(--ink); border-left-color: var(--ink); font-weight: 500; }
.legal-body { max-width: 760px; }
.legal-updated { display: inline-flex; align-items: center; gap: .5rem; font-family: var(--f-ui); font-size: .8125rem; color: var(--stone); border: 1px solid var(--line); border-radius: 999px; padding: .35rem .9rem; margin-bottom: 1.5rem; }
.legal-updated .bi { color: var(--sand-deep); }
.legal-summary { background: var(--sand-wash); border-radius: var(--radius-lg); padding: clamp(1.1rem, .9rem + 1vw, 1.75rem); margin-bottom: clamp(1.5rem, 1rem + 1.5vw, 2.5rem); }
.legal-summary ul { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.1rem 1.5rem; }
.legal-summary li { display: flex; gap: .8rem; align-items: flex-start; }
.legal-summary .bi { flex: 0 0 40px; height: 40px; display: grid; place-content: center; border-radius: 50%; background: var(--paper); color: var(--sand-deep); font-size: 1.1rem; }
.legal-summary strong { display: block; font-family: var(--f-display); font-weight: 600; font-size: 1.05rem; }
.legal-summary span { display: block; font-family: var(--f-ui); font-size: .875rem; color: var(--stone); line-height: 1.45; }
.legal-sec { padding-block: clamp(1.25rem, 1rem + 1vw, 1.75rem); border-top: 1px solid var(--line); scroll-margin-top: calc(var(--header-h) + 1rem); }
.legal-sec h2 { display: flex; align-items: baseline; gap: .75rem; font-size: clamp(1.35rem, 1.15rem + .7vw, 1.75rem); margin-bottom: .9rem; }
.legal-num { font-family: var(--f-ui); font-size: .8rem; font-weight: 500; letter-spacing: .08em; color: var(--sand-deep); }
.legal-sec h3 { font-size: 1.1rem; margin: 1.1rem 0 .5rem; }
.legal-sec p, .legal-sec li { line-height: 1.65; }
.legal-sec ul { padding-left: 1.2rem; margin-bottom: 1rem; }
.legal-sec li + li { margin-top: .3rem; }
.legal-sec li::marker { color: var(--sand-deep); }
.legal-sec a { color: var(--ink); text-decoration-color: var(--sand); text-underline-offset: 3px; }
.legal-sec ul.legal-contact, .legal-sec ul.legal-rights { list-style: none; padding: 0; }
.legal-contact { display: grid; gap: .55rem; font-family: var(--f-ui); }
.legal-contact li, .legal-rights li { display: flex; gap: .7rem; align-items: baseline; }
.legal-contact .bi, .legal-rights .bi { color: var(--sand-deep); flex-shrink: 0; }
.legal-table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--radius); margin-bottom: 1rem; }
.legal-table { width: 100%; border-collapse: collapse; font-family: var(--f-ui); font-size: .875rem; }
.legal-table th { text-align: left; font-weight: 500; font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; color: var(--stone); background: var(--sand-wash); }
.legal-table th, .legal-table td { padding: .7rem .9rem; border-bottom: 1px solid var(--line); vertical-align: top; }
.legal-table tr:last-child td { border-bottom: 0; }
.legal-table code { font-size: .8125rem; color: var(--ink); background: var(--sand-wash); padding: .1rem .4rem; border-radius: 4px; white-space: nowrap; }
.legal-list { margin: 0; display: grid; gap: .75rem; }
.legal-list > div { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 1rem; padding: .85rem 1rem; border: 1px solid var(--line); border-radius: var(--radius); }
.legal-list dt { font-family: var(--f-ui); font-weight: 500; display: flex; gap: .5rem; align-items: baseline; }
.legal-list dt .bi { color: var(--sand-deep); }
.legal-list dd { margin: 0; color: var(--stone); line-height: 1.55; }
.legal-cta { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1.25rem 2rem; margin-top: 1rem; padding: clamp(1.25rem, 1rem + 1vw, 2rem); background: var(--ink); color: var(--paper); border-radius: var(--radius-lg); }
.legal-cta h2 { font-size: clamp(1.3rem, 1.1rem + .7vw, 1.7rem); margin-bottom: .3rem; }
.legal-cta p { margin: 0; color: rgba(255,255,255,.7); font-family: var(--f-ui); font-size: .9375rem; }
.legal-cta-actions { display: flex; flex-wrap: wrap; gap: .6rem; }
.legal-cta .btn-brand { background: var(--sand); border-color: var(--sand); color: var(--ink); }
.legal-cta .btn-outline-dark { --bs-btn-color: var(--paper); --bs-btn-border-color: rgba(255,255,255,.4); color: var(--paper); border-color: rgba(255,255,255,.4); }
@media (max-width: 991.98px) {
  .legal-grid { grid-template-columns: 1fr; gap: 1.5rem; }
  .legal-aside { position: static; }
  .legal-toc { border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 1rem 1.1rem .6rem; }
  .legal-toc ol { border: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 1rem; }
  .legal-toc a { padding: .35rem 0; border: 0; margin: 0; }
}
@media (max-width: 575.98px) {
  .legal-toc ol { grid-template-columns: 1fr; }
  .legal-summary ul { grid-template-columns: 1fr; gap: .9rem; }
  .legal-list > div { grid-template-columns: 1fr; gap: .3rem; }
  .legal-table thead { display: none; }
  .legal-table tr { display: grid; grid-template-columns: 1fr auto; gap: .35rem 1rem; padding: .8rem .9rem; border-bottom: 1px solid var(--line); }
  .legal-table tr:last-child { border-bottom: 0; }
  .legal-table td { padding: 0; border: 0; }
  .legal-table td:nth-child(2) { grid-column: 1 / -1; grid-row: 2; }
  .legal-table td:nth-child(3) { grid-row: 1; grid-column: 2; color: var(--stone); font-size: .8125rem; text-align: right; }
  .legal-toc { padding: .9rem 1rem .5rem; }
  .legal-toc a { padding: .3rem 0; }
  .legal-cta-actions, .legal-cta-actions .btn { width: 100%; }
  .legal-cta-actions .btn { justify-content: center; }
}
.mission { background: var(--paper); border-radius: var(--radius); padding: 2rem; height: 100%; border: 1px solid var(--line); transition: transform .5s var(--ease), box-shadow .5s var(--ease); }
.mission:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.mission .bi { font-size: 2.2rem; color: var(--sand-deep); display: block; margin-bottom: 1.25rem; }
.mission h3 { font-size: 1.6rem; }

/* ---------- Footer ---------- */
.site-footer { background: var(--ink); color: #cfcfcf; padding-block: clamp(2.5rem, 2rem + 2.5vw, 3.75rem) 1.25rem; font-family: var(--f-ui); position: relative; overflow: hidden; }
.footer-cta { display: flex; justify-content: space-between; align-items: end; gap: 2rem; flex-wrap: wrap; padding-bottom: clamp(1.75rem, 1.25rem + 1.5vw, 2.5rem); margin-bottom: clamp(1.75rem, 1.25rem + 1.5vw, 2.5rem); border-bottom: 1px solid var(--line-dark); }
/* Kreu: titulli majtas, harta e zyrës djathtas */
.footer-cta.has-map { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); align-items: center; gap: 1.5rem clamp(2rem, 1rem + 4vw, 5rem); }
.fc-map { aspect-ratio: 16 / 9; border: 1px solid rgba(255,255,255,.08); box-shadow: 0 30px 70px -40px rgba(0,0,0,.8); }
.fc-map .location-card { color: var(--ink); }
.fc-map .location-card a { color: var(--ink); }
@media (max-width: 991.98px) { .footer-cta.has-map { grid-template-columns: 1fr; } .fc-map { aspect-ratio: 4 / 3; } }
/* Rreshti kryesor: logoja + motoja · kontaktet · rrjetet sociale */
.footer-main { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) auto; gap: 1.75rem clamp(2rem, 1rem + 4vw, 5rem); align-items: start; }
@media (max-width: 767.98px) { .footer-main { grid-template-columns: 1fr auto; } .fm-brand { grid-column: 1 / -1; } }
.footer-cta h2 { font-size: clamp(2rem, 1.4rem + 2.6vw, 4rem); color: var(--paper); max-width: 16ch; margin: 0; }
.footer-cta h2 em { font-style: normal; color: var(--sand); }
.site-footer a { color: #fff; text-decoration: none; }
.site-footer a:hover { color: var(--sand); }
.footer-logo { height: 56px; width: auto; margin-bottom: 1rem; }
.footer-tagline { font-family: var(--f-serif); font-size: 1.125rem; color: #fff; max-width: 30ch; margin: 0; }
.footer-h { font-family: var(--f-ui); font-size: .78rem; letter-spacing: .2em; text-transform: uppercase; font-weight: 500; color: var(--sand); margin-bottom: 1rem; }
.footer-list li { margin-bottom: .55rem; display: flex; gap: .6rem; align-items: baseline; }
.footer-list .bi { color: var(--sand); }
.footer-list a { position: relative; }
.social { display: flex; gap: .5rem; }
.social a { width: 44px; height: 44px; display: grid; place-content: center; border: 1px solid #3a3a3a; border-radius: 50%; font-size: 1.05rem; transition: all .35s var(--ease); }
.social a:hover { border-color: var(--sand); background: var(--sand); color: var(--ink); transform: translateY(-3px); }
.footer-bottom {
  margin-top: clamp(1.5rem, 1.25rem + 1vw, 2.25rem); padding-top: 1.1rem; border-top: 1px solid var(--line-dark);
  display: flex; justify-content: space-between; flex-wrap: wrap; gap: .75rem; font-size: .875rem; color: #8a8a8a;
}
.footer-bottom a { color: #8a8a8a; }
.footer-legal { display: flex; flex-wrap: wrap; gap: .4rem 1.25rem; }
.footer-link-btn { background: none; border: 0; padding: 0; font: inherit; color: #8a8a8a; cursor: pointer; transition: color .2s; }
.footer-link-btn:hover, .footer-bottom a:hover { color: var(--sand); }

/* ---------- Banner-i i pëlqimit për cookies (components.js) ---------- */
.cookie-bar {
  position: fixed; left: 1.1rem; bottom: 1.1rem; z-index: 1060; max-width: 460px;
  display: flex; flex-direction: column; gap: 1rem; padding: 1.15rem 1.25rem;
  background: var(--ink); color: rgba(255,255,255,.78); border: 1px solid var(--line-dark); border-radius: var(--radius);
  box-shadow: 0 18px 50px rgba(0,0,0,.28); font-family: var(--f-ui); font-size: .875rem; line-height: 1.55;
  opacity: 0; transform: translateY(16px); transition: opacity .4s var(--ease), transform .4s var(--ease);
}
.cookie-bar.is-open { opacity: 1; transform: none; }
.cookie-bar-text { display: flex; gap: .85rem; align-items: flex-start; }
.cookie-bar-text .bi { color: var(--sand); font-size: 1.35rem; line-height: 1; margin-top: .1rem; }
.cookie-bar p { margin: 0; }
.cookie-bar a { color: var(--sand); text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }
.cookie-bar-actions { display: flex; gap: .5rem; justify-content: flex-end; }
.cookie-bar-actions .btn { min-width: 110px; }
@media (max-width: 575.98px) {
  .cookie-bar { left: .75rem; right: .75rem; bottom: .75rem; max-width: none; }
  .cookie-bar-actions .btn { flex: 1; }
}
.footer-word { font-family: var(--f-display); font-weight: 600; font-size: clamp(5rem, 18vw, 17rem); line-height: .8; color: transparent; -webkit-text-stroke: 1px #262626; position: absolute; left: 50%; bottom: -.12em; transform: translateX(-50%); white-space: nowrap; pointer-events: none; user-select: none; }
.site-footer .container-xl { position: relative; z-index: 1; }

/* ---------- Butonat lundrues ---------- */
.float-stack { position: fixed; right: 1.1rem; bottom: 1.1rem; z-index: 1040; display: flex; flex-direction: column; gap: .6rem; align-items: center; }
.to-top {
  width: 48px; height: 48px; border-radius: 50%; border: 0; background: var(--paper); color: var(--ink); box-shadow: 0 6px 20px rgba(0,0,0,.15);
  display: grid; place-content: center; position: relative; opacity: 0; transform: translateY(10px); pointer-events: none; transition: all .4s var(--ease);
}
.to-top.show { opacity: 1; transform: none; pointer-events: auto; }
.to-top svg { position: absolute; inset: 0; transform: rotate(-90deg); }
.to-top circle { fill: none; stroke: var(--sand); stroke-width: 2; stroke-dasharray: 145; stroke-dashoffset: 145; }
.wa-float {
  width: 56px; height: 56px; border-radius: 50%; display: grid; place-content: center; font-size: 1.5rem;
  background: #25d366; color: #fff; text-decoration: none; box-shadow: 0 8px 24px rgba(37,211,102,.35); transition: transform .35s var(--ease);
}
.wa-float:hover { color: #fff; transform: scale(1.08); }

/* ---------- Animacionet e scroll-it ---------- */
.js [data-reveal] { opacity: 0; transition: opacity 1s var(--ease), transform 1s var(--ease), clip-path 1.3s var(--ease); transition-delay: var(--delay, 0s); }
.js [data-reveal="up"] { transform: translateY(40px); }
.js [data-reveal="left"] { transform: translateX(-40px); }
.js [data-reveal="right"] { transform: translateX(40px); }
.js [data-reveal="zoom"] { transform: scale(.94); }
/* Celular: hyrja anësore (±40px) do ta zgjeronte faqen përtej ekranit → ngjitet nga poshtë */
@media (max-width: 767.98px) { .js [data-reveal="left"], .js [data-reveal="right"] { transform: translateY(40px); } }
/* "clip": grilë dritareje (lamela ngjyrë rëre) që ngrihet lart si një trup i vetëm; drita "hyn" dhe imazhi ndriçohet */
.js [data-reveal="clip"] { opacity: 1; position: relative; overflow: hidden; isolation: isolate; --shutter: 1.5s cubic-bezier(.76, 0, .2, 1); }
.js [data-reveal="clip"]::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: calc(100% + 16px); z-index: 3; pointer-events: none;
  background:
    linear-gradient(to bottom, #a8896a, #8a6f55) bottom / 100% 16px no-repeat,                         /* shina e poshtme */
    linear-gradient(to bottom, rgba(255,255,255,.12), rgba(0,0,0,.08)),                                /* drita e përgjithshme */
    repeating-linear-gradient(to bottom,
      #dcc4a8 0, #d3b899 5px, #c6a98a 11px, #a88b6d 12.5px, #e9d8c3 13.5px, #dcc4a8 15px);            /* lamelat me hapësirë të errët + vijë drite */
  box-shadow: 0 14px 28px rgba(14,14,14,.28);                                                         /* hija mbi imazhin */
  transform: translateY(0); transition: transform var(--shutter); transition-delay: var(--delay, 0s);
}
.js [data-reveal="clip"] img:not([data-parallax]) {
  transform: scale(1.12);
  transition: transform 2s var(--ease), filter 1.6s var(--ease); transition-delay: calc(var(--delay, 0s) + .15s);
}
.js [data-reveal].is-visible { opacity: 1; transform: none; }
.js [data-reveal="clip"].is-visible::before { transform: translateY(calc(-100% - 60px)); }
.js [data-reveal="clip"]:not(.is-visible) img { filter: brightness(.72) saturate(.85); }
.js [data-reveal="clip"].is-visible img:not([data-parallax]) { transform: scale(1); }
.js [data-reveal="clip"][data-map].is-open img { transition: transform 1.2s var(--ease), filter .5s var(--ease); }

/* ---------- Ikonat brenda rrathëve: gjithmonë në qendër të saktë ----------
   Fonti i ikonave (Bootstrap Icons) e mbush saktësisht kutinë 1em (ascent = 1em, descent = 0). Si tekst, ikona
   trashëgon line-height-in e paragrafit (1.7) dhe vertical-align: -.125em → del pak më poshtë qendrës.
   Këtu ikona bëhet bllok 1em × 1em, kështu që grid-i i rrethit (place-content: center) e vendos në mes.
   Rreth i ri me ikonë: shtojeni selektorin te njëra nga dy listat. */
/* 1. Rrethi është vetë ikona (<i class="bi …">) */
:is(.dlg-title > .bi, .header-phone .bi, .check-list .bi, .nearby .bi, .contact-tile > .bi:first-child,
    .proj-highlights .bi, .legal-summary .bi)::before { display: block; line-height: 1; vertical-align: 0; }
/* 2. Rrethi është një element që përmban ikonën */
:is(.dlg-btn, .dlg-close, .prop-view, .car-btn, .feature-icon, .location-pin, .step-icon,
    .db-icon, .plb-nav, .social a, .to-top, .wa-float, .plb-wa) > .bi { display: block; line-height: 1; }
:is(.dlg-btn, .dlg-close, .prop-view, .car-btn, .feature-icon, .location-pin, .step-icon,
    .db-icon, .plb-nav, .social a, .to-top, .wa-float, .plb-wa) > .bi::before { display: block; line-height: 1; vertical-align: 0; }

/* ---------- Responsive ---------- */
@media (max-width: 991.98px) {
  :root { --header-h: 68px; }
  .brand img { height: 44px; }
  .is-scrolled .brand img { height: 40px; }
  .site-header.is-scrolled { --header-h: 62px; height: 62px; }
  /* Pallatet: në tablet/celular nuk fshihen — dalin poshtë tekstit (në rrjedhë, jo mbi të), në qendër
     (djathtas i mbulojnë butonat lundrues), të ulur në fund të seksionit */
  .statement { padding-bottom: 0; }
  .statement .bars { --k: .85; position: relative; right: auto; height: 240px; width: max-content; margin: 2.5rem auto 0; }
  .hero::before { background: linear-gradient(180deg, rgba(12,32,56,.7) 0%, rgba(12,32,56,.55) 45%, rgba(12,32,56,.25) 75%, rgba(12,32,56,.45) 100%); }
}
@media (max-width: 575.98px) {
  .prop-facts { column-gap: .75rem; }
  .statement .bars { --k: .72; height: 200px; margin-top: 2rem; }
  .wa-float { width: 50px; height: 50px; }
  .features { grid-template-columns: 1fr; }
}

/* ---------- Celular: hapësira kompakte ---------- */
@media (max-width: 575.98px) {
  :root { --section-y: 2.75rem; --gutter: 1rem; }
  .row.g-4 { --bs-gutter-y: 1.25rem; }
  .section-head { margin-bottom: 1.25rem; gap: .75rem; }
  .section-title { margin-bottom: .75rem; }
  .section-intro { font-size: 1.0625rem; }
  .lead-serif { font-size: 1.25rem; line-height: 1.5; }

  .hero { padding-block: calc(var(--header-h) + 1.25rem) calc(1.75rem + var(--car-lift, var(--car-lift-est))); }
  .hero-title { margin-bottom: 1rem; }

  .about-media { padding: 0 10% 12% 0; }
  .about-media .img-float { border-width: 6px; }
  .check-list { margin: 1rem 0 1.5rem; gap: .65rem; }
  .check-list li { font-size: 1rem; }

  .prop-body { padding: 1.1rem 1.1rem 1rem; }
  .prop-loc { margin-bottom: .85rem; font-size: .95rem; }
  .prop-facts { padding-top: .8rem; }
  .status { left: .75rem; top: .75rem; }

  .project-row + .project-row { margin-top: 2.5rem; }
  .project-num { font-size: 3.5rem; margin-bottom: .5rem; }
  .project-tag { left: .75rem; top: .75rem; }
  .feature { padding: 1.5rem 1.25rem; }
  .feature-icon { width: 50px; height: 50px; font-size: 1.35rem; margin-bottom: 1rem; }
  .feature h3 { font-size: 1.25rem; }
  .feature p, .step p { font-size: 1rem; }

  .location-card { left: .75rem; right: .75rem; bottom: .75rem; padding: .8rem 1rem; }
  .nearby li { grid-template-columns: 42px 1fr auto; gap: .8rem; padding: .75rem 0; }
  .nearby .bi { width: 42px; height: 42px; font-size: 1rem; }
  .nearby strong { font-size: 1.1rem; }
  .steps { gap: 1.25rem; }
  .step { padding-top: .5rem; }
  .step-icon { width: 60px; height: 60px; font-size: 1.35rem; margin-bottom: 1rem; }
  .statement .quote-icon { font-size: 2.25rem; margin-bottom: .75rem; }
  .contact-tile { padding: .8rem .95rem; gap: .8rem; }
  .contact-tile > .bi:first-child { width: 40px; height: 40px; font-size: 1rem; }

  .page-head { padding-block: calc(var(--header-h) + 1.5rem) 1.75rem; }
  .page-head .breadcrumb { margin-bottom: .9rem; }
  .listing { padding-top: 1rem; }

  .detail-top { padding-top: .75rem; margin-bottom: 1rem; }
  .pd-cat { margin-bottom: .75rem; }
  .pd-card { padding: 1.15rem; }
  .pd-facts dd { font-size: 1.3rem; }
  .pv-tag { left: .75rem; top: .75rem; }
  .pv-zoom { right: .75rem; bottom: .75rem; }
  .pd-desc { font-size: 1.15rem; }
  .prop-pager { padding-top: 1.25rem; }
  .prop-pager { margin-block: 2rem 2.25rem; }

  .proj-body { gap: 1.5rem; }
  .proj-highlights { margin-top: 1.25rem; gap: 1rem; }
  .proj-highlights .bi { flex-basis: 38px; height: 38px; font-size: 1rem; }
  .proj-avail { padding: 1.1rem; }

  .values { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem 1rem; }
  .values > div { padding-top: 1rem; }
  .values .bi { font-size: 1.6rem; margin-bottom: .6rem; }
  .values h3 { font-size: 1.2rem; margin-bottom: .35rem; }
  .values p { font-size: .95rem; margin-bottom: 0; }
  .mission { padding: 1.5rem; }
  .mission .bi { font-size: 1.9rem; margin-bottom: 1rem; }

  .site-footer { padding-block: 2.75rem 1.25rem; }
  .footer-cta { padding-bottom: 1.75rem; margin-bottom: 1.75rem; gap: 1.25rem; }
  .footer-logo { height: 52px; margin-bottom: 1rem; }
  .footer-h { margin-bottom: .75rem; }
  .footer-list li { margin-bottom: .55rem; }
  .footer-list a { overflow-wrap: anywhere; }
  .social { margin-top: 1.1rem; }
  .footer-bottom { margin-top: 1.75rem; padding-top: 1rem; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .js [data-reveal] { opacity: 1 !important; transform: none !important; }
  .js [data-reveal="clip"]::before { display: none; }
  .hero-title .line > span, .hero-fade { transform: none !important; opacity: 1 !important; }
}

.container-xl { padding-inline: var(--gutter); }
@media (min-width: 992px) { .container-xl { padding-inline: 2rem; } }

/* Renderat dhe planimetritë e pronave (assets/img/prona/) shfaqen gjithmonë të plota, pa prerje,
   në çdo kornizë (karta, mozaik, galeri, miniatura). Sfondi i bardhë përputhet me sfondin e imazheve. */
img[src*="img/prona/"] { object-fit: contain !important; background: #fff; }
.prop-media:has(img[src*="img/prona/"])::after { opacity: .35; }   /* gradienti më i lehtë mbi sfondin e bardhë */
img[src*="-foto"] { object-fit: cover !important; }                 /* fotot reale (vertikale) mbushin kornizën */
/* Renderat e jashtme të Sun Moon Star (sms-kulla, -fasada…) janë foto të plota, pa sfond të bardhë → mbushin kornizën */
img[src*="sms-pamja"], img[src*="sms-kulla"], img[src*="sms-bulevardi"], img[src*="sms-fasada"], img[src*="sms-sheshi"], img[src*="sms-rruga"], img[src*="sms-pasazhi"], img[src*="sms-hyrja"] { object-fit: cover !important; }