/* ==========================================================================
   EMN Slovenia — osnove (reset, tipografija, postavitev, dostopnost), v2
   ========================================================================== */

*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
html[data-fs="lg"] { font-size: 112.5%; }
html[data-fs="xl"] { font-size: 125%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  font-family: var(--font-body);
  font-weight: var(--fw-normal);
  font-size: var(--step-0);
  line-height: 1.65;
  color: var(--ink);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

img, svg, video { display: block; max-width: 100%; height: auto; }
.ico { width: 1.15em; height: 1.15em; flex-shrink: 0; }

/* nežno ozadje pod zunanjimi placeholder slikami — če slika ne naloži, ostane lep prehod barv namesto razbite ikone */
.img-fallback { background: linear-gradient(135deg, var(--bg-tint2), var(--bg-tint)); }
a { color: var(--accent-strong); text-decoration: none; }
a:hover { text-decoration: underline; }
button, input, textarea, select { font: inherit; color: inherit; }

/* --- naslovi: Verdana za GLAVNE naslove (h1/h2), Arial krepko za PODNASLOVE (h3/h4) --- */
h1, h2 { font-family: var(--font-display); font-weight: var(--fw-bold); line-height: 1.1; color: var(--emn-navy); letter-spacing: -0.02em; }
h3, h4 { font-family: var(--font-body); font-weight: var(--fw-bold); line-height: 1.25; color: var(--emn-navy); letter-spacing: -0.005em; }
h1 { font-size: var(--step-4); letter-spacing: -0.025em; }
h2 { font-size: var(--step-3); }
h3 { font-size: var(--step-1); }
p { max-width: 68ch; font-weight: var(--fw-normal); }
em, .italic { font-style: italic; }
strong, b { font-weight: var(--fw-bold); }

/* velika števila (statistika, števci) v Verdani, krepko */
.num-display { font-family: var(--font-display); font-weight: var(--fw-bold); color: var(--emn-navy); }

/* --- dostopnost --- */
:focus-visible { outline: 3px solid var(--emn-yellow); outline-offset: 2px; border-radius: 3px; }
.skip-link {
  position: absolute; left: 12px; top: -60px; z-index: 200;
  background: var(--emn-navy); color: #fff; padding: .7rem 1.1rem; font-weight: var(--fw-bold);
  border-radius: var(--r-sm); transition: top var(--dur-1) var(--ease);
}
.skip-link:focus { top: 12px; text-decoration: none; }
.visually-hidden {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* --- postavitveni pripomočki --- */
.container { width: 100%; max-width: var(--container); margin-inline: auto; padding-inline: var(--gutter); }
.section { padding-block: clamp(4rem, 8vw, 7.5rem); scroll-margin-top: 96px; }
.section--tight { padding-block: clamp(3rem, 6vw, 5rem); }
.stack > * + * { margin-top: var(--sp-3); }
.grid { display: grid; gap: var(--sp-4); }

/* predtekst nad naslovom (uporabljen redko — max 1 na 3 sekcije), Arial krepko, brez črtice, navadna velikost črk */
.eyebrow {
  display: inline-flex; align-items: center; font-family: var(--font-body);
  font-size: var(--step-0); font-weight: var(--fw-bold); color: var(--accent-strong);
}

.section-head { max-width: 60ch; margin-bottom: clamp(1.8rem, 3vw, 2.8rem); }
.section-head p { font-family: var(--font-body); font-weight: var(--fw-normal); color: var(--ink-soft); font-size: var(--step-1); line-height: 1.5; margin-top: .6rem; }

.lead { font-family: var(--font-body); font-weight: var(--fw-normal); font-size: var(--step-1); line-height: 1.5; color: var(--ink-soft); }
.note { font-family: var(--font-body); font-size: var(--step--1); color: var(--ink-faint); font-style: italic; margin-top: 1rem; }