/* UNIMO HM V24 — KONCEPT SIRINE I PREMIUM EDITORIAL LAYOUTA
   Nova proba iz V22. Sve iz originalnog style.css i app.js je sacuvano.
   Primjena: 100% sekcijske podloge + kontrolisana sirina sadrzaja.
   Brisanje ove datoteke i njenog <link> taga vraca originalni V22 raspored. */

:root { --unimo-content: 1480px; --unimo-hero: 1560px; --unimo-gutter: 38px; }

/* Max sirina je kontrolisana, ali boje, pozadine i blokovi ostaju full-bleed. */
.container { width:min(var(--unimo-content), calc(100% - var(--unimo-gutter) - var(--unimo-gutter))); }
header .container.nav, .hero.v17-hero .container { width:min(var(--unimo-hero), calc(100% - var(--unimo-gutter) - var(--unimo-gutter))); }

/* Smirena i prostranija navigacija — nemamo minijaturnih linkova. */
header .nav { height:94px; }
.navlinks { gap:clamp(12px,1.25vw,24px); font-size:14.5px; }
.navlinks .outline { padding:13px 17px; }

/* Pocetna povrsina: efektniji naslov, jasna poruka i sirina za ozbiljnu firmu. */
.hero.v17-hero .container {
  column-gap:clamp(44px,5.3vw,110px);
  grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
  padding-top:clamp(62px,5.1vw,105px);
  padding-bottom:clamp(52px,4vw,76px);
}
.hero.v17-hero h1 {
  font-size:clamp(55px,5.25vw,85px);
  line-height:1.045;
  letter-spacing:-.054em;
  max-width:860px;
  margin:14px 0 25px;
  text-wrap:balance;
}
.hero.v17-hero .hero-copy { font-size:clamp(17px,1.12vw,20px); line-height:1.67; max-width:700px; }
.hero.v17-hero .hero-note { max-width:650px; }
.hero.v17-hero .integrator-map { max-width:465px; }
.hero.v17-hero .hero-sectors { margin-top:clamp(35px,3vw,62px); }

/* Cetiri poslovne oblasti: malo vise prostora i bolja citljivost. */
.sector-grid { gap:clamp(14px,1.35vw,23px); }
.sector-link { min-height:209px; padding:25px 25px 23px; border-radius:15px; }
.sector-link strong { font-size:clamp(18px,1.08vw,21px); line-height:1.28; }
.sector-link small { font-size:14px; line-height:1.52; }
.sector-num { margin-bottom:16px; }
.sector-arrow { right:19px; bottom:17px; }
.sector-lead { font-size:15px; }

/* Sekcije: velike platnene povrsine, ali uska citljiva linija za duge pasuse. */
.section { padding-top:clamp(86px,6.6vw,135px); padding-bottom:clamp(86px,6.6vw,135px); }
.section h2 { font-size:clamp(38px,3.15vw,61px); line-height:1.11; text-wrap:balance; }
.section-head { gap:clamp(32px,4.6vw,100px); margin-bottom:clamp(38px,3.5vw,60px); }
.section-head > p { font-size:17.5px; line-height:1.67; max-width:700px; }
.section .lead, .filter-copy > p, .network-demo-copy > p:not(.eyebrow) { max-width:680px; }

/* Vizuelni ritam kartica i informacija: manje sitnog teksta na desktopu. */
.pillars { gap:clamp(16px,1.5vw,25px); }
.pillar { padding:clamp(27px,2.15vw,35px); }
.pillar h3 { font-size:clamp(21px,1.38vw,26px); }
.pillar p, .pillar li, .resource p, .project p, .ref-box p,
.fee p, .life span, .step p, .cross-card p, .principle span,
.criterion span { font-size:14px; line-height:1.63; }
.project, .resource, .scorecard, .fee, .ref-box { padding:clamp(24px,1.9vw,34px); }
.ribbon span { padding:22px 10px; }
.network-demo-wrap { gap:clamp(46px,5vw,112px); grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
.network-demo-copy h2 { font-size:clamp(38px,3.1vw,59px); line-height:1.10; }
.network-demo-copy>p:not(.eyebrow) { font-size:17px; line-height:1.7; }
.network-demo-diagram { width:min(500px,100%); }
.v17-network-section { padding-block:clamp(88px,6vw,130px) clamp(55px,4.5vw,90px); }

/* Konzistentne vidljive konture fokusa tastaturom. */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline:3px solid #62bef6;
  outline-offset:3px;
}

/* U srednjoj zoni prioritet je raspored bez sudara naslova i dijagrama. */
@media (max-width:1240px) {
  header .nav { height:84px; }
  .navlinks {
    display:none; position:absolute; top:84px; left:0; right:0;
    flex-direction:column; align-items:stretch; gap:4px;
    background:#fff; padding:20px max(5vw,24px) 25px;
    border-bottom:1px solid #d7e4f6;
    box-shadow:0 20px 24px rgba(6,27,71,.10);
    max-height:calc(100vh - 84px); overflow-y:auto;
  }
  .navlinks.open { display:flex; }
  .navlinks a { display:block; padding:11px 12px; font-size:16px; }
  .navlinks .outline { margin-top:6px; text-align:center; }
  .menu { display:block; font-size:29px; padding:8px 9px; cursor:pointer; }
}
@media (max-width:1120px) {
  .hero.v17-hero .container {
    grid-template-columns:1fr;
    padding-block:56px 55px;
  }
  .hero.v17-hero h1 { max-width:800px; font-size:clamp(51px,6vw,69px); }
  .hero.v17-hero .integrator-map { max-width:400px; }
  .hero.v17-hero .hero-sectors { margin-top:28px; }
  .sector-link { min-height:190px; padding:19px; }
  .sector-link strong { font-size:18px; }
  .sector-link small { font-size:13.5px; }
  .network-demo-wrap { grid-template-columns:1fr; gap:30px; }
  .network-demo-diagram { max-width:460px; }
}
@media (max-width:980px) {
  .sector-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .hero.v17-hero .container { display:flex; flex-direction:column; align-items:stretch; gap:25px; }
  .hero.v17-hero .hero-intro { order:1; }
  .hero.v17-hero .hero-sectors { order:2; margin-top:3px; }
  .hero.v17-hero .hero-details { order:3; }
  .hero.v17-hero .integrator-map { order:4; }
  .section { padding-block:86px; }
  .section h2 { font-size:clamp(35px,4.2vw,49px); }
}
@media (max-width:640px) {
  :root { --unimo-gutter:19px; }
  .container, header .container.nav, .hero.v17-hero .container {
    width:calc(100% - var(--unimo-gutter) - var(--unimo-gutter));
  }
  header .nav {height:76px;}
  .navlinks {top:76px;max-height:calc(100vh - 76px);}
  .hero.v17-hero .container {padding-top:37px;padding-bottom:44px;gap:24px;}
  .hero.v17-hero h1 {font-size:clamp(38px,10vw,50px);line-height:1.08;}
  .hero.v17-hero .hero-copy {font-size:16px;}
  .hero.v17-hero .integrator-map { max-width:300px; }
  .hero.v17-hero .hero-sectors { margin-top:6px; }
  .sector-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  .sector-link { min-height:196px; padding:16px 15px 17px; }
  .sector-link strong { font-size:17px; }
  .sector-link small { font-size:12px; }
  .section { padding-block:70px; }
  .section h2 { font-size:clamp(31px,8vw,39px); }
  .section-head > p { font-size:16px; }
  .pillar p,.pillar li,.resource p,.project p,.ref-box p,.fee p,.life span,.step p,.cross-card p,.principle span,.criterion span { font-size:13px; }
  .v17-network-section { padding-block:64px 40px; }
  .network-demo-copy h2 { font-size:36px; }
  .network-demo-copy>p:not(.eyebrow) { font-size:16px; }
  .network-demo-diagram { width:min(340px,98%); }
}
@media (max-width:500px) {
  .sector-grid {grid-template-columns:1fr;}
  .sector-link {min-height:142px;padding:15px 18px 17px;}
  .sector-link strong {font-size:19px;}
  .sector-link small {font-size:13px;}
}
