.header {
  background-color: var(--white);
  filter: drop-shadow(0px 1px 10px rgba(255, 193, 0, 0.4));
  position: fixed;
  opacity: 0.98;
}
.header .header-inner {
  transition: 0.2s;
  transition-property: height, padding-top, padding-bottom;
  height: var(--header-height);
  box-sizing: border-box;
  gap: 10px;
  --padding-v: 0px;
  padding-top: var(--padding-v);
  padding-bottom: var(--padding-v);
}
.header .header-inner .logo {
  aspect-ratio: 179/60;
  height: min(100%, min(17vw, 50px));
  background-image: url("/logo.jpg"); 
}
.header .header-inner .burger {
  aspect-ratio: 44/35;
  height: min(100%, 30px);
  cursor: pointer;
  filter: drop-shadow(-2px 2px 0px rgba(0, 0, 0, 0.1));
  transition: 0.2s height;
}
.header .header-inner .burger .burger-line {
  background-color: var(--yellow);
  height: 4px;
  width: 100%;
  border-radius: 100px;
}

.header-fixer {
  height: var(--header-height);
}

body.scrolled .header-inner {
  --padding-v: 8px;
  height: var(--header-height-small);
}
body.scrolled .header-inner .burger {
  height: min(100%, 28px);
}



@media only screen and (max-width: 1020px) {

.header .header-inner .logo {
  height: min(100%, min(17vw, 42px));
}


:root {
    --header-height: 60px;
}

.header .header-inner .burger {
    height: min(100%, 25px);
}