/* ============================================================
   NASLOVNA — ritam sekcija i zaglavlja
   ------------------------------------------------------------
   Zaglavlje ima tri dela: nadnaslov, naslov i uvod — isti
   raspored koji vec ima sekcija "Proces selidbe".

   PAZI na dve zamke sa ovog sajta:
   1. "p, li, span, label { font-size: 1.1rem !important }" gazi
      svaku velicinu teksta, pa nadnaslov i uvod MORAJU nositi
      !important — bez toga ostaju na 17.6px i deluju sitno.
   2. Zaglavlje se NE suzava sopstvenim max-width-om: sirinu vec
      drzi .container. Uzak stubac nasred sirokog ekrana izgleda
      kao da je strana polomljena.

   Vezano za telo sa klasom "kk-v2": ostale strane koje koriste
   .section-header ostaju netaknute dok se izgled ne potvrdi.
   ============================================================ */

/* ---------------------------------------------------- sirina */
/* Bootstrap-ov .container staje na 1320px, pa na ekranu od 1900px
   ostaju siroke prazne ivice i sve deluje stisnuto na sredinu.
   Na naslovnoj se sekcije sire do 1480px — i zaglavlje i kartice
   pod njim, da ostanu poravnati. Mera je za prikaz na 100%; na
   smanjenom zumu sve izgleda uze nego sto jeste. */
.kk-v2 #services > .container,
.kk-v2 #clients > .container,
.kk-v2 #testimonials > .container,
.kk-v2 #team > .container,
.kk-v2 #contact > .container,
.kk-v2 .kk-faq-section > .container,
.kk-v2 .kk-process {
  max-width: min(1480px, 92vw);
}

/* ---------------------------------------------------- ritam */
.kk-v2 #services,
.kk-v2 #clients,
.kk-v2 #testimonials,
.kk-v2 #team,
.kk-v2 #contact,
.kk-v2 .kk-faq-section {
  padding-block: clamp(56px, 6vw, 104px);
}
/* Naizmenicna podloga: granica se vidi i pre nego sto se procita
   naslov. */
.kk-v2 #clients,
.kk-v2 #team {
  background: var(--bg-section-alt);
}

/* ------------------------------------------------- zaglavlje */
.kk-v2 .section-header {
  margin: 0 0 clamp(34px, 3.5vw, 56px);
  text-align: center;
}
.kk-v2 .section-header > br { display: none; }

.kk-sek__nad {
  display: block;
  font-family: "DM Sans", "Inter", sans-serif;
  font-size: clamp(13px, 0.95vw, 16px) !important;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--color-primary);
  margin-bottom: 14px;
}

.kk-v2 .section-header h2 {
  font-family: "DM Sans", "Inter", sans-serif;
  font-size: clamp(31px, 3.1vw, 54px);
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.12;
  color: var(--text-heading);
  margin: 0;
  padding-bottom: 0;
  text-wrap: balance;
}
/* Crta je bila zalepljena uz levu ivicu naslova; posao razdvajanja
   preuzeli su nadnaslov, razmak i podloga. */
.kk-v2 .section-header h2::before { display: none; }

/* Uvod: sirok koliko i sekcija, samo sa gornjom granicom duzine
   reda da se ne razvuce preko celog ekrana. Tekst ide ulevo —
   nasi uvodi su dugacki pasusi, a centriran pasus od sedam redova
   se ne cita jer svaki red pocinje na drugom mestu. */
.kk-v2 .section-header > p {
  font-size: clamp(18px, 1.35vw, 22px) !important;
  line-height: 1.72;
  color: var(--text-secondary);
  margin: 20px auto 0;
  text-align: left;
}
/* Kratak uvod (jedan do dva reda) izgleda bolje centriran. */
.kk-v2 .section-header > p.kk-sek__uvod--kratak { text-align: center; }

/* Podnaslov unutar zaglavlja (npr. "Dodatne usluge uz…"): mirniji
   red koji se ne takmici sa naslovom. */
.kk-v2 .section-header h3 {
  font-size: clamp(20px, 1.6vw, 27px);
  font-weight: 700;
  color: var(--text-primary);
  margin: clamp(30px, 3vw, 44px) 0 0;
}

/* Pasusi posle uvoda su obican tekst sekcije. */
.kk-v2 .section-header > p ~ p {
  text-align: left;
  margin-top: 18px;
}

@media (max-width: 575px) {
  .kk-v2 .section-header > p,
  .kk-v2 .section-header > p ~ p { text-align: left; }
}
