/* Skupni header (inc/site-header.php) za strani, ki NE nalagajo homepage-shared.css
   (5. okt. 2026). Pravila so prepisana iz homepage-shared.css — pri spremembi headerja
   uredi OBE datoteki. Namerno BREZ globalnega reseta (*, body, a, img) iz
   homepage-shared.css, ker bi porušil postavitev obrazcev na teh straneh; spremenljivke
   in reset veljajo samo znotraj headerja in mobilnega menija. */
.hp-header,.hp-mobile-nav{
  --navy:#0d1b35;--navy2:#0f2248;--primary:#FF7A0F;--primary-h:#e56800;
  --shadow-lg:0 8px 40px rgba(0,0,0,.18);
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;line-height:1.6;
  -webkit-font-smoothing:antialiased;box-sizing:border-box;
}
/* :where() = specifičnost 0, da stilska pravila (.hp-btn-login ...) vedno zmagajo nad resetom. */
:where(.hp-header,.hp-mobile-nav) *,:where(.hp-header,.hp-mobile-nav) *::before,:where(.hp-header,.hp-mobile-nav) *::after{box-sizing:border-box;margin:0;padding:0}
:where(.hp-header,.hp-mobile-nav) a{text-decoration:none;color:inherit}
:where(.hp-header) img{max-width:100%;display:block}
.hp-header{
  position:sticky;top:0;z-index:9000;
  background:var(--navy);
  border-bottom:1px solid var(--primary);
  padding:0 32px;
  height:64px;
  display:flex;align-items:center;justify-content:space-between;gap:24px;
}
.hp-logo{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:0;flex-shrink:0;margin-top:-4px}
.hp-logo img{height:36px;width:auto;display:block}
.hp-logo span{font-size:6.5px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.45);text-align:center;white-space:nowrap;margin-top:-2px}
.hp-nav{display:flex;align-items:center;gap:4px;flex:1;justify-content:center}
.hp-nav > a{
  color:rgba(255,255,255,.8);font-size:14px;font-weight:500;
  padding:8px 12px;border-radius:8px;
  transition:color .15s,background .15s;white-space:nowrap;
}
.hp-nav > a:hover{color:#fff;background:rgba(255,255,255,.07)}
.hp-nav-dropdown{position:relative}
.hp-nav-dropdown > button{
  background:none;border:none;cursor:pointer;
  color:rgba(255,255,255,.8);font-size:14px;font-weight:500;
  padding:8px 12px;border-radius:8px;
  display:flex;align-items:center;gap:5px;
  transition:color .15s,background .15s;
}
.hp-nav-dropdown > button:hover{color:#fff;background:rgba(255,255,255,.07)}
.hp-nav-dropdown > button svg{width:14px;height:14px;transition:transform .2s}
.hp-nav-dropdown.open > button svg{transform:rotate(180deg)}
.hp-nav-dropdown-menu{
  display:none;position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%);
  background:var(--navy2);border:1px solid rgba(255,255,255,.12);border-radius:12px;
  padding:8px;min-width:200px;box-shadow:var(--shadow-lg);
}
.hp-nav-dropdown.open .hp-nav-dropdown-menu{display:block}
.hp-nav-dropdown-menu a{
  display:block;padding:9px 14px;color:rgba(255,255,255,.8);font-size:13.5px;
  border-radius:8px;transition:background .12s,color .12s;
}
.hp-nav-dropdown-menu a:hover{background:rgba(255,255,255,.08);color:#fff}
.hp-header-right{display:flex;align-items:center;gap:10px;flex-shrink:0}

/* Lang selector */
.hp-lang{position:relative}
.hp-lang-btn{
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);
  border-radius:8px;padding:7px 12px;
  display:flex;align-items:center;gap:6px;cursor:pointer;
  color:rgba(255,255,255,.85);font-size:13.5px;font-weight:500;
  transition:background .15s;
}
.hp-lang-btn:hover{background:rgba(255,255,255,.12)}
.hp-lang-btn svg{width:12px;height:12px;opacity:.6;transition:transform .2s}
.hp-lang.open .hp-lang-btn svg{transform:rotate(180deg)}
.hp-lang-menu{
  display:none;position:absolute;top:calc(100% + 8px);right:0;
  background:var(--navy2);border:1px solid rgba(255,255,255,.12);border-radius:12px;
  padding:8px;min-width:220px;box-shadow:var(--shadow-lg);
}
.hp-lang.open .hp-lang-menu{display:block}
.hp-lang-menu a{
  display:flex;align-items:center;gap:10px;padding:9px 12px;
  color:rgba(255,255,255,.8);font-size:13.5px;border-radius:8px;
  transition:background .12s,color .12s;
}
.hp-lang-menu a:hover{background:rgba(255,255,255,.08);color:#fff}
.hp-lang-divider{border-top:1px solid rgba(255,255,255,.1);margin:6px 0}
.hp-btn-login{
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);
  border-radius:9px;padding:9px 18px;color:rgba(255,255,255,.9);font-size:14px;font-weight:600;
  cursor:pointer;transition:background .15s;
}
.hp-btn-login:hover{background:rgba(255,255,255,.14);color:#fff}
.hp-btn-cta{
  background:var(--primary);color:#fff;
  border:none;border-radius:9px;padding:9px 18px;font-size:14px;font-weight:700;
  cursor:pointer;white-space:nowrap;transition:background .15s,transform .1s;
}
.hp-btn-cta:hover{background:var(--primary-h);transform:translateY(-1px)}
.hp-hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:none;padding:8px}
.hp-hamburger span{display:block;width:24px;height:2px;background:#fff;border-radius:2px;transition:all .2s}
.hp-hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.hp-hamburger.open span:nth-child(2){opacity:0}
.hp-hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(max-width:768px){
  .hp-header{padding:0 16px}
  .hp-nav{display:none}
  .hp-hamburger{display:flex}
  .hp-header-right .hp-btn-login{display:none}
  .hp-header-right .hp-btn-cta{display:none}
  .hp-header-right .hp-lang{display:none}
}
/* Mobile nav overlay */
.hp-mobile-nav{
  display:none;position:fixed;top:64px;left:0;right:0;bottom:0;
  background:var(--navy2);z-index:8999;overflow-y:auto;
  padding:24px 16px;
}
.hp-mobile-nav.open{display:block}
.hp-mobile-nav a{
  display:block;padding:14px 0;color:rgba(255,255,255,.85);font-size:16px;font-weight:500;
  border-bottom:1px solid rgba(255,255,255,.07);
}
.hp-mobile-nav a:hover{color:#fff}
.hp-mobile-nav .mn-cta{
  margin-top:20px;display:block;text-align:center;
  background:var(--primary);color:#fff;border-radius:10px;padding:14px;font-weight:700;
}
/* Poenostavljen meni (5. okt. 2026): ločena jezikovna + Log in/Sign up vrstica v mobilnem
   meniju ter vidni focus states za tipkovnico. */
.hp-mobile-nav .mn-lang{display:flex;flex-wrap:wrap;gap:8px;padding:16px 0 4px}
.hp-mobile-nav .mn-lang a{
  display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border:1px solid rgba(255,255,255,.14);
  border-radius:8px;font-size:14px;background:rgba(255,255,255,.07);
}
.hp-mobile-nav .mn-auth{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px}
.hp-mobile-nav .mn-auth .mn-cta{margin-top:0}
.hp-mobile-nav .mn-login{
  display:block;text-align:center;border:1px solid rgba(255,255,255,.18);border-bottom:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.08);color:#fff;border-radius:10px;padding:14px;font-weight:600;
}
.hp-nav > a:focus-visible,.hp-nav-dropdown > button:focus-visible,.hp-nav-dropdown-menu a:focus-visible,
.hp-lang-btn:focus-visible,.hp-lang-menu a:focus-visible,.hp-btn-login:focus-visible,.hp-btn-cta:focus-visible,
.hp-hamburger:focus-visible,.hp-mobile-nav a:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
.hp-nav-dropdown-menu a:focus-visible,.hp-lang-menu a:focus-visible{background:rgba(255,255,255,.08);color:#fff}
