:root{
  --blue:#0066cc;
  --blue2:#004c99;
  --navy:#003366;

  --green:#1e7c31;
  --green2:#186a29;

  --shadow: 0 10px 30px rgba(0,0,0,0.08);
  --shadow2: 0 14px 40px rgba(0,0,0,0.12);

  --container: 1120px;
  --burgerW: min(420px, calc(100vw - 24px));

  /* FIXED HEADER: výška hlavičky pro odsazení obsahu */
  --headerH: 120px;
}

.container{
  width: min(var(--container), calc(100% - 40px));
  margin: 0 auto;
}

/* =========================================
   FIXED HEADER (viditelný pořád)
   ========================================= */
.site-header{
  background: var(--blue);
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9999;
  box-shadow: 0 2px 8px rgba(0,0,0,0.10);
}

/* odsazení stránky pod fixed header */
body{
  padding-top: var(--headerH);
}

/* =========================================================
   HEADER LAYOUT
   - CSS GRID: logo vlevo, CTA uprostřed, nav vpravo
   - bez změny menu.html (btn-mail je pořád uvnitř .header-left)
   ========================================================= */
.header-row{
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  padding: 12px 0;
  min-height: var(--headerH);
}

/* Udělá z potomků .header-left "přímé" položky gridu */
.header-left{
  display: contents;
}

/* LOGO = sloupec 1 */
.header-left .logo{
  grid-column: 1;
  display:flex;
  align-items:center;
  text-decoration:none;
  justify-self: start;
}

.header-left .logo img{
  height: 100px;
  width:auto;
  object-fit:contain;
  display:block;
}

/* BTN = sloupec 2 (pravý střed mezi logem a nav) */
.header-left .btn-mail{
  grid-column: 2;
  justify-self: center;
}

/* NAV = sloupec 3 */
.info-nav{
  grid-column: 3;
  justify-self: end;

  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
}

/* Green mail button – původní vzhled, jen centrování řeší grid */
a.btn-mail,
.btn-mail{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  gap:8px;

  background: var(--green) !important;
  color:#fff !important;

  font-weight:700;
  text-decoration:none !important;

  padding: 8px 10px;
  border-radius: 12px;

  border: 1px solid rgba(255,255,255,.16) !important;
  box-shadow: 0 8px 18px rgba(0,0,0,.18);

  transition: transform .15s ease, background .2s ease, box-shadow .2s ease;
  white-space: nowrap;

  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}

a.btn-mail:hover,
.btn-mail:hover{
  background: var(--green2) !important;
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(0,0,0,.22);
}

a.btn-mail:active,
.btn-mail:active{
  transform: translateY(0);
  box-shadow: 0 6px 14px rgba(0,0,0,.18);
}

a.btn-mail:focus-visible,
.btn-mail:focus-visible{
  outline: 3px solid rgba(255,255,255,.70);
  outline-offset: 3px;
}

.btn-mail-ico{
  display:inline-flex;
  width: 18px;
  height: 18px;
  align-items:center;
  justify-content:center;
  font-size: 14px;
  line-height: 1;
  flex: 0 0 auto;
}

.btn-mail-text{
  font-size: 14px;
  letter-spacing: .2px;
  line-height: 1;
}

/* desktop nav links */
.info-nav a{
  color: rgba(255,255,255,.92);
  text-decoration:none;
  font-weight:700;
  font-size:14px;
  padding: 8px 10px;
  border-radius: 10px;
  transition: background .2s ease, color .2s ease;
}

.info-nav a:hover{
  background: rgba(255,255,255,.12);
  color:#fff;
}

.nav-sep{
  width:1px;
  height:18px;
  background: rgba(255,255,255,.25);
  margin: 0 2px;
}

/* ACTIVE state (desktop + burger) */
.info-nav a.is-active,
.burger-panel a.is-active{
  background: rgba(255,255,255,.22);
  color:#fff;
  outline: 1px solid rgba(255,255,255,.28);
}

/* burger */
.burger{ display:none; position:relative; }

.burger-toggle{
  font-size: 16px;
  background: rgba(255,255,255,.14);
  color:#fff;
  border: 1px solid rgba(255,255,255,.20);
  padding: 10px 14px;
  border-radius: 12px;
  cursor:pointer;
  font-weight:800;
  line-height: 1;
}

.burger-toggle:hover{ background: rgba(255,255,255,.20); }

/* burger panel */
.burger-panel{
  position: fixed;
  right: 12px;
  top: calc(var(--headerH) - 6px);
  width: var(--burgerW);
  max-height: min(70vh, 540px);
  overflow:auto;

  background:#fff;
  padding: 12px;
  border-radius: 16px;
  box-shadow: var(--shadow2);
  border: 1px solid rgba(15,23,42,.10);

  opacity:0;
  transform: translateY(-6px);
  pointer-events:none;
  transition: opacity .16s ease, transform .16s ease;
  z-index: 10000;
}

.burger-panel a{
  display:block;
  text-decoration:none;
  font-weight:900;
  color: var(--blue2);
  padding: 12px 12px;
  border-radius: 12px;
  background: rgba(0,102,204,.06);
  margin-bottom: 10px;
}

.burger-panel a:hover{ background: rgba(0,102,204,.12); }
.burger-panel a:last-child{ margin-bottom:0; }

.burger-panel.is-open{
  opacity:1;
  transform: translateY(0);
  pointer-events:auto;
}

.burger-cta{
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid rgba(15,23,42,.10);
}

a.btn-mail--full,
.btn-mail--full{
  width: 100% !important;
  justify-content:center !important;
}

/* RESPONSIVE */
@media (max-width: 1024px){
  /* na mobilu nechceme grid se středovým CTA, jen burger */
  .header-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
  }

  .info-nav{ display:none !important; }
  .burger{ display:block !important; }

  /* logo+btn zpět jako levý blok, btn schovat (CTA je v burgeru) */
  .header-left{ display:flex; align-items:center; gap:14px; }
  .btn-mail{ display:none !important; }
}

@media (max-width: 520px){
  :root{ --headerH: 110px; }
  .logo img{ height: 85px; }
}

/* LEGAL links v burgeru */
.burger-legal{
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid rgba(15,23,42,.10);
}

.burger-legal a{
  background: transparent;
  margin-bottom: 6px;
  padding: 10px 10px;
  font-weight: 800;
  font-size: 13px;
  color: rgba(0,76,153,1);
}

.burger-legal a:hover{
  background: rgba(0,102,204,.08);
}

.burger-legal a.is-active{
  background: rgba(0,102,204,.10);
  outline: 1px solid rgba(0,102,204,.18);
  color: rgba(0,76,153,1);
}