/* ============================================================
   i18n-r01.css — CC-LANG-01 · SR / EN / FR
   R404_MULTILINGUAL_R01 (2026-08-25)

   Dodatni sloj. NIJEDNO postojeće pravilo iz `site.css` se ne menja i
   ne prepisuje — ovde žive samo stvari kojih na jednojezičnom sajtu
   nije ni bilo (birač jezika) i sitne korekcije koje traži DUŽI tekst
   na engleskom i francuskom.

   Zašto poseban fajl a ne dopuna `site.css`: `site.css` nosi otisak
   sadržaja u imenu (`site.<sha10>.css`) i keširan je godinu dana kao
   `immutable`. Menjati ga znači menjati otisak na svim srpskim stranama.
   R03 je to jednom uradio SVESNO — ispravka mete za prst je pripadala
   `site.css` jer se tiče srpskog izgleda, pa je fajl preimenovan i sve
   reference prepisane (dokaz: `01_INVENTORY/SR_SOURCE_DIFF_R03.md`).
   Lokalizacioni slojevi i dalje idu ovde, ne tamo.

   Boje su isključivo postojeći SIGNAL tokeni: --ink, --muted, --gold,
   --line, --line-strong, --panel, --bg-2. Nova paleta se ne uvodi.
   ============================================================ */

/* ============================================================
   1 · BIRAČ JEZIKA U TRACI (desktop, ≥1024 px)

   Traka se skuplja na 1023 px (`site.css`: .nav-links,.nav-cta →
   display:none). Iznad tog praga birač stoji u traci, ispod njega
   pripada fioci — jedan birač po širini, nikad dva.
   ============================================================ */
.lang-switch {
  display: inline-flex;
  align-items: stretch;
  gap: 2px;
  flex: 0 0 auto;
  padding: 3px;
  border: 1px solid var(--line-strong, rgba(244, 240, 230, 0.16));
  border-radius: 999px;
  background: rgba(244, 240, 230, 0.02);
  font-family: var(--font-m, 'IBM Plex Mono', Consolas, monospace);
}

.lang-opt {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  min-height: 30px;
  padding: 0 9px;
  border-radius: 999px;
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: 0.08em;
  line-height: 1;
  color: var(--dim, #8b877b);
  text-decoration: none;
  transition: color 160ms ease, background 160ms ease;
}

.lang-opt:hover { color: var(--ink, #f4f0e6); background: rgba(244, 240, 230, 0.05); }

/* Trenutni jezik nosi PUNU pločicu, ne samo drugu boju teksta: oblik je
   signal koji se vidi i bez razlikovanja boja. `aria-current` nosi istu
   informaciju za čitače ekrana. */
.lang-opt[aria-current="true"] {
  background: var(--gold, #e9b850);
  color: #131208;
  font-weight: 700;
}
.lang-opt[aria-current="true"]:hover { background: var(--gold-hi, #ffe2a0); color: #131208; }
.lang-opt:focus-visible { outline: 2px solid var(--gold-hi, #ffe2a0); outline-offset: 2px; }

@media (max-width: 1023px) {
  .nav-in .lang-switch { display: none; }
}

/* ============================================================
   2 · BIRAČ JEZIKA U FIOCI (mobilni, ≤1023 px)

   Zaseban red na dnu fioke, iznad telefona. Segmenti su 44×44 px —
   iznad praga za prst i na 320 px širine.
   ============================================================ */
/* `site.css` drži podnožje fioke kao JEDAN red:
   `display:flex; justify-content:space-between` — CTA levo, telefon desno.
   Birač jezika je treći element i na 390 px ih sve tri sabije: francuski
   CTA („Envoyer une demande") se prelomi u tri reda, a telefon i birač
   iscure iz vidljivog dela.

   Curenje se NE vidi u proveri vodoravnog preloma dokumenta, jer je
   `.menu` fiksiran i sam odseca sadržaj — otkriveno je tek gledanjem
   snimka na 390 px. Zato `qa.js` sada meri i to.

   Rešenje je najmanje moguće: podnožje sme da prelomi, a birač uzima svoj
   red preko cele širine. Na uskim ekranima i CTA ide u svoj red, jer
   „Envoyer une demande" i broj telefona ne staju jedno pored drugog.
   Pravila važe samo tamo gde se ovaj fajl učitava — a to su isključivo
   strane koje birač i imaju. */
.menu-foot { flex-wrap: wrap; }

.menu-lang {
  flex: 1 0 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--line, rgba(244, 240, 230, 0.09));
}

/* CTA preko cele širine SAMO na engleskom i francuskom. Srpski „Pošaljite
   upit" i broj telefona staju jedno pored drugog i tako su i izgledali pre
   ove runde — §25 traži 0 regresija na srpskom, a promena rasporeda koju
   niko nije tražio jeste regresija, i kad izgleda bolje. */
@media (max-width: 460px) {
  html[lang="en"] .menu-foot .btn,
  html[lang="fr"] .menu-foot .btn { flex: 1 0 100%; justify-content: center; }
  html[lang="en"] .menu-foot .menu-tel,
  html[lang="fr"] .menu-foot .menu-tel { margin-top: 4px; }
}

.menu-lang-h {
  font-family: var(--font-m, 'IBM Plex Mono', Consolas, monospace);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--dim, #8b877b);
  flex: 0 1 auto;
  min-width: 0;
}

/* Fioka daje svakom <a> svoju tipografiju (`.mnav a`), pa se ovde mora
   nadjačati na nivou segmenta — inače se SR/EN/FR sudare u pločici.

   Visina je 44 px, ne 38: QA na 768 px je izmerio 44×38 i prijavio metu
   nižu od praga. 38 px je bilo dovoljno da izgleda uredno, ali meta za
   prst se ne meri okom. */
.menu-lang .lang-switch { padding: 2px; }
.menu-lang .lang-switch .lang-opt {
  min-width: 44px;
  min-height: 44px;
  padding: 0 10px;
  font-family: var(--font-m, 'IBM Plex Mono', Consolas, monospace);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border-bottom: 0;
}

@media (max-width: 360px) {
  .menu-lang { gap: 8px; }
  .menu-lang .lang-switch .lang-opt { min-width: 40px; padding: 0 6px; }
}

/* ============================================================
   3 · DUŽI TEKST — korekcije, ne redizajn

   Engleski i francuski su na istim mestima duži od srpskog: francuski
   po pravilu 15–25 %, engleski oko 5–10 % na naslovima, ali znatno više
   na dugmadima („Send an enquiry" vs „Pošaljite upit" je granični
   slučaj, „Demande de devis gratuit" prelazi). Ova pravila NE menjaju
   ni jedan raspored — samo dozvoljavaju da tekst prelomi umesto da
   iscuri iz elementa.
   ============================================================ */

/* Dugmad: srpski nikad ne prelama CTA. Francuski ume. Umesto sužavanja
   fonta (što bi razbilo ritam trake) dozvoljava se prelom u dva reda,
   sa `text-wrap: balance` da drugi red ne ostane sa jednom rečju. */
html[lang="en"] .btn,
html[lang="fr"] .btn {
  white-space: normal;
  text-wrap: balance;
}

/* Traka: francuske stavke su duže, pa im treba tešnji razmak pre nego
   što se traka slomi na burger. Prag 1023 ostaje nepromenjen. */
html[lang="fr"] .nav-links { gap: clamp(13px, 1.5vw, 26px); }

/* Naslovi: `Archivo` na 800 sa vrlo tesnim `letter-spacing` ume da
   preseče duže francuske reči na uskim ekranima. Prelom reči je
   dozvoljen samo tamo gde je alternativa vodoravno curenje. */
html[lang="fr"] h1,
html[lang="fr"] h2,
html[lang="en"] h1,
html[lang="en"] h2 { overflow-wrap: break-word; }

/* Tabele poređenja: francuski „Ce qui vous arrive" / „Ce qui règle le
   problème" su duži od srpskih zaglavlja, pa se ćelije na tabletu
   sabijaju. Malo manji korak fonta rešava bez promene rastera. */
@media (max-width: 860px) {
  html[lang="fr"] .cmp th,
  html[lang="fr"] .cmp td { font-size: 14px; }
}

/* Kartice cena: naziv paketa ostaje engleski/originalan, ali potpis
   ispod njega je duži. Bez ovoga potpis gura CTA iz linije. */
html[lang="fr"] .price-card h3,
html[lang="en"] .price-card h3 { text-wrap: balance; }

/* ============================================================
   3B · LINK U PROZI MORA DA IZGLEDA KAO LINK
        (MARKET_LOCALIZATION_R01, 2026-08-27)

   NALAZ, izmeren a ne procenjen: `.faq-a a` i `.honest a` nemaju nijedno
   pravilo u `site.css`. Izmereno u pregledaču na `/fr/tarifs/` i
   `/fr/contact/`: boja linka `rgb(183,178,166)` — ISTA kao boja pasusa —
   `text-decoration: none`, `border-bottom: 0`. Link se ne razlikuje od
   okolnog teksta ni po čemu dok se ne pređe mišem, a na telefonu nema
   prelaska mišem.

   Ovo NIJE nov dizajn. Sajt već ima svoj obrazac za link u prozi i on je
   na dva mesta isti: `.trade-note a` i `.dmon-src a` u `site.css` nose
   `color: var(--gold)` + `border-bottom: 1px solid rgba(233,184,80,.3)`.
   Ovde se taj isti obrazac samo primenjuje tamo gde je izostao. Nijedan
   nov token, nijedna nova boja, nijedan pomeren raspored (§12).

   ZAŠTO SAMO EN I FR: `.faq-a a` postoji i na srpskim stranama (npr.
   `/cene/` → „Mesečno održavanje"), pa je defekt zapravo na celom sajtu.
   Ali srpski izgled se u ovoj rundi ne dira bez vlasničke odluke —
   nezatražena promena srpske produkcije je regresija i kad izgleda bolje.
   Srpski deo ide kao owner odluka O-4, sa istim pravilom bez `html[lang]`
   ograde. `.honest a` postoji ISKLJUČIVO na EN/FR (srpski blok nema
   nijedan link), pa tu ograda ništa i ne isključuje.
   ============================================================ */
html[lang="en"] .faq-a a,
html[lang="fr"] .faq-a a,
html[lang="en"] .honest a,
html[lang="fr"] .honest a {
  color: var(--gold, #e9b850);
  border-bottom: 1px solid rgba(233, 184, 80, 0.3);
}

html[lang="en"] .faq-a a:hover,
html[lang="fr"] .faq-a a:hover,
html[lang="en"] .honest a:hover,
html[lang="fr"] .honest a:hover {
  color: var(--gold-hi, #ffe2a0);
  border-bottom-color: var(--gold-hi, #ffe2a0);
}

/* ============================================================
   4 · STRINGOVI KOJE PRAVI CSS — trenutno ih NEMA

   Provereno 2026-08-25: u `site.<sha10>.css` nijedno `content:` ne
   nosi tekst (samo `\00B7` i `↗`), pa nema srpskog stringa koji bi
   zaobišao prevodioca. Stari `i18n.css` je imao takav slučaj
   („Preporuka" na istaknutoj kartici cena) — SIGNAL ga je prebacio u
   HTML, gde mu je i mesto.

   Ovo se ne sme pretpostaviti nego proveriti: `lint.js` ima proveru
   CSS_CONTENT koja pada čim se u CSS-u pojavi `content:` sa slovima.
   ============================================================ */

/* ============================================================
   5 · BIRAČ NA STRANAMA BEZ LJUSKE  (.lang-standalone)

   ⚠ `demo.css` NE definise SIGNAL tokene (--gold, --ink, --dim…) —
   definiše ih `site.css`, koji demo ljuske ne učitavaju. Bez rezervnih
   vrednosti u `var(...)` tekuci jezik je dobijao providnu podlogu i
   skoro crn tekst: segment je bio TU, ali se nije video. Zato svaki
   `var()` u ovom fajlu nosi rezervnu vrednost, i to TAČNU vrednost iz
   `site.css`, ne približnu.

   `/vizitka/` i četiri `/demo/` ljuske nemaju ni traku ni podnožje —
   birač nema u šta da stane. Bez njega posetilac koji na njih uđe iz
   engleskog ili francuskog iz njih ne može da izađe u isti jezik: jedini
   put nazad je „nazad" u pregledaču.

   Pločica je fiksirana u gornji desni ugao, jer je to jedini ugao koji
   je slobodan na OBE vrste strana: demo ljuska drži naziv aplikacije
   levo, a vizitka je centrirana kartica. Sopstvena podloga je obavezna —
   pločica lebdi iznad sadržaja koji se pomera ispod nje.
   ============================================================ */
.lang-standalone {
  position: fixed;
  top: calc(10px + env(safe-area-inset-top, 0px));
  right: calc(10px + env(safe-area-inset-right, 0px));
  z-index: 9998;
  background: var(--panel, #101011);
  border-color: var(--line-strong, rgba(244, 240, 230, 0.16));
  box-shadow: 0 6px 22px rgba(0, 0, 0, 0.45);
}

/* Visina segmenta je 44 px i na demo ljuskama i na vizitki. Prva verzija
   je bila niža (32×28, pa 38×34) jer je pločica „samo pomoćna" — QA je
   to prijavio na 51 mestu, na sve tri širine ispod 1024 px. Meta za prst
   se ne meri važnošću elementa nego prstom, i to je isti prag koji već
   važi za birač u fioci. Sužava se ŠIRINA, nikad visina. */
.lang-standalone .lang-opt { min-width: 40px; min-height: 44px; }
/* Demo ljuska ima svoju traku gore desno („Reset…", „Opis aplikacije",
   „Razgovor") — pločica u gornjem uglu je prekrivala ta dugmad. Zato na
   demo stranama ide DOLE desno, i ispod z-indeksa modala (60) i vodiča
   kroz aplikaciju (80), da nikad ne pokrije dijalog. */
.demo-body .lang-standalone {
  padding: 2px;
  top: auto;
  bottom: calc(12px + env(safe-area-inset-bottom, 0px));
  z-index: 50;
}
.demo-body .lang-standalone .lang-opt { min-width: 38px; min-height: 44px; font-size: 11px; }

@media (max-width: 560px) {
  .lang-standalone .lang-opt { min-width: 36px; padding: 0 7px; }
  .demo-body .lang-standalone .lang-opt { min-width: 34px; }
}

/* Štampa: pločica je alat za kretanje, ne sadržaj. Vizitka se štampa. */
@media print { .lang-standalone { display: none; } }

/* ===================================================================
   MARKET EDITION PREVIEW (R404_EN_FR_MARKET_EDITION_PREVIEW_R01)

   Cenovni slot je projektovan za VELIKI BROJ (`.sig-num` je display
   stepen). Neutralno stanje je REČENICA, ne broj — u istom stepenu bi
   se prelomilo u dva-tri reda i razbilo kartice, a na 390 px izašlo iz
   okvira. Zato stanje dobija svoj, manji stepen i normalan prelom.

   Ovo je PREVIEW sloj: kad vlasnik odluči cene, blokovi se vraćaju na
   brojeve i ova pravila postaju mrtva. Ne ulazi u produkciju kao takvo.
   =================================================================== */
.pnum-n.me-state,
.p-price .num.me-state {
  font-family: inherit;
  font-size: clamp(15px, 1.35vw, 20px);
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: .005em;
  text-transform: none;
  white-space: normal;
  display: block;
  opacity: .92;
}
.p-price .num.me-state { margin-bottom: 2px; }

/* Napomena o statusu cena — vlasnički signal da prazan slot NIJE kvar. */
.me-note {
  margin: 18px 0 0;
  padding: 12px 14px;
  max-width: 62ch;
  border-left: 3px solid currentColor;
  font-size: 14px;
  line-height: 1.55;
  opacity: .8;
}
.me-note strong { opacity: 1; }

@media (max-width: 560px) {
  .pnum-n.me-state,
  .p-price .num.me-state { font-size: 15px; }
  .me-note { font-size: 13px; padding: 10px 12px; }
}

/* Found by LOOKING at a screenshot, not by a test: `.p-price` is a
   horizontal row designed for a large figure plus one short word. Put a
   sentence in the first slot and both children wrap alongside each other,
   which reads as a broken card — while every automated check stayed green,
   because nothing overflowed. The state gets a line of its own. */
.p-price--me {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}
.p-price--me .num.me-state { white-space: nowrap; }
.p-price--me .per { white-space: normal; line-height: 1.45; max-width: 34ch; }


/* ============================================================
   BIRO 404 — LOCAL VISIBILITY BLOCK  (#lokalno)  ·  EN + FR
   R404_FR_LOCAL_SEO_BLOCK_REDESIGN_R01 · 2026-08-31

   JEDAN komponentni obrazac za oba tržišna izdanja. `.local-signal`
   nosi kompletan layout, ritam i motion grammar; jezik i ruta žive
   isključivo u HTML-u strane. EN i FR NISU dve kopije stila.

   Zamenjuje generički `.asset-split` (uokvirena kvadratna slika levo,
   tekst + bullets desno) jednom integrisanom kompozicijom.

   Šta se menja i zašto:
     · slika više NIJE uokviren kadar — trag signala ide punom širinom
       iza sekcije, `mix-blend-mode: screen` gasi crnu ploču pa ostaje
       samo svetlo; nema rama, nema „nalepljenog" thumbnaila
     · naslov i uvod stoje kao novinski stubac (7/5), ne kao pola-pola
     · linija sa zlatnim čvorom pada TAČNO na kraj naslovnog stupca —
       signal se „zaključava" tamo gde počinju dokazi
     · tri tvrdnje su numerisan tehnički red (01/02/03), ne bullets
     · CTA sedi na zaključnoj liniji, desno — kraj sekcije, ne plutajuća pilula

   OPSEG: sve je pod `.local-signal`. Fajl se učitava na /en/index.html
   i /fr/index.html. SRPSKA naslovna (`/`) ostaje na zatečenom
   `.asset-split` obrascu sa mapom Srbije — evidentirano, NIJE menjano
   u ovoj rundi (mapa je tržišno tačna samo za SR; v. R02 audit).
   ============================================================ */

.local-signal {
  position: relative;
  overflow: clip;
  /* kompozicija se sada zatvara linijom + CTA, pa donji predah može biti
     kraći nego kod poglavlja koja se završavaju tekstom */
  padding-bottom: clamp(96px, 9.5vw, 150px);
}

/* ---------- Trag signala: široki gest, deo arhitekture sekcije ---------- */
.local-signal .ls-trace {
  position: absolute;
  left: 50%;
  top: 47%;
  width: min(2400px, 172vw);
  transform: translate(-50%, -50%);
  z-index: 0;
  pointer-events: none;
  /* Trag, ne pozadinska fotografija: dovoljno da se vidi kroz kompoziciju,
     nedovoljno da se takmiči sa naslovom. */
  opacity: 0.34;
  mix-blend-mode: screen;
  /* vertikalno gašenje — svetlo ne sme da uđe u red 01/02/03 */
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 40%, #000 60%, transparent 94%);
          mask-image: linear-gradient(180deg, transparent 0%, #000 40%, #000 60%, transparent 94%);
}
.local-signal .ls-trace img {
  width: 100%;
  height: auto;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 18%, #000 82%, transparent 100%);
          mask-image: linear-gradient(90deg, transparent 0%, #000 18%, #000 82%, transparent 100%);
}

.local-signal .ls-in {
  position: relative;
  z-index: 1;
  display: grid;
  gap: clamp(38px, 4vw, 62px);
}

/* ---------- Zaglavlje: naslov 7 / uvod 5, oba počinju od iste linije ---------- */
.local-signal .ls-head {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  column-gap: clamp(30px, 4.4vw, 84px);
  row-gap: clamp(20px, 2.2vw, 30px);
  align-items: start;
}
.local-signal .ls-eyebrow { grid-column: 1 / -1; }
.local-signal .ls-title { display: grid; gap: 22px; }
.local-signal .ls-title h2 {
  font-size: clamp(33px, 4.5vw, 64px);
  font-weight: 300;
  letter-spacing: -0.022em;
  line-height: 1.04;
}
.local-signal .ls-title h2 em {
  font-style: normal;
  color: var(--gold-hi);
  text-shadow: 0 0 34px rgba(233, 184, 80, 0.32);
}

/* uvod kreće od gornje ivice naslova (optičko poravnanje sa prvim redom) */
.local-signal .ls-lead { display: grid; gap: 16px; padding-top: clamp(4px, 0.7vw, 12px); }
.local-signal .ls-lead p {
  color: var(--ink);
  font-size: clamp(16.5px, 1.3vw, 19px);
  line-height: 1.62;
  max-width: 46ch;
}
.local-signal .ls-lead .ls-lead-sub {
  color: var(--muted);
  font-size: clamp(15px, 1.05vw, 16.5px);
  line-height: 1.68;
}

/* ---------- Linija + zaključan čvor ---------- */
.local-signal .ls-rule {
  position: relative;
  height: 1px;
  background: var(--line);
}
/* zlatni deo linije staje na 7/12 — kraj naslovnog stupca */
.local-signal .ls-rule::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 58.333%;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--gold-deep) 42%, var(--gold));
  transform-origin: left center;
}
.local-signal .ls-node {
  position: absolute;
  left: 58.333%;
  top: 50%;
  width: 7px;
  height: 7px;
  margin: 0;
  border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 12px 2px rgba(233, 184, 80, 0.5);
  transform: translate(-50%, -50%);
}

/* Kretanje postoji SAMO ako skript može da ga otkloni (isti obrazac kao
   `.sig-shot.rv` u site.css) — bez JS-a linija i čvor se vide odmah. */
@media (scripting: enabled) {
  .local-signal .ls-rule::before {
    transform: scaleX(0);
    transition: transform 1100ms var(--ease-out) 200ms;
  }
  .local-signal.on .ls-rule::before { transform: scaleX(1); }
  .local-signal .ls-node {
    opacity: 0;
    transform: translate(-50%, -50%) scale(0.4);
    transition: opacity 380ms var(--ease-out) 1120ms,
                transform 420ms var(--ease-lock) 1120ms;
  }
  .local-signal.on .ls-node { opacity: 1; transform: translate(-50%, -50%) scale(1); }
}

/* ---------- Tri tvrdnje: tehnički red, ne bullets ---------- */
.local-signal .ls-points {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(26px, 3.2vw, 56px);
  margin: 0;
  padding: 0;
  list-style: none;
}
.local-signal .ls-points li {
  display: grid;
  align-content: start;
  gap: 9px;
}
.local-signal .ls-points li + li {
  border-left: 1px solid var(--line);
  padding-left: clamp(26px, 3.2vw, 56px);
}
.local-signal .ls-idx {
  font-family: var(--font-m);
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 0.2em;
  color: var(--gold);
  margin-bottom: 3px;
}
.local-signal .ls-points b {
  font-size: clamp(16px, 1.2vw, 17.5px);
  font-weight: 720;
  letter-spacing: -0.01em;
  color: var(--ink);
  line-height: 1.3;
}
.local-signal .ls-txt {
  color: var(--muted);
  font-size: 16px;
  line-height: 1.66;
}

/* ---------- Zaključna linija + CTA ---------- */
/* CTA sedi na zaključnoj liniji, u istoj koloni kao naslov i 01 —
   nastavak čitanja, ne plutajuća pilula u praznom desnom uglu. */
.local-signal .ls-foot {
  display: flex;
  justify-content: flex-start;
  border-top: 1px solid var(--line);
  padding-top: clamp(26px, 2.8vw, 38px);
}

/* ---------- Tablet ---------- */
@media (max-width: 1080px) {
  .local-signal .ls-head {
    grid-template-columns: minmax(0, 1fr);
    gap: clamp(24px, 3.6vw, 36px);
    align-items: start;
  }
  .local-signal .ls-lead p { max-width: 62ch; }
  .local-signal .ls-rule::before,
  .local-signal .ls-node { left: 0; width: 42%; }
  .local-signal .ls-node { left: 42%; width: 7px; }
  .local-signal .ls-points { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(20px, 2.6vw, 34px); }
  .local-signal .ls-points li + li { padding-left: clamp(20px, 2.6vw, 34px); }
}

/* ---------- Telefon ---------- */
@media (max-width: 760px) {
  .local-signal .ls-trace { width: 260vw; top: 44%; opacity: 0.7; }
  .local-signal .ls-in { gap: 34px; }
  /* prelom u naslovu OSTAJE i na telefonu — `display:none` na <br> spaja
     reči bez razmaka („Votre marché,c’est"), jer razmaka u markupu nema */
  .local-signal .ls-points { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .local-signal .ls-points li { padding: 22px 0; }
  .local-signal .ls-points li + li {
    border-left: 0;
    border-top: 1px solid var(--line);
    padding-left: 0;
  }
  .local-signal .ls-points li:first-child { padding-top: 0; }
  .local-signal .ls-points li:last-child { padding-bottom: 0; }
  .local-signal .ls-foot { justify-content: flex-start; }
  .local-signal .ls-foot .btn { width: 100%; justify-content: space-between; }
  .local-signal .ls-rule::before,
  .local-signal .ls-node { left: 0; }
  .local-signal .ls-rule::before { width: 62%; }
  .local-signal .ls-node { left: 62%; }
}

/* ---------- Smanjeno kretanje ---------- */
@media (prefers-reduced-motion: reduce) {
  .local-signal .ls-rule::before { transform: none !important; transition: none !important; }
  .local-signal .ls-node { opacity: 1 !important; transform: translate(-50%, -50%) !important; transition: none !important; }
}

/* ============================================================
   VARIJANTA „ZONA" — /en/local-seo/ · /fr/referencement-local/
   R404_PREDEPLOY_WORKING_SOURCE_R01 (§6)

   Tu je stajao kadar mape Srbije kao dokaz uz tekst „ne takmicite se
   sa celom zemljom". Tekst je trzisno neutralan, slika nije: EN i FR
   izdanje ne prodaju srpsko trziste. Umesto nove ilustracije (koja bi
   ili glumila konkretnu lokaciju ili bila prazan ukras), blok dobija
   ISTU komponentu koju je vlasnik upravo prihvatio na naslovnoj —
   trag signala, novinski stubac, numerisan red. Bez CTA: strana se
   nastavlja, nije kraj poglavlja.

   SRPSKE strane ostaju sa mapom — za njih je tvrdnja tacna.
   ============================================================ */
.local-signal.ls-zone { padding-bottom: 0; }
.local-signal.ls-zone .ls-trace { top: 50%; opacity: 0.30; }
@media (max-width: 760px) {
  .local-signal.ls-zone .ls-trace { opacity: 0.6; }
}

/* ============================================================
   NATPIS KOJI ZIVI U CSS-u  —  R404_EN_FR_GENERATOR_CONVERGENCE_R03

   NALAZ UHVACEN GLEDANJEM SNIMKA, NE TESTOM.

   `srfinal-r01.css` upisuje oznaku preporucenog paketa kroz
   generisani sadrzaj:

       .oa-rows li.lead .n::after { content: "najcesci izbor"; }

   `lib/htmlstrings.js` skenira tekstualne cvorove i atribute HTML-a.
   Tekst iz CSS `content:` ne postoji ni u jednom cvoru, pa ga
   lokalizacioni lint NE VIDI: `make.js` je za `/en/pricing/` i
   `/fr/tarifs/` javio „sve cisto", a na engleskoj strani je pored
   preporucenog paketa stajalo „NAJCESCI IZBOR".

   Ovo je jedini takav string na celom sajtu (provereno nad svim
   stylesheet-ovima u paketu). Resava se ovde, jezicki uslovljeno, jer
   `<html lang>` postavlja `lib/build.js` za svaku prevedenu stranu —
   srpska varijanta ostaje netaknuta.
   ============================================================ */
html[lang="en"] .oa-rows li.lead .n::after { content: "most common choice"; }
html[lang="fr"] .oa-rows li.lead .n::after { content: "le plus souvent choisi"; }