/* lunobus.hr: zajednički okvir svih prikaza.
   Traka, uvodni redak, zaglavlja poglavlja, izvori i podnožje isti su na svakom prikazu i složeni su
   pismom naslovnice (Schibsted Grotesk). Boje dolaze iz tokena samog prikaza:
   --ground, --sheet, --ink, --ink-2, --muted, --rule, --rule-2 i --accent (naglasna boja prikaza).
   Naslovi, tekst, grafikoni i kontrole u njima ostaju u tipografiji pojedinog prikaza.
   Datoteka se učitava prije <style> prikaza, pa prikaz po potrebi može nadjačati pojedino pravilo. */
:root{--lb-ui:"Schibsted Grotesk",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--lb-bar:60px}

html{scroll-padding-top:calc(var(--lb-bar) + 28px)}
.wrap{max-width:1180px;margin:0 auto;padding-inline:24px}
@media (max-width:600px){.wrap{padding-inline:16px}}

.skip-link{position:fixed;left:16px;top:10px;z-index:60;transform:translateY(-160%);background:var(--ink);color:var(--ground);
  font:500 14px var(--lb-ui);padding:12px 18px;border-radius:4px;text-decoration:none}
.skip-link:focus{transform:none}

/* ---------- traka ---------- */
.topbar{--lb-control-size:.875rem;position:sticky;top:0;z-index:30;background:var(--ground);background:color-mix(in srgb,var(--ground) 92%,transparent);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--rule);font-family:var(--lb-ui)}
.topbar-in{display:flex;align-items:center;gap:22px;min-height:var(--lb-bar)}
.home{flex:none;display:block;border-radius:5px}
.home svg{width:28px;height:28px}
.brand{flex:none;font-size:15px;font-weight:650;letter-spacing:-.01em;color:var(--ink);text-decoration:none;white-space:nowrap}
.topnav{display:flex;gap:20px;flex:1;min-width:0;overflow-x:auto;scrollbar-width:none;font-size:13.5px;
  -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent)}
.topnav::-webkit-scrollbar{display:none}
.topnav a{position:relative;display:flex;align-items:center;min-height:var(--lb-bar);color:var(--ink-2);text-decoration:none;white-space:nowrap}
.topnav a:hover,.topnav a[aria-current="location"]{color:var(--ink)}
.topnav a[aria-current="location"]::after{content:"";position:absolute;bottom:0;left:0;right:0;height:3px;background:var(--accent)}
.theme-btn{flex:none;font:500 var(--lb-control-size)/1 var(--lb-ui);background:none;border:1px solid var(--rule-2);color:var(--ink-2);
  border-radius:999px;min-height:34px;padding:6px 13px;cursor:pointer}
.theme-btn:hover{color:var(--ink);border-color:var(--ink-2)}
.language-link{display:inline-flex;align-items:center;justify-content:center;gap:6px;flex:none;min-height:36px;
  padding-inline:7px;border-radius:4px;color:var(--ink-2);font:650 var(--lb-control-size)/1 var(--lb-ui);text-decoration:none}
.language-link[hreflang="en"]{--language-flag:url("images/flags/gb.svg")}
.language-link[hreflang="hr"]{--language-flag:url("images/flags/hr.svg")}
.language-link[hreflang]::before{content:"";flex:none;width:20px;height:15px;border-radius:2px;
  background:var(--language-flag) center/contain no-repeat;box-shadow:0 0 0 1px var(--rule-2)}
.language-link:hover{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.language-link:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.reading-progress{position:absolute;left:0;bottom:-1px;width:100%;height:2px;background:var(--accent);
  transform:scaleX(0);transform-origin:left;pointer-events:none}
@media (max-width:1100px){.brand{display:none}}
@media (max-width:600px){
  html{scroll-padding-top:112px}
  .topbar-in{gap:0;flex-wrap:wrap;padding-top:9px}
  .home{margin-right:10px}.home svg{width:25px;height:25px}
  .brand{display:block;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;font-size:14px}
  .topbar{--lb-control-size:.8125rem}
  .theme-btn,.language-link{min-height:44px}
  .theme-btn{padding-inline:9px}
  .language-link{gap:5px;padding-inline:4px;margin-inline:2px 4px}
  .topnav{order:4;flex-basis:100%;gap:22px;font-size:13px;margin-top:5px}
  .topnav a{min-height:43px}
}

/* ---------- uvodni redak: rubrika i mjesto lijevo, stanje podataka desno ---------- */
.hero{padding-top:44px}
.hero-kicker{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;margin:0 0 28px;font:14px/1.45 var(--lb-ui);color:var(--muted)}
.hero-kicker strong{font-weight:600;color:var(--ink)}
.hero-kicker time{margin-left:auto}
@media (max-width:600px){
  .hero{padding-top:28px}
  .hero-kicker{margin-bottom:20px;font-size:13px}
  .hero-kicker time{margin-left:0;flex-basis:100%}
}

/* ---------- poglavlja: crta preko cijele širine, redni broj u naglasnoj boji ---------- */
.chapter{padding:88px 0 12px}
.chapter-head{border-top:1px solid var(--ink);padding-top:20px}
.chapter-head.col{max-width:none}
.chapter-head.col>:not(h2){max-width:42rem}
.chapter-kicker{display:flex;align-items:center;gap:12px;margin:0 0 22px;font:14px/1.4 var(--lb-ui);color:var(--muted)}
.chapter-kicker span{display:inline-grid;place-items:center;min-width:32px;height:24px;padding:0 6px;border:1px solid var(--rule-2);border-radius:3px;
  font-size:13px;font-weight:600;color:var(--accent);font-variant-numeric:tabular-nums}
@media (max-width:600px){.chapter{padding-top:64px}}

/* ---------- izvori ---------- */
.method{max-width:44rem;font-size:16px;line-height:1.55;color:var(--ink-2)}
.sources{font:14.5px/1.5 var(--lb-ui);padding-left:1.8em;columns:2;column-gap:44px;margin:0}
.sources li{break-inside:avoid;margin:0 0 10px;color:var(--ink-2)}
.sources li::marker{color:var(--muted);font-variant-numeric:proportional-nums}
.sources a{color:var(--ink);text-decoration-color:var(--rule-2);text-underline-offset:3px}
.sources a:hover{text-decoration-color:currentColor}
@media (max-width:800px){.sources{columns:1}}

/* ---------- podnožje ---------- */
.site-foot{margin-top:72px;padding:36px 0 64px;border-top:1px solid var(--rule);font:14px/1.6 var(--lb-ui);color:var(--muted)}
.site-foot .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:16px 40px;align-items:start}
.site-foot p{margin:0;max-width:64ch}
.site-foot a{color:var(--ink-2)}
.foot-home{display:inline-flex;align-items:center;gap:10px;width:max-content;font-size:18px;font-weight:700;letter-spacing:-.02em;line-height:1;
  color:var(--ink);text-decoration:none}
.foot-home svg{width:26px;height:26px}
.site-foot .foot-home{color:var(--ink)}
@media (max-width:700px){.site-foot .wrap{grid-template-columns:minmax(0,1fr)}}