/* ====== HEADER (LaDekor) ====== */
.header_section {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: var(--color-white);
  border-bottom: 1px solid rgba(7, 44, 53, 0.06);
  box-shadow: 0 4px 16px rgba(7, 44, 53, 0.06);
  padding: 10px 0;
}

/* logo */
.logo-img {
  height: 70px;
  width: auto;
  border: 1px solid #0002;
  /* box-shadow: 0 4px 16px rgba(7,44,53,0.08); */
  border-radius: 50%;
  padding: 5px;
}

/* desktop nav */
.nav-desktop .nav-primary {
  display: flex;
  gap: 22px;
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 1.1em;
}

.nav-desktop .nav-link {
  font-weight: 600;
  color: var(--color-primary);
  padding: 10px 4px;
  position: relative;
  transition: color 0.2s ease;
}

.nav-desktop .nav-link:hover,
.nav-desktop .nav-link:focus {
  color: var(--color-secondary);
}

.nav-desktop .nav-link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0;
  height: 2px;
  background: var(--color-secondary);
  transition: width 0.25s ease;
}
.nav-desktop .nav-link:hover::after {
  width: 100%;
}

/* CTA dugme + social */
.btn-ld {
  background: var(--color-secondary);
  color: var(--color-white);
  border-radius: 10px;
  padding: 10px 16px;
  font-weight: 700;
  /* box-shadow: 0 8px 18px rgba(252,133,60,.22); */
  transition: transform 0.15s ease, box-shadow 0.2s ease, background 0.2s ease;
}
.btn-ld:hover {
  background: var(--color-primary);
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(11, 96, 110, 0.25);
}

.social-icons .si {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 8px;
  background: rgba(111, 196, 184, 0.18);
  color: var(--color-primary);
  margin-right: 8px;
  transition: background 0.2s ease, color 0.2s ease, transform 0.15s ease;
}
.social-icons .si:hover {
  background: var(--color-primary);
  color: var(--color-secondary);
  transform: translateY(-1px);
}

/* mobile traka */
.nav-mobile .logo-img {
  height: 80px;
}
.mobile-quick {
  display: inline-flex;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: rgba(111, 196, 184, 0.2);
  color: var(--color-primary);
  align-items: center;
  justify-content: center;
}
.mobile-quick:hover {
  background: var(--color-light-teal);
  color: #fff;
}

/* overlay meni (tvoj postojeći #myNav) – samo stilizacija bojama */
.overlay {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 1100;
  left: 0;
  top: 0;
  background: rgba(7, 44, 53, 0.96);
  overflow-x: hidden;
  transition: 0.3s ease;
}
.overlay .closebtn {
  position: absolute;
  top: 12px;
  right: 22px;
  font-size: 42px;
  color: #fff;
}
.overlay-content {
  position: relative;
  top: 20%;
  width: 100%;
  text-align: center;
}
.overlay-content a {
  padding: 10px;
  display: block;
  font-size: 28px;
  color: #fff;
  font-weight: 700;
  transition: color 0.2s ease, transform 0.15s ease;
}
.overlay-content a:hover {
  color: var(--color-yellow);
  transform: translateY(-1px);
}

/* util */
.nav-actions {
  gap: 8px;
}