/* MIT poslovni procesi | Premium 3D navigation controls | v2.0 */
/* Applies only to language selector and header assessment CTA. */
.site-header .language-switch {
  display: inline-flex; align-items: stretch; gap: 3px;
  padding: 4px; border: 1px solid #079cc8; border-radius: 14px;
  background: linear-gradient(165deg,#0a4c78 0%,#082c4d 32%,#04182d 100%);
  box-shadow: inset 0 2px 1px rgba(185,250,255,.38), inset 0 -3px 3px rgba(0,4,21,.75), 0 4px 0 #03182b, 0 8px 15px rgba(0,0,0,.35), 0 0 9px rgba(0,194,255,.13);
  overflow: visible;
}
.site-header .language-switch > a,
.site-header .language-switch > span {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 39px; min-height: 35px; padding: 7px 11px;
  border-radius: 10px; border: 1px solid rgba(53,186,234,.27);
  color: #d9eafa; font-weight: 800; line-height: 1.15;
  text-decoration: none; text-shadow: 2px 2px 0 #08254d;
  background: linear-gradient(165deg,#073758 0%,#04182f 100%);
  box-shadow: inset 0 1px 1px rgba(140,231,255,.18), inset 0 -2px 2px rgba(0,0,0,.25);
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease;
}
.site-header .language-switch > [aria-current="page"] {
  color: #042a45;
  background: linear-gradient(165deg,#a0ffff 0%,#2af2ec 25%,#00c6ce 77%,#00a7c2 100%);
  border-color: #5ffff6;
  text-shadow: 2px 2px 0 rgba(5,46,91,.38);
  box-shadow: inset 0 2px 2px rgba(255,255,255,.78), inset 0 -3px 3px rgba(0,102,147,.55), 0 3px 0 #006c87, 0 4px 7px rgba(0,0,0,.36);
}
.site-header .language-switch > a:hover { transform: translateY(-2px); filter: brightness(1.15); box-shadow: inset 0 1px 2px rgba(255,255,255,.38), 0 4px 0 #034a75, 0 5px 10px rgba(0,189,255,.22); }
.site-header .language-switch > a:active { transform: translateY(2px); box-shadow: inset 0 2px 4px rgba(0,0,0,.5); }
.site-header .nav-cta {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 45px; padding: 11px 20px;
  border: 1px solid #27c6fa; border-radius: 13px;
  color: #fff; font-weight: 800; line-height: 1.2;
  text-decoration: none; text-shadow: 2px 2px 0 #08265a;
  background: linear-gradient(180deg,#71e7ff 0%,#168dff 11%,#0865ec 57%,#0348cc 100%);
  box-shadow: inset 0 2px 1px rgba(255,255,255,.66), inset 0 -4px 2px rgba(0,35,137,.52), 0 4px 0 #06338e, 0 8px 15px rgba(0,0,0,.36), 0 0 11px rgba(0,167,255,.22);
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease;
}
.site-header .nav-cta:hover { transform: translateY(-2px); filter: brightness(1.1); box-shadow: inset 0 2px 1px rgba(255,255,255,.72), inset 0 -4px 2px rgba(0,35,137,.48), 0 6px 0 #06338e, 0 12px 18px rgba(0,0,0,.39), 0 0 16px rgba(0,187,255,.35); }
.site-header .nav-cta:active { transform: translateY(3px); box-shadow: inset 0 3px 6px rgba(0,22,90,.45), 0 1px 0 #06338e; }
.site-header .language-switch > a:focus-visible,
.site-header .nav-cta:focus-visible { outline: 3px solid #8ffaff; outline-offset: 4px; }
@media (prefers-reduced-motion: reduce) {
  .site-header .language-switch > a, .site-header .nav-cta { transition: none; }
}


/* v2.0 | All page action buttons and service action links, HR + EN */
/* Scope: only .button and .text-link; existing nav buttons retain their styling. */
.button.primary, .button.ghost, .button.dark-button, .button.light-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  position: relative;
  border-radius: 13px;
  border: 1px solid #27c6fa;
  font-weight: 800;
  text-decoration: none;
  text-shadow: 2px 2px 0 #08265a;
  background: linear-gradient(180deg,#71e7ff 0%,#168dff 11%,#0865ec 57%,#0348cc 100%);
  color: #fff;
  box-shadow: inset 0 2px 1px rgba(255,255,255,.66), inset 0 -4px 2px rgba(0,35,137,.52), 0 4px 0 #06338e, 0 8px 15px rgba(0,0,0,.32), 0 0 11px rgba(0,167,255,.18);
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease;
}
.button.primary:hover, .button.ghost:hover, .button.dark-button:hover, .button.light-button:hover {
  transform: translateY(-2px);
  filter: brightness(1.08);
  box-shadow: inset 0 2px 1px rgba(255,255,255,.76), inset 0 -4px 2px rgba(0,35,137,.48), 0 6px 0 #06338e, 0 12px 18px rgba(0,0,0,.35), 0 0 16px rgba(0,187,255,.27);
}
.button.primary:active, .button.ghost:active, .button.dark-button:active, .button.light-button:active {
  transform: translateY(3px);
  box-shadow: inset 0 3px 6px rgba(0,22,90,.45), 0 1px 0 #06338e;
}
/* Secondary NIS2 action: raised dark navy rather than a filled primary blue. */
.button.ghost {
  background: linear-gradient(170deg,#174567 0%,#092a46 35%,#061a2c 100%);
  border-color: #4382a3;
  box-shadow: inset 0 2px 1px rgba(155,220,255,.25), inset 0 -3px 2px rgba(0,5,20,.65), 0 4px 0 #03101e, 0 8px 15px rgba(0,0,0,.35);
}
.button.ghost:hover { box-shadow: inset 0 2px 1px rgba(155,220,255,.4), inset 0 -3px 2px rgba(0,5,20,.6), 0 6px 0 #03101e, 0 12px 18px rgba(0,0,0,.4), 0 0 12px rgba(40,183,255,.22); }
.button.ghost:active { box-shadow: inset 0 3px 6px rgba(0,5,20,.65), 0 1px 0 #03101e; }
/* Training CTA: premium near-black with restrained blue highlights. */
.button.dark-button {
  background: linear-gradient(170deg,#214662 0%,#0b263e 26%,#03111f 100%);
  border-color: #2c749a;
  box-shadow: inset 0 2px 1px rgba(145,220,255,.35), inset 0 -4px 2px rgba(0,3,14,.65), 0 4px 0 #010b14, 0 8px 15px rgba(0,0,0,.3);
}
.button.dark-button:hover { box-shadow: inset 0 2px 1px rgba(145,220,255,.5), inset 0 -4px 2px rgba(0,3,14,.65), 0 6px 0 #010b14, 0 12px 18px rgba(0,0,0,.35), 0 0 13px rgba(0,150,220,.2); }
.button.dark-button:active { box-shadow: inset 0 3px 6px rgba(0,3,14,.7), 0 1px 0 #010b14; }
/* White contact CTA: dark lettering and exactly 2px navy lower-right shadow. */
.button.light-button {
  color: #092b4c;
  text-shadow: 2px 2px 0 rgba(8,38,90,.22);
  background: linear-gradient(180deg,#ffffff 0%,#f5fcff 42%,#dceeff 100%);
  border-color: #c4eaff;
  box-shadow: inset 0 2px 1px #fff, inset 0 -4px 2px rgba(105,165,205,.22), 0 4px 0 #7ab0d1, 0 8px 15px rgba(0,18,53,.24);
}
.button.light-button:hover { box-shadow: inset 0 2px 1px #fff, inset 0 -4px 2px rgba(105,165,205,.26), 0 6px 0 #7ab0d1, 0 12px 18px rgba(0,18,53,.28); }
.button.light-button:active { box-shadow: inset 0 3px 6px rgba(105,165,205,.35), 0 1px 0 #7ab0d1; }
/* Smaller service calls to action: gentle raised surface, not oversized buttons. */
a.text-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 9px;
  border: 1px solid rgba(39,198,250,.5);
  text-shadow: 2px 2px 0 rgba(8,38,90,.42);
  background: linear-gradient(180deg,rgba(112,218,255,.18),rgba(5,94,164,.16));
  box-shadow: inset 0 1px 1px rgba(255,255,255,.2), 0 3px 0 rgba(4,41,83,.48), 0 5px 9px rgba(0,0,0,.13);
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease;
}
a.text-link.dark-link {
  color: #073659;
  text-shadow: 2px 2px 0 rgba(8,38,90,.15);
  background: linear-gradient(180deg,#faffff,#d8f2ff);
  border-color: #9bdcf1;
}
a.text-link:hover { transform: translateY(-2px); filter: brightness(1.07); box-shadow: inset 0 1px 1px rgba(255,255,255,.32), 0 5px 0 rgba(4,41,83,.48), 0 9px 12px rgba(0,0,0,.16); }
a.text-link:active { transform: translateY(2px); box-shadow: inset 0 2px 3px rgba(0,0,0,.18), 0 1px 0 rgba(4,41,83,.48); }
.button:focus-visible, a.text-link:focus-visible { outline: 3px solid #8ffaff; outline-offset: 4px; }
@media (prefers-reduced-motion: reduce) {
 .button.primary, .button.ghost, .button.dark-button, .button.light-button, a.text-link { transition: none; }
}


/* v2.1 — GLASS 3D TAMNI: isključivo CTA za edukacije (HR i EN).
   Ostali gumbi ostaju Premium 3D v2.0. */
a.button.dark-button {
  isolation: isolate;
  overflow: hidden;
  color: #ffffff;
  text-shadow: 2px 2px 0 #08265a;
  border: 1px solid #75dcff;
  border-radius: 16px;
  background: linear-gradient(155deg, rgba(84,191,250,.55) 0%, rgba(14,98,171,.83) 21%, rgba(3,38,80,.96) 55%, #03172d 100%);
  box-shadow: inset 0 2px 1px rgba(230,253,255,.8), inset 0 -3px 3px rgba(0,129,218,.42),
    inset 2px 0 2px rgba(120,220,255,.28), 0 4px 0 #03406c,
    0 8px 17px rgba(0,15,35,.35), 0 0 12px rgba(0,176,255,.22);
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease;
}
a.button.dark-button::before {
  content: "";
  position: absolute;
  inset: 2px 2px auto 2px;
  height: 45%;
  border-radius: 13px 13px 55% 20%;
  background: linear-gradient(180deg,rgba(225,249,255,.28),rgba(116,211,255,.07) 75%,transparent);
  pointer-events: none;
  z-index: 0;
}
a.button.dark-button:hover {
  transform: translateY(-2px);
  filter: brightness(1.1);
  border-color: #b1efff;
  box-shadow: inset 0 2px 1px rgba(240,255,255,.92), inset 0 -3px 3px rgba(0,129,218,.48),
    0 6px 0 #03406c, 0 12px 21px rgba(0,15,35,.38), 0 0 18px rgba(0,190,255,.38);
}
a.button.dark-button:active {
  transform: translateY(3px);
  filter: brightness(.95);
  box-shadow: inset 0 3px 7px rgba(0,8,32,.6), inset 0 1px 1px rgba(255,255,255,.2), 0 1px 0 #03406c;
}
a.button.dark-button:focus-visible { outline: 3px solid #8ffaff; outline-offset: 4px; }
@media (prefers-reduced-motion: reduce) { a.button.dark-button { transition: none; } }


/* v2.2 — Glass 3D: CTA buttons + contact panel, Croatian and English. */
/* The header CTA and main hero primary button now share a glass-blue finish. */
.site-header a.nav-cta,
a.button.primary,
.contact-card a.button.light-button {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  color: #fff;
  text-shadow: 2px 2px 0 #08265a;
  border: 1px solid #69eaff;
  border-radius: 15px;
  background: linear-gradient(155deg, #69dfff 0%, #168cfc 14%, #0760de 48%, #0340ba 100%);
  box-shadow: inset 0 2px 1px rgba(255,255,255,.9), inset 0 -3px 2px rgba(0,38,140,.65),
    0 4px 0 #03409c, 0 8px 17px rgba(0,10,40,.32), 0 0 12px rgba(0,192,255,.22);
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease;
}
.site-header a.nav-cta::before,
a.button.primary::before,
.contact-card a.button.light-button::before {
  content: "";
  position: absolute;
  inset: 2px 3px auto;
  height: 40%;
  border-radius: 12px 12px 50% 15%;
  background: linear-gradient(180deg, rgba(255,255,255,.25), rgba(255,255,255,0));
  pointer-events: none;
}
.site-header a.nav-cta:hover,
a.button.primary:hover,
.contact-card a.button.light-button:hover {
  transform: translateY(-2px);
  filter: brightness(1.08);
  box-shadow: inset 0 2px 1px rgba(255,255,255,.94), inset 0 -3px 2px rgba(0,38,140,.6),
    0 6px 0 #03409c, 0 12px 21px rgba(0,10,40,.37), 0 0 19px rgba(0,192,255,.35);
}
.site-header a.nav-cta:active,
a.button.primary:active,
.contact-card a.button.light-button:active {
  transform: translateY(3px);
  box-shadow: inset 0 3px 8px rgba(0,17,73,.55), 0 1px 0 #03409c;
}
/* Full contact block: layered dark-blue glass, cyan edge and abstract light waves. */
.contact-section .contact-card {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  color: #f4fbff;
  border: 1px solid rgba(77,218,255,.9);
  border-radius: 24px;
  background:
    radial-gradient(ellipse at 96% 96%, rgba(0,147,255,.32) 0%, transparent 46%),
    radial-gradient(ellipse at 5% 5%, rgba(0,174,255,.23) 0%, transparent 42%),
    linear-gradient(145deg, #0b4983 0%, #062b60 27%, #031a3d 61%, #062e69 100%);
  box-shadow: inset 0 2px 2px rgba(213,250,255,.72), inset 0 -3px 3px rgba(0,163,255,.55),
    0 5px 0 #023c73, 0 14px 34px rgba(0,15,40,.28), 0 0 20px rgba(0,175,255,.12);
}
.contact-section .contact-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(ellipse 110% 40% at 85% 115%, transparent 60%, rgba(0,184,255,.35) 61%, transparent 62%),
    radial-gradient(ellipse 100% 35% at 10% 112%, transparent 62%, rgba(0,112,255,.35) 63%, transparent 64%),
    linear-gradient(115deg, rgba(255,255,255,.11) 0%, transparent 25%, transparent 75%, rgba(0,193,255,.09) 100%);
}
.contact-section .contact-card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(180deg,rgba(216,250,255,.12),transparent 27%);
}
.contact-section .contact-card h2,
.contact-section .contact-card p,
.contact-section .contact-card .eyebrow,
.contact-section .contact-card .contact-actions > a:not(.button) {
  color: #f3faff;
}
.contact-section .contact-card h2 { text-shadow: 2px 2px 0 #08265a; }
.contact-section .contact-card .eyebrow { color: #62eaff; }
.contact-section .contact-card .contact-actions { position: relative; z-index: 1; }
.contact-section .contact-card .contact-actions > a:not(.button):hover { color: #79f5ff; }
.contact-section .contact-card a.button.light-button { max-width: 100%; }
.contact-section .contact-card a.button.light-button span { color: inherit; }
@media (prefers-reduced-motion: reduce) {
  .site-header a.nav-cta, a.button.primary, .contact-card a.button.light-button { transition: none; }
}
