/* ===========================
   VARIABLY & CONTAINER
   =========================== */
:root{
  --c-topbar-bg:#073C55;
  --c-topbar-text:#fff;
  --c-header-bg:#ffffff;
  --c-border:#E3E8EF;
  --c-subtle:#EEF3F7;
  --radius:12px;
  --shadow:0 10px 30px rgba(0,0,0,.08);

  --topbar-h:50px;      /* výška top baru desktop */
  --header-h:84px;      /* výška hlavného headera desktop */
  --header-h-m:64px;    /* výška headera na mobile */
}

.container{max-width:1290px;margin:0 auto;padding:0 20px;}

/* ===========================
   TOP BAR
   =========================== */

.topbar{
  position: relative;
  z-index: 5000;
  background:var(--c-topbar-bg);
  color:var(--c-topbar-text);
  font-size:.95rem;
}
.topbar .container{
  height:var(--topbar-h);
  display:flex; align-items:center; justify-content:flex-end;
  gap:20px;
}

.topbar-sep{
  color: #51C3A1;
  margin-left: 5px;
  margin-right: 5px;
}

.topbar-link{ color:var(--c-topbar-text) !important; text-decoration:none; opacity:.95; }
.topbar-link:hover{ opacity:1; text-decoration:underline; }
.top-cta{ list-style:none; display:flex; gap:16px; margin:0; padding:0; }
.top-cta > li > a{
  display:inline-block; padding:8px 15px; border-radius:10px 10px 10px 1px;
background:linear-gradient(80deg,#19BDA3,#A7FFDC); border-color:transparent;
}
.top-cta > li:nth-child(2) > a{  background:#EDF3F7; color:#073C55; text-decoration:none;  }
.top-cta > li:nth-child(3) > a{  color:#073C55; background:transparent; color:#fff; border-color:rgba(255,255,255,.8); border:1px solid #fff; }

/* ===========================
   HEADER (branding + nav)
   =========================== */

   .page-header .entry-title, .site-footer .footer-inner, .site-footer:not(.dynamic-footer), .site-header .header-inner, .site-header:not(.dynamic-header), body:not([class*=elementor-page-]) .site-main{
     max-width: 1290px;
   }
.site-header{
  position: relative; z-index: 6000;
  background:var(--c-header-bg);
  border-radius:14px;
}
.header-inner{
  position: relative; /* kotevný bod pre mega panel */
  display:flex; align-items:center; gap:24px;
  height:var(--header-h);
  border:1px solid var(--c-border);
  border-radius:10px;
}
.branding img{ width:110px; height:auto; display:block; }
.site-title{ font-weight:700; font-size:1.125rem; }

/* WPML mini štýl (ponecháme decentné) */
/* Jazykový prepínač */ .wpml-ls-statics-shortcode_actions, .wpml-ls-statics-shortcode_actions .wpml-ls-sub-menu, .wpml-ls-statics-shortcode_actions a{
width:80px; background:#073C55 !important; color:#fff !important; border-radius:10px 10px 10px 1px !important; padding: 8px; border:none !important; }


.wpml-ls-sub-menu, .wpml-ls-statics-shortcode_actions a:hover
{
background:#1CBDA4!important;
 }

.js-wpml-ls-item-toggle.wpml-ls-item-toggle{ border:none; border-radius: 0px; }
.wpml-ls-legacy-dropdown a.wpml-ls-item-toggle{ width:70px; border:none !important;}

.wpml-ls-sub-menu{ padding: 0px !important; }

/* ===========================
   NAV – spoločné
   =========================== */
.site-header .primary-nav ul,
.site-header .primary-nav li{ list-style:none; margin:0; padding:0; }
.site-header .primary-nav a{ text-decoration:none; color:#0E2330; }

/* Burger button */
.nav-toggle{ display:none; background:transparent; border:0; cursor:pointer; padding:8px; margin-left:8px; }
.nav-toggle .bar{ display:block; width:22px; height:2px; margin:4px 0; background:#0E2330; }

/* ===========================
   DESKTOP NAV
   =========================== */
@media (min-width:1025px){
  nav.primary-nav > ul,
  .primary-nav .menu{
    display:flex !important; flex-direction:row; align-items:center; gap:15px;
  }
  .primary-nav .menu > li{ position:relative; }

  .primary-nav .menu > li > a{
    display:block; padding:10px 15px; border-radius:10px 10px 10px 1px;
  }
  .primary-nav .menu > li > a:hover,
  .primary-nav .menu > li.current-menu-item > a{
    background:var(--c-subtle);
  }

  /* bežné dropdowny (nie mega) */
  .primary-nav .menu > li.menu-item-has-children:not(.is-mega) > .sub-menu{
    position:absolute; left:0; top:100%;
    min-width:220px; padding:8px 0;
    background:#fff; border:1px solid #E7EDF3; border-radius:12px;
    box-shadow:var(--shadow);
    opacity:0; visibility:hidden; transform:translateY(8px); transition:.18s ease;
  }
  .primary-nav .menu > li.menu-item-has-children:not(.is-mega):hover > .sub-menu{
    opacity:1; visibility:visible; transform:translateY(0);
  }
  /* len klasické dropdowny, nie .is-mega */
  .primary-nav .menu > li.menu-item-has-children:not(.is-mega) > .sub-menu li > a{
    display: inline-block;   /* už nie full-width */
    width: auto;
    color:white;
  }


  .primary-nav .menu > li.menu-item-has-children:not(.is-mega) > .sub-menu{
    text-align: left;        /* istota zarovnania vľavo */
  }

}

/* ===========================
   MEGA MENU – DESKTOP
   =========================== */
/* kotviť na .header-inner (celý header container) */
.primary-nav .menu > li.is-mega{ position:static; }
.primary-nav .menu > li.is-mega > .sub-menu{
  position:absolute; left:0; right:0; top:100%;
  margin-top:10px; padding:24px 0; /* vnútorné odsadenie riešime cez child .container-row */
  opacity:0; visibility:hidden; transform:translateY(8px); transition:.2s ease;
  z-index:7000;
}
/* full-bleed pozadie */
.primary-nav .menu > li.is-mega > .sub-menu::before{
  content:""; position:absolute; left:50%; transform:translateX(-50%);
  width:100dvw; top:0; bottom:0;
  background:#fff; border:1px solid #E7EDF3; border-radius:16px; box-shadow:var(--shadow);
  z-index:-1;
}
/* obsah v šírke containeru */
.primary-nav .menu > li.is-mega > .sub-menu > .container-row{
  display:grid; gap:24px; grid-template-columns:340px 1fr 360px;
  margin:0 auto; max-width:1290px; padding:0 20px;
}
/* skryť helper anchor 2. úrovne */
.primary-nav .menu > li.is-mega > .sub-menu > li > a{ display:none; }

/* mapovanie sekcií (2. úroveň LI sú súrodenci) */
.primary-nav .menu > li.is-mega > .sub-menu > li.mega-col-logos{ grid-column:1; }
.primary-nav .menu > li.is-mega > .sub-menu > li.mega-col-links{ grid-column:2; display:none; }
.primary-nav .menu > li.is-mega > .sub-menu > li.mega-col-links.is-active{ display:block; }
.primary-nav .menu > li.is-mega > .sub-menu > li.mega-promo{ grid-column:3; display:flex; justify-content:flex-end; }

/* ľavý stĺpec – značky */
.primary-nav .menu > li.is-mega > .sub-menu > li.mega-col-logos > .sub-menu{
  display:grid; gap:12px;
}
.primary-nav .menu > li.is-mega > .sub-menu > li.mega-col-logos > .sub-menu > li.has-icon > a{
  display:flex; align-items:center; gap:12px; padding:12px 14px;
  border:1px solid #E7EDF3; border-radius:14px; background:#FAFCFF;
}
.primary-nav .menu > li.is-mega > .sub-menu > li.mega-col-logos > .sub-menu > li.has-icon > a::before{
  content:""; flex:0 0 36px; height:36px; border-radius:10px;
  background:#F3F7FB center/22px 22px no-repeat; border:1px solid #E7EDF3;
}
.primary-nav .menu li.icon-gq-interim    > a::before{ background-image:var(--wpr-bg-41e60e6d-809b-4734-8a23-9ae202200489) !important; }
.primary-nav .menu li.icon-gq-automation > a::before{ background-image:var(--wpr-bg-b0a144c3-8a63-4499-b83c-fcf1a7c88830) !important; }
.primary-nav .menu li.icon-gq-techminds  > a::before{ background-image:var(--wpr-bg-9834511f-8bb1-4539-b9dc-17f66d51066e) !important; }
.primary-nav .menu li.icon-gq-elite      > a::before{ background-image:var(--wpr-bg-83f3e242-f311-4df5-88ad-10e69ceb50a8) !important; }

.primary-nav .menu > li.is-mega > .sub-menu > li.mega-col-logos .is-active > a{
  background:#EEF7F3; border-color:#CBE8D9;
}

/* stred – linky do 2 stĺpcov */
.primary-nav .menu > li.is-mega > .sub-menu > li.mega-col-links > .sub-menu{
  column-count:2; column-gap:48px;
}
.primary-nav .menu > li.is-mega > .sub-menu > li.mega-col-links a{
  display:block; padding:8px 0; border-radius:6px;
}
.primary-nav .menu > li.is-mega > .sub-menu > li.mega-col-links a:hover{ background:var(--c-subtle); }

/* promo pravý stĺpec */
.primary-nav .menu > li.is-mega > .sub-menu > li.mega-promo .promo-card{
  min-width:320px; min-height:240px; border-radius:16px; padding:22px;
  background:linear-gradient(135deg,#41D3B8,#63E08D); color:#0B3142;
  display:flex; flex-direction:column; gap:12px; box-shadow:var(--shadow);
}
.promo-card .promo-title{ margin:0 0 6px; font-size:1.25rem; line-height:1.2; }
.promo-card .promo-text{ margin:0 0 12px; width:70%;}
.promo-card .btn{ display:inline-block; padding:12px 18px; border-radius:12px; text-decoration:none; background:#0E3C55; color:#fff !important; font-weight:600; }

/* zobrazenie panelu na hover – až po layoute */
@media (min-width:1025px){
  .primary-nav .menu > li.is-mega:hover > .sub-menu{ opacity:1; visibility:visible; transform:translateY(0); }

}

/* ===========================
   MOBILE (≤ 1024px)
   =========================== */
@media (max-width:1024px){
  /* výšky */
  :root{ --topbar-h:44px; }

  /* topbar – zjednodušiť a skryť CTA */
  .topbar .container{ height:var(--topbar-h); justify-content:space-between; }
  .top-cta{ display:none; }

  /* header – nižší, burger viditeľný, jazyk bokom */
  .header-inner{ height:var(--header-h-m); }
  .nav-toggle{ display:block; margin-left:auto; }
/* Jazykový prepínač */ .wpml-ls-statics-shortcode_actions, .wpml-ls-statics-shortcode_actions .wpml-ls-sub-menu, .wpml-ls-statics-shortcode_actions a{ width:80px; background:#073C55 !important; color:#fff !important; border-radius:10px 10px 10px 1px !important; padding: 8px; border:1px solid #E1EAF1; } .js-wpml-ls-item-toggle.wpml-ls-item-toggle{ border:none; border-radius: 0px; } .wpml-ls-legacy-dropdown a.wpml-ls-item-toggle{ width:70px; } .wpml-ls-sub-menu{ padding: 0px !important; }
.branding img{ width:80px; height:auto; display:block; }
  /* NAV overlay pod headerom: */
  .primary-nav{
    position: fixed;
    left: 0; right: 0;
    top: calc(var(--topbar-h) + var(--header-h-m)); /* začne pod topbar + header */
    bottom: 0;
    background:#fff;
    transform: translateY(-2%);
    opacity: 0; visibility: hidden;
    overflow: auto; padding: 18px 20px;
    transition: .2s ease;
  }
  .primary-nav.open{ transform:none; opacity:1; visibility:visible; }

  /* hlavné UL */
  .primary-nav .menu{ display:flex; flex-direction:column; gap:10px; }

  /* mega na mobile = ploché sekcie (žiadny overlay grid) */
  .primary-nav .menu > li.is-mega > .sub-menu{
    position: static; padding:12px 0; margin:0; opacity:1; visibility:visible; transform:none;
  }
  .primary-nav .menu > li.is-mega > .sub-menu::before{ display:none; }
  .primary-nav .menu > li.is-mega > .sub-menu > .container-row{ display:block; padding:0; max-width:none; }
  .primary-nav .menu > li.is-mega > .sub-menu > li.mega-col-links > .sub-menu{ column-count:1; column-gap:0; }
}

/* voliteľný závoj pri otvorenom menu */
@media (max-width:1024px){
  body.nav-open{ overflow:hidden; }
  body.nav-open::after{
    content:""; position:fixed; inset:0;
    background:rgba(0,0,0,.25); z-index:5500;
  }
}



/* ---- MEGA: pracujeme s .container-row ---- */

/* skryť pomocné A na 2. úrovni (headre stĺpcov) */
.primary-nav .menu > li.is-mega > .sub-menu > .container-row {
  display: grid;
  grid-template-columns: 1fr 2fr 1fr; /* ľavý, stredný, pravý stĺpec */
  gap: 20px; /* medzera medzi stĺpcami */
  align-items: start;
}

/* ľavý stĺpec – logá */
.primary-nav .menu > li.is-mega > .sub-menu > .container-row > li.mega-col-logos {
  grid-column: 1;
}

/* stredný stĺpec – linky */
.primary-nav .menu > li.is-mega > .sub-menu > .container-row > li.mega-col-links {
  grid-column: 2;
  display: none; /* defaultne skryté */
}
.primary-nav .menu > li.is-mega > .sub-menu > .container-row > li.mega-col-links.is-active {
  display: block; /* zobrazí sa len aktívna */
}

/* pravý stĺpec – promo bloky */
.primary-nav .menu > li.is-mega > .sub-menu > .container-row > li.mega-promo {
  grid-column: 3;
  display: flex;
  justify-content: flex-end;
}

/* Ľavý stĺpec – značky */
.primary-nav .menu > li.is-mega > .sub-menu > .container-row > li.mega-col-logos > .sub-menu{
  display:grid; gap:5px; margin:0; padding:0; list-style:none;
}
.primary-nav .menu > li.is-mega > .sub-menu > .container-row > li.mega-col-logos > .sub-menu > li.has-icon > a{
  display:flex; align-items:center; gap:5px;
  padding:12px 14px; border:1px solid #E7EDF3; border-radius:14px;
  background:#FAFCFF; color:#0E2330;
}
.primary-nav .menu > li.is-mega > .sub-menu > .container-row > li.mega-col-logos > .sub-menu > li.has-icon > a::before{
  content:""; flex:0 0 36px; height:36px; border-radius:10px;
  background:#F3F7FB center/22px 22px no-repeat; border:1px solid #E7EDF3;
}

primary-nav .menu > li.is-mega > .sub-menu > .container-row > li.mega-col-logos > .sub-menu > li.has-icon > a:hover{
  display:flex; align-items:center; gap:5px;
  padding:12px 14px; border:1px solid #E7EDF3; border-radius:14px;
  background:#aaa; color:#0E2330;
}
.primary-nav .menu > li.is-mega > .sub-menu > .container-row > li.mega-col-logos .is-active > a{
  background:#EEF7F3; border-color:#CBE8D9;
}

/* Stred – linky v 2 stĺpcoch */
.primary-nav .menu > li.is-mega > .sub-menu > .container-row > li.mega-col-links > .sub-menu{
  column-count:2; column-gap:10px; margin:0; padding:0; list-style:none;
}
.primary-nav .menu > li.is-mega > .sub-menu > .container-row > li.mega-col-links a{
  display:block; padding:8px 15px; border-radius:6px;
}
.primary-nav .menu > li.is-mega > .sub-menu > .container-row > li.mega-col-links a:hover{
  background:#EEF3F7;
}

/* Promo karta (zostáva vpravo) */
.primary-nav .menu > li.is-mega > .sub-menu > .container-row > li.mega-promo .promo-card{
  min-width:320px; min-height:240px; border-radius:16px; padding:22px;
  background:linear-gradient(90deg,#1ABEA3,#A1FDDA); color:#0B3142; box-shadow:0 10px 30px rgba(0,0,0,.08);
}


/* MOBILE: submenu (aj mega) zatvorené by default, otvorí sa len pri .is-open */
@media (max-width:1024px){
  /* primárny overlay je už posunutý pod topbar+header, burger ostáva viditeľný */
  .primary-nav{
    position: fixed; left:0; right:0;
    top: 130px; /* posun pod top header */
    bottom: 0; background:#fff; overflow:auto;
    transform: translateY(-2%); opacity:0; visibility:hidden;
    padding:18px 20px; transition:.2s ease;
    z-index: 5600; /* header má 6000, takže burger je stále nad tým */
  }
  .primary-nav.open{ transform:none; opacity:1; visibility:visible; }

  /* ZÁKLAD: všetky submená skryté */
  .primary-nav .menu > li > .sub-menu{ display:none; }

  /* Otvorené len keď je rodič .is-open */
  .primary-nav .menu > li.is-open > .sub-menu{ display:block; }

  /* Mega submenu na mobile = ploché (bez full-bleed pozadia) */
  .primary-nav .menu > li.is-mega > .sub-menu{ position:static; margin:6px 0 0; padding:6px 0; }
  .primary-nav .menu > li.is-mega > .sub-menu::before{ display:none; }
  .primary-nav .menu > li.is-mega > .sub-menu > .container-row{ display:block; max-width:none; padding:0; }

  /* Stredný panel v mega na mobile = 1 stĺpec */
  .primary-nav .menu > li.is-mega > .sub-menu > .container-row > li.mega-col-links > .sub-menu{
    column-count:1; column-gap:0;
  }
}

/* DESKTOP: bez zmeny – mega sa ukáže na hover */
@media (min-width:1025px){
  .primary-nav .menu > li.is-mega:hover > .sub-menu{ opacity:1; visibility:visible; transform:translateY(0); }
}

/* MEGA s .container-row (prepísané selektory, nech funguje prepínač) */
.primary-nav .menu > li.is-mega > .sub-menu > .container-row > li.mega-col-logos > a,
.primary-nav .menu > li.is-mega > .sub-menu > .container-row > li.mega-col-links > a,
.primary-nav .menu > li.is-mega > .sub-menu > .container-row > li.mega-promo > a{ display:none !important; }

.primary-nav .menu > li.is-mega > .sub-menu > .container-row > li.mega-col-logos{ grid-column:1; }
.primary-nav .menu > li.is-mega > .sub-menu > .container-row > li.mega-col-links{ grid-column:2; display:none; }
.primary-nav .menu > li.is-mega > .sub-menu > .container-row > li.mega-col-links.is-active{ display:block; }
.primary-nav .menu > li.is-mega > .sub-menu > .container-row > li.mega-promo{ grid-column:3; display:flex; justify-content:flex-end; }

/* Ikony – uisti sa, že cesty sedia */
.primary-nav .menu li.icon-gq-interim    > a::before{ background-image:var(--wpr-bg-41e60e6d-809b-4734-8a23-9ae202200489) !important; }
.primary-nav .menu li.icon-gq-automation > a::before{ background-image:var(--wpr-bg-b0a144c3-8a63-4499-b83c-fcf1a7c88830) !important; }
.primary-nav .menu li.icon-gq-techminds  > a::before{ background-image:var(--wpr-bg-9834511f-8bb1-4539-b9dc-17f66d51066e) !important; }
.primary-nav .menu li.icon-gq-elite      > a::before{ background-image:var(--wpr-bg-83f3e242-f311-4df5-88ad-10e69ceb50a8) !important; }



/* veľkosť a absolutné pozície „barov“ */
.nav-toggle{
  position: relative;
  width: 44px; height: 44px;
  display: inline-flex; align-items:center; justify-content:center;
}



/* --- HAMBURGER → X --- */
:root{
  --hamb-w: 22px;    /* šírka čiarky */
  --hamb-h: 2px;     /* hrúbka čiarky */
  --hamb-gap: 5px;   /* medzera hore/dole od stredu */
  --hamb-color: #0E2330;
}

/* tlačidlo */
.nav-toggle{
  position:relative; width:44px; height:44px;
  display:inline-flex; align-items:center; justify-content:center;
  border:0; background:transparent; cursor:pointer;
}

/* stredná čiarka + pseudočiarky */
.hamburger,
.hamburger::before,
.hamburger::after{
  position:absolute; left:50%;
  width:var(--hamb-w); height:var(--hamb-h);
  background:var(--hamb-color);
  content:""; border-radius:1px;
  transform:translateX(-50%);       /* presne vystredi vodorovne */
  transition:transform .25s ease, opacity .2s ease, background-color .2s ease;
}

/* horná/dolná – posunuté od stredu */
.hamburger::before{ transform:translate(-50%, calc(-1 * var(--hamb-gap))); }
.hamburger::after { transform:translate(-50%, var(--hamb-gap)); }

/* OPEN stav → X */
.nav-toggle[aria-expanded="true"] .hamburger{ opacity:0; } /* stredná zmizne */
.nav-toggle[aria-expanded="true"] .hamburger::before{
  transform:translate(-50%, 0) rotate(45deg);
}
.nav-toggle[aria-expanded="true"] .hamburger::after{
  transform:translate(-50%, 0) rotate(-45deg);
}

/* voliteľné: keď je menu otvorené, urob biele X (na tmavom pozadí) */
@media (max-width:1024px){
  body.nav-open .hamburger,
  body.nav-open .hamburger::before,
  body.nav-open .hamburger::after{ background:#fff; }
}


/* ----- HAMBURGER (Erik Terwan) ----- */
:root{
  --hamb-w: 26px;     /* šírka čiarky */
  --hamb-h: 2px;      /* hrúbka čiarky */
  --hamb-gap: 7px;    /* medzera od stredu hore/dole */
  --hamb-color: #0E2330;
}

.nav-toggle{ position:relative; width:44px; height:44px; display:none; margin-left:auto; }
@media (max-width:1024px){ .nav-toggle{ display:inline-flex; } }

.nav-toggle input{
  position:absolute; inset:0; appearance:none; -webkit-appearance:none;
  opacity:0; cursor:pointer; z-index:3; /* klikateľná plocha */
}

.nav-toggle .burger{
  position:absolute; left:50%; top:50%;
  width:var(--hamb-w); height:calc(var(--hamb-h)*3 + var(--hamb-gap)*2);
  transform:translate(-50%,-50%);
  display:block; z-index:2;
}

.nav-toggle .burger span,
.nav-toggle .burger span::before,
.nav-toggle .burger span::after{
  position:absolute; left:0; right:0; height:var(--hamb-h); background:var(--hamb-color);
  content:""; border-radius:2px;
  transition: transform .45s cubic-bezier(.77,.2,.05,1), opacity .3s ease, background .2s;
}

/* tri čiarky: stred + pseudo ako horná/dolná */
.nav-toggle .burger span{ top:50%; transform:translateY(-50%); }
.nav-toggle .burger span::before{ top:calc(-1 * var(--hamb-gap)); }
.nav-toggle .burger span::after { top:var(--hamb-gap); }

/* checked -> X */
#nav-check:checked + .burger span       { background:transparent; }     /* stredná zmizne */
#nav-check:checked + .burger span::before{ transform:translateY(var(--hamb-gap)) rotate(45deg); background:#000; }
#nav-check:checked + .burger span::after { transform:translateY(calc(-1 * var(--hamb-gap))) rotate(-45deg); background:#000;}

/* voliteľne: otvorené menu na mobile = biele X (ak máš tmavý overlay/závoj) */
@media (max-width:1024px){
  body.nav-open .nav-toggle .burger span,
  body.nav-open .nav-toggle .burger span::before,
  body.nav-open .nav-toggle .burger span::after{ background:#fff; }
}


/* ============= WHAT WE DO (is-wwd) – 1:logos, 2x promo ============ */
.primary-nav .menu > li.is-mega.is-wwd > .sub-menu::before{
  /* full-bleed pozadie ostáva */
}

/* 3-stĺpcový obsah: 340px (logá) + 1fr + 1fr (dve promá) */
.primary-nav .menu > li.is-mega.is-wwd > .sub-menu > .container-row{
  display:grid;
  grid-template-columns: 340px 1fr 1fr;
  gap:24px;
  max-width:1290px; margin:0 auto; padding:0 20px;
}

/* mapovanie sekcií */
.primary-nav .menu > li.is-mega.is-wwd > .sub-menu > .container-row > li.mega-col-logos{ grid-column:1; }

/* prvé mega-promo do stĺpca 2, druhé do stĺpca 3 */
.primary-nav .menu > li.is-mega.is-wwd > .sub-menu > .container-row > li.mega-promo:first-of-type{
  grid-column:2; display:flex; justify-content:flex-start;
}
.primary-nav .menu > li.is-mega.is-wwd > .sub-menu > .container-row > li.mega-promo:last-of-type{
  grid-column:3; display:flex; justify-content:flex-start;
}

/* vzhľad promo kariet – môžeš ponechať rovnaký ako pri aktuálnom megamenu */
.primary-nav .menu > li.is-mega.is-wwd > .sub-menu > .container-row > li.mega-promo .promo-card{
  width:100%; min-height:240px; border-radius:16px; padding:22px;
  background: linear-gradient(90deg,#41D3B8,#63E08D);
  color:#0B3142; box-shadow:0 10px 30px rgba(0,0,0,.08);
  display:flex; flex-direction:column; gap:12px;
}

/* ľavý stĺpec – značka pilule (recyklujeme tvoje štýly) */
.primary-nav .menu > li.is-mega.is-wwd > .sub-menu > .container-row > li.mega-col-logos > .sub-menu{
  display:grid; gap:5px; margin:0; padding:0; list-style:none;
}

/* skryť helper anchor 2. úrovne */
.primary-nav .menu > li.is-mega.is-wwd > .sub-menu > .container-row > li > a{ display:none !important; }

/* MOBILE: všetko pod seba (logá hore, potom 2 promá) */
@media (max-width:1024px){
  .primary-nav .menu > li.is-mega.is-wwd > .sub-menu{ position:static; padding:12px 0; }
  .primary-nav .menu > li.is-mega.is-wwd > .sub-menu::before{ display:none; }
  .primary-nav .menu > li.is-mega.is-wwd > .sub-menu > .container-row{
    display:block; max-width:none; padding:0;
  }
  .primary-nav .menu > li.is-mega.is-wwd > .sub-menu > .container-row > li.mega-promo{
    margin-top:10px;
  }
}


/* WHAT WE DO (is-wwd): rozmiestnenie 2 promo kariet */
.primary-nav .menu > li.is-mega.is-wwd > .sub-menu > .container-row > li.mega-promo{
  grid-column: auto !important;   /* zruš default col-3 z generického pravidla */
  justify-content: flex-start;
}

/* Promo 1 = stred (2. stĺpec), hneď za blokom s logami */
.primary-nav .menu > li.is-mega.is-wwd > .sub-menu > .container-row
> li.mega-col-logos + li.mega-promo{
  grid-column: 2 !important;
}

/* Promo 2 = pravý (3. stĺpec) – je hneď po Promo 1 */
.primary-nav .menu > li.is-mega.is-wwd > .sub-menu > .container-row
> li.mega-col-logos + li.mega-promo + li.mega-promo{
  grid-column: 3 !important;
}

/* ===== Industries mega: 2 link stĺpce + promo vpravo ===== */
.primary-nav .menu > li.is-mega.is-industries > .sub-menu > .container-row{
  display:grid;
  grid-template-columns: 1fr 360px  360px;   /* ľavý | stred | promo */
  gap:24px;
  max-width:1290px; margin:0 auto; padding:0 20px;
}

/* ľavý linkový stĺpec musí byť vždy viditeľný (prebíja generické display:none) */
.primary-nav .menu > li.is-mega.is-industries > .sub-menu > .container-row > li.mega-col-links.col-left{
  grid-column:1; display:block !important;
}

/* predvolené rozmiestnenie promo 1 a promo 2 podľa poradia */
.primary-nav .menu > li.is-mega.is-industries > .sub-menu > .container-row
> li.mega-col-links.col-left + li.mega-promo{
  grid-column:2 !important; display:flex; justify-content:flex-start;
}
.primary-nav .menu > li.is-mega.is-industries > .sub-menu > .container-row
> li.mega-col-links.col-left + li.mega-promo + li.mega-promo{
  grid-column:3 !important; display:flex; justify-content:flex-start;
}

/* alternatíva: explicitné triedy ak zmeníš poradie v Menus */
.primary-nav .menu > li.is-mega.is-rindustries> .sub-menu > .container-row > li.mega-promo.promo-left  { grid-column:2 !important; }
.primary-nav .menu > li.is-mega.is-industries > .sub-menu > .container-row > li.mega-promo.promo-right { grid-column:3 !important; }

/* vzhľad zoznamov v ľavom/strednom stĺpci */
.primary-nav .menu > li.is-mega.is-industries > .sub-menu > .container-row > li.mega-col-links > .sub-menu{
  list-style:none; margin:0; padding:0;
}
.primary-nav .menu > li.is-mega.is-industries > .sub-menu > .container-row > li.mega-col-links > .sub-menu > li > a{
  display:block; padding:11px 15px; border-radius:6px; color:#0E2330; text-decoration:none;
  font-size: 16px;
}
.primary-nav .menu > li.is-mega.is-industries > .sub-menu > .container-row > li.mega-col-links > .sub-menu > li > a:hover{
  background: var(--c-subtle);
}

/* promo karta – použijeme tvoje default štýly */
.primary-nav .menu > li.is-mega.is-industries > .sub-menu > .container-row > li.mega-promo .promo-card{
  width:100%; min-height:240px; border-radius:16px; padding:22px;
  background:linear-gradient(135deg,#41D3B8,#63E08D); color:#0B3142; box-shadow:var(--shadow);
  display:flex; flex-direction:column; gap:12px;
}

/* MOBILE: pod seba (logika tvojho mobilného overlay menu ostáva) */
@media (max-width:1024px){
  .primary-nav .menu > li.is-mega.is-industries > .sub-menu{ position:static; padding:12px 0; }
  .primary-nav .menu > li.is-mega.is-industries > .sub-menu::before{ display:none; }
  .primary-nav .menu > li.is-mega.is-industries > .sub-menu > .container-row{ display:block; max-width:none; padding:0; }
  .primary-nav .menu > li.is-mega.is-industries > .sub-menu > .container-row > li.mega-promo{ margin-top:12px; }
}


/* ===== Chevron pre top-level MEGA položky ===== */

/* rezerva na ikonku vpravo */
.primary-nav .menu > li.is-mega > a{
  position: relative;
  padding-right: 28px; /* ponechaj tvoje paddingy, len pridáme miesto pre šípku */
}

/* samotná šípka (chevron) – kreslená z borders, farba = currentColor */
.primary-nav .menu > li.is-mega > a::after{
  content:"";
  position:absolute;
  right: 10px; top: 50%;
  width: 5px; height: 5px;
  border-right: 1px solid currentColor;
  border-bottom: 1px solid currentColor;
  transform: translateY(-60%) rotate(45deg); /* smerom dole (V) */
  opacity: .8;
  transition: transform .2s ease, opacity .2s ease;
  pointer-events: none; /* nech to neblokuje klik na odkaz */
}

/* DESKTOP: pri hover otoč chevron hore (∧) */
@media (min-width:1025px){
  .primary-nav .menu > li.is-mega:hover > a::after{
    transform: translateY(-40%) rotate(-135deg); /* smerom hore (∧) */
    opacity: 1;
  }
}

/* MOBILE: keď je položka otvorená (accordion .is-open), otoč chevron hore */
@media (max-width:1024px){
  .primary-nav .menu > li.is-mega.is-open > a::after{
    transform: translateY(-40%) rotate(-135deg);
    opacity: 1;
  }
}

/* ===== Resources mega: ľavý linkový stĺpec + 2 promá ===== */
.primary-nav .menu > li.is-mega.is-resources > .sub-menu > .container-row{
  display:grid;
  grid-template-columns: 1fr 400px 400px;  /* 1) linky | 2) promo | 3) promo */
  gap:24px;
  max-width:1290px; margin:0 auto; padding:0 20px;
}

/* Resources: prvý (ľavý) textový grid v 1 stĺpci na desktope */
@media (min-width:1025px){
  .primary-nav .menu > li.is-mega.is-resources > .sub-menu > .container-row
  > li.mega-col-links.col-left > .sub-menu{
    column-count: 1 !important;
    column-gap: 0;
  }
}


/* skryť helper <a> na 2. úrovni */
.primary-nav .menu > li.is-mega.is-resources > .sub-menu > .container-row > li > a{
  display:none !important;
}

/* ľavý linkový stĺpec musí byť vždy viditeľný (prebíja generické display:none) */
.primary-nav .menu > li.is-mega.is-resources > .sub-menu > .container-row > li.mega-col-links.col-left{
  grid-column:1; display:block !important;
}

/* predvolené rozmiestnenie promo 1 a promo 2 podľa poradia */
.primary-nav .menu > li.is-mega.is-resources > .sub-menu > .container-row
> li.mega-col-links.col-left + li.mega-promo{
  grid-column:2 !important; display:flex; justify-content:flex-start;
}
.primary-nav .menu > li.is-mega.is-resources > .sub-menu > .container-row
> li.mega-col-links.col-left + li.mega-promo + li.mega-promo{
  grid-column:3 !important; display:flex; justify-content:flex-start;
}

/* alternatíva: explicitné triedy ak zmeníš poradie v Menus */
.primary-nav .menu > li.is-mega.is-resources > .sub-menu > .container-row > li.mega-promo.promo-left  { grid-column:2 !important; }
.primary-nav .menu > li.is-mega.is-resources > .sub-menu > .container-row > li.mega-promo.promo-right { grid-column:3 !important; }

/* vzhľad linkového stĺpca (obyčajné odkazy) */
.primary-nav .menu > li.is-mega.is-resources > .sub-menu > .container-row > li.mega-col-links > .sub-menu{
  list-style:none; margin:0; padding:0;
}
.primary-nav .menu > li.is-mega.is-resources > .sub-menu > .container-row > li.mega-col-links > .sub-menu > li > a{
  display:block; padding:8px 15px; border-radius:6px; color:#0E2330; text-decoration:none;
}
.primary-nav .menu > li.is-mega.is-resources > .sub-menu > .container-row > li.mega-col-links > .sub-menu > li > a:hover{
  background: var(--c-subtle);
}

/* promo karty – recyklujeme tvoj štýl */
.primary-nav .menu > li.is-mega.is-resources > .sub-menu > .container-row > li.mega-promo .promo-card{
  width:100%; min-height:250px; border-radius:16px; padding:22px;
  background:linear-gradient(135deg,#41D3B8,#63E08D); color:#0B3142; box-shadow:var(--shadow);
  display:flex; flex-direction:column; gap:12px;
}

/* Mobile: pod seba (linky hore, potom promo1, promo2) */
@media (max-width:1024px){
  .primary-nav .menu > li.is-mega.is-resources > .sub-menu{ position:static; padding:12px 0; }
  .primary-nav .menu > li.is-mega.is-resources > .sub-menu::before{ display:none; }
  .primary-nav .menu > li.is-mega.is-resources > .sub-menu > .container-row{ display:block; max-width:none; padding:0; }
  .primary-nav .menu > li.is-mega.is-resources > .sub-menu > .container-row > li.mega-promo{ margin-top:12px; }
}


/* Resources: ľavý stĺpec ~30%, 2 promá vpravo (len pre .is-resources) */
.primary-nav .menu > li.is-mega.is-resources > .sub-menu > .container-row{
  /* prebijeme staré 1fr 360px 360px */
  grid-template-columns: minmax(240px, 30%) minmax(300px, 1fr) minmax(300px, 1fr) !important;
  align-items: start;
}

/* ak sú veľmi dlhé názvy v ľavom stĺpci, nech sa pekne zalamia */
.primary-nav .menu > li.is-mega.is-resources > .sub-menu > .container-row > li.mega-col-links.col-left{
  overflow-wrap: anywhere;  /* zabráni pretiekaniu pri úzkom 30% stĺpci */
}



/* ===== Promo s fotkou v pozadí (platí pre všetky megamená) ===== */
.primary-nav .menu > li.is-mega > .sub-menu .promo-card{
  position: relative;
  overflow: hidden;

  /* 2 vrstvy: 1) polopriesvitný gradient NAVRCHU, 2) fotka POD ním */
  background-image:
    linear-gradient(135deg, rgba(65,211,184,.92), rgba(99,224,141,.84)),
    url(https://gq.owi.click/wp-content/uploads/2025/08/busy-businessman-working-tablet-mobile-phone-1.png);
  background-repeat: no-repeat, no-repeat;

  /* gradient vyplní kartu, fotka bude „prilepená“ doprava a na výšku karty */
  background-size: cover, auto 115%;
  background-position: center, right -20px bottom;

  /* nech text nelezie do fotky na desktope */
  padding-right: clamp(24px, 12vw, 260px);
}

/* ak chceš mať v niektorých sekciách iný orez, môžeš špecifikovať:
.primary-nav .menu > li.is-mega.is-wwd .promo-card{ background-position: center, right -10px bottom; }
.primary-nav .menu > li.is-mega.is-resources .promo-card{ background-size: cover, auto 105%; }
*/

@media only screen and (max-width: 600px) {
  .primary-nav .menu > li.is-mega > .sub-menu .promo-card{
    position: relative;
    overflow: hidden;

    /* 2 vrstvy: 1) polopriesvitný gradient NAVRCHU, 2) fotka POD ním */
    background-image:
      linear-gradient(135deg, rgba(65,211,184,.92), rgba(99,224,141,.84)),
      var(--wpr-bg-db6c9ac0-5d46-47e1-9773-bdc71900a322);
    background-repeat: no-repeat, no-repeat;

    /* gradient vyplní kartu, fotka bude „prilepená“ doprava a na výšku karty */
    background-size: cover, auto 115%;
    background-position: center, right 5px bottom;

    /* nech text nelezie do fotky na desktope */
    padding-right: clamp(24px, 12vw, 260px);
  }

}

/* Hover (voliteľné: jemné priblíženie fotky) */
.primary-nav .menu > li.is-mega > .sub-menu .promo-card{
  transition: background-size .25s ease;
}
@media (hover:hover){
  .primary-nav .menu > li.is-mega > .sub-menu .promo-card:hover{
    background-size: cover, auto 120%;
  }
}

/* Mobil – nech je text cez celú šírku a fotka nech nezavadzia */
@media (max-width:1024px){
  .primary-nav .menu > li.is-mega > .sub-menu .promo-card{
    padding-right: 20px;                    /* už nerezervujeme miesto vpravo */
    background-size: cover, auto 80%;
    background-position: center, right -40px bottom;  /* viac doprava, menej výrazná */
  }
}


/* vypneme konfliktné background-y na samotnej karte */
.primary-nav .menu > li.is-mega > .sub-menu .promo-card{
  position: relative;
  overflow: hidden;
  background: none !important;
}

/* fotka – spodná vrstva */
.primary-nav .menu > li.is-mega > .sub-menu .promo-card::after{
  content:"";
  position:absolute; inset:0;
  background: var(--wpr-bg-0be2da25-500d-4238-901e-c3d884f26714)
             right 0px bottom / auto 115% no-repeat;
  z-index:0; pointer-events:none;
  transition: transform .25s ease;
}

/* gradient – nad fotkou, pod obsahom */
.primary-nav .menu > li.is-mega > .sub-menu .promo-card::before{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(90deg, #1ABEA3, #A1FDDA);
  z-index:1; pointer-events:none;
}

/* obsah nad oboma vrstvami */
.primary-nav .menu > li.is-mega > .sub-menu .promo-card > *{
  position:relative; z-index:2;
}

/* rezerva vpravo (desktop) */
.primary-nav .menu > li.is-mega > .sub-menu .promo-card{ padding-right: clamp(24px, 12vw, 260px); }

/* jemné priblíženie fotky pri hoveri (desktop) */
@media (hover:hover){
  .primary-nav .menu > li.is-mega > .sub-menu .promo-card:hover::after{
    transform: scale(1.05);
  }
}

/* mobil: menšia fotka, žiadna rezerva */
@media (max-width:1024px){
  .primary-nav .menu > li.is-mega > .sub-menu .promo-card{ padding-right:20px; }
  .primary-nav .menu > li.is-mega > .sub-menu .promo-card::after{
    background-size: auto 90%;
    background-position: right -5px bottom;
  }
}

/* fotka nad gradientom */
.primary-nav .menu > li.is-mega > .sub-menu .promo-card::after{ z-index: 1; }
.primary-nav .menu > li.is-mega > .sub-menu .promo-card::before{ z-index: 0; }


/* vlož na KONIEC header.css */
.primary-nav .sub-menu .promo-card .btn{
  display: inline-flex;   /* alebo inline-block */
  width: auto;
  align-self: flex-start; /* drž sa ľavého okraja vo flex kolónke */
  padding: 12px 18px;     /* zachovaj padding tlačidla */
  border: 1px solid #023854;
}


/* farby na hover – môžeš doladiť */
:root{
  --mega-accent: #19BDA3;
  --mega-pill-bg-hover: #EEF7F3;
  --mega-pill-border-hover: #CBE8D9;
  --mega-link-bg-hover: #EEF3F7;
}

/* ============= hover na „piluliach“ (ľavý logos stĺpec) ============= */
.primary-nav .menu > li.is-mega > .sub-menu > .container-row
> li.mega-col-logos > .sub-menu > li.has-icon > a{
  transition: background .15s ease, border-color .15s ease, box-shadow .15s ease, transform .12s ease;
}

/* hover + aktívny panel + klávesnicový focus */
@media (hover:hover){
  .primary-nav .menu > li.is-mega > .sub-menu > .container-row
  > li.mega-col-logos > .sub-menu > li.has-icon > a:hover,
  .primary-nav .menu > li.is-mega > .sub-menu > .container-row
  > li.mega-col-logos > .sub-menu > li.has-icon.is-active > a,
  .primary-nav .menu > li.is-mega > .sub-menu > .container-row
  > li.mega-col-logos > .sub-menu > li.has-icon > a:focus-visible{
    background: var(--mega-pill-bg-hover);
    border-color: var(--mega-pill-border-hover);
    box-shadow: 0 4px 12px rgba(0,0,0,.06);
    outline: none;
  }
}

/* tap efekt na mobile (hover tam neplatí) */
@media (max-width:1024px){
  .primary-nav .menu > li.is-mega > .sub-menu > .container-row
  > li.mega-col-logos > .sub-menu > li.has-icon > a:active{
    background: var(--mega-pill-bg-hover);
    border-color: var(--mega-pill-border-hover);
  }
}

/* ============= hover na linkoch v stredných stĺpcoch (všetky megá) ============= */
.primary-nav .menu > li.is-mega > .sub-menu > .container-row
> li.mega-col-links > .sub-menu > li > a{
  position: relative;
  padding: 11px 15px;            /* nech je cieľ pohodlný */
  border-radius: 8px;
  transition: background .12s ease, box-shadow .12s ease;
}

/* hover/focus – jemný „accent“ vľavo + svetlé pozadie */
@media (hover:hover){
  .primary-nav .menu > li.is-mega > .sub-menu > .container-row
  > li.mega-col-links > .sub-menu > li > a:hover,
  .primary-nav .menu > li.is-mega > .sub-menu > .container-row
  > li.mega-col-links > .sub-menu > li > a:focus-visible{
    background: var(--mega-link-bg-hover);

    outline: none;
  }
}

/* tap na mobile */
@media (max-width:1024px){
  .primary-nav .menu > li.is-mega > .sub-menu > .container-row
  > li.mega-col-links > .sub-menu > li > a:active{
    background: var(--mega-link-bg-hover);

  }
}



.view-all-roles{
  text-decoration: underline;
}

/* ===== Modifier: Open Projects ===== */
/* Pridaj triedu na LI položku mega menu:  mega-promo promo-open-projects */
/* <li class="mega-promo promo-open-projects"> ... <div class="promo-card"> ... */

.primary-nav .menu > li.is-mega > .sub-menu > .container-row
> li.mega-promo.promo-open-projects .promo-card{
  color:#fff;                                  /* biely text */
  /* layout, padding, rádiusy a pod. ostávajú z .mega-promo */
}

/* Gradient vrstva NAD fotkou (prepíše default z mega promo) */
.primary-nav .menu > li.is-mega > .sub-menu > .container-row
> li.mega-promo.promo-open-projects .promo-card::before{
  background: linear-gradient(90deg, #023854 50%, rgba(79, 142, 135, 0.5) 100%);
  opacity:.96;
}

/* Fotka pod gradientom – meniteľná cez CSS premennú --promo-img */
.primary-nav .menu > li.is-mega > .sub-menu > .container-row
> li.mega-promo.promo-open-projects .promo-card::after{
  background-image: var(--promo-img, var(--wpr-bg-390c0936-1352-47db-adcc-255380ea6d46));
  background-repeat:no-repeat;
  background-size:auto 100%;
  background-position:right -20px bottom;
  transition: transform .25s ease;
}

/* Tlačidlo na tmavom pozadí */
.primary-nav .menu > li.is-mega > .sub-menu > .container-row
> li.mega-promo.promo-open-projects .promo-card .btn{
  background: rgba(255,255,255,.14);
  color:#fff !important;
  border:1px solid rgba(255,255,255,.4);
}
.primary-nav .menu > li.is-mega > .sub-menu > .container-row
> li.mega-promo.promo-open-projects .promo-card .btn:hover{
  background: rgba(255,255,255,.22);
}

/* Hover: jemné priblíženie fotky (desktop) */
@media (hover:hover){
  .primary-nav .menu > li.is-mega > .sub-menu > .container-row
  > li.mega-promo.promo-open-projects .promo-card:hover::after{
    transform: scale(1.05);
  }
}

/* Mobil: menšia fotka, menší right padding (základ ostáva) */
@media (max-width:1024px){
  .primary-nav .menu > li.is-mega > .sub-menu > .container-row
  > li.mega-promo.promo-open-projects .promo-card::after{
    background-size:auto 90%;
    background-position:right -5px bottom;
  }
}


/* Mega grid: karty nech sa roztiahnu na rovnakú výšku */
.primary-nav .menu > li.is-mega > .sub-menu > .container-row{
  align-items: stretch; /* default, ale explicitne */
}

/* Stĺpec s promom = flex, karta = 100% výška stĺpca */
.primary-nav .menu > li.is-mega > .sub-menu > .container-row > li.mega-promo{
  display: flex; /* už máš, ale nech je istota */
}
.primary-nav .menu > li.is-mega > .sub-menu > .container-row > li.mega-promo .promo-card{
  display: flex;
  flex-direction: column;
  height: 100%;          /* dôležité pre rovnakú výšku */
  min-height: 240px;     /* nechaj, resp. uprav podľa potreby */
}

/* Text vyplní priestor, button pôjde vždy na spodok */
.primary-nav .menu > li.is-mega > .sub-menu .promo-card .promo-text{
  /* voliteľné, pomáha pri dlhších textoch */
  flex: 1 1 auto;
  margin-bottom: 0;
}
.primary-nav .menu > li.is-mega > .sub-menu .promo-card .btn{
  align-self: flex-start; /* ostane vľavo */
  margin-top: auto;       /* >>> tlačidlo zarovná na spodok karty <<< */
}

/* Ak máš viac tlačidiel, obal ich do .promo-actions a použi: */
.primary-nav .menu > li.is-mega > .sub-menu .promo-card .promo-actions{
  margin-top: auto;       /* celý blok akcií na spodok */
  display: flex; gap: 10px; flex-wrap: wrap;
}