body.light,
body.light section {
  background-color: #ffffff;
}
/* body.light .header,
body.light .hero {
  background-color: #be9875;
} */

body.light,
body.light button,
body.light a,
body.light .switch-btn,
body.light .hero-title,
body.light .hero-text,
body.light .section-title,
body.light .how-much,
body.light #email::placeholder,
body.light #tel::placeholder,
body.light #textarea::placeholder {
  color: #000000;
}
body.light .header .container {
  background-image: url("../assets/img/light-theme/hero-light-bg.jpg");
  background-repeat: no-repeat;
  background-position: center 0;
}

body.light .current-language {
  color: #ffffff;
}
body.light .current-language:hover {
  color: #ffffff;
}

body.light .hero .container {
  background-image: url("../assets/img/light-theme/hero-light-bg.jpg");
  background-position: center -90px;
  background-repeat: no-repeat;
  background-size: cover;
}

body.light .section-title::before,
body.light .section-title::after {
  border-bottom: 1px solid #000000;
}

body.light a:hover,
body.light .switch-btn:hover {
  color: #ffffff;
}

body.light .logo {
  filter: invert(100%) sepia(97%) saturate(12%) hue-rotate(231deg)
    brightness(103%) contrast(104%);
}
body.light .logo:hover {
  filter: invert(46%) sepia(19%) saturate(512%) hue-rotate(7deg) brightness(89%)
    contrast(88%);
}
body.light .theme-btn {
  background-image: url("../assets/svg/moon-header.svg");
  background-size: cover;
}
body.light .theme-btn:hover {
  filter: invert(46%) sepia(19%) saturate(512%) hue-rotate(7deg) brightness(89%)
    contrast(88%);
}
body.light .burger-line {
  background-color: #000000;
}
body.light .gold-btn {
  background-color: #ffffff;
}
body.light .gold-btn:hover {
  background-color: #000000;
  color: #bdae82;
}
body.light .transparent-btn {
  background-color: #bdae82;
}

body.light .active-btn {
  background-color: #000000;
  color: #bdae82;
}
body.light .price-item {
  border: 2px solid #bdae82;
}
body.light .price .button {
  background-color: #bdae82;
}
body.light .price .button:hover,
body.light .portfolio .button:hover {
  background-color: #000000;
  color: #bdae82;
}

body.light .contacts .container {
  background: url("../assets/img/light-theme/contacts-light-bg.jpg");
  background-size: cover;
  background-position: center center;
}

body.light .footer {
  background-color: #ffffff;
}

body.light .instagram {
  background: url("../assets/svg/social/1instagram.svg");
  filter: invert(100%) sepia(0%) saturate(2%) hue-rotate(191deg)
    brightness(110%) contrast(101%);
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  transition: 0.3s;
}
body.light .facebook {
  background: url("../assets/svg/social/2facebook.svg");
  filter: invert(100%) sepia(0%) saturate(2%) hue-rotate(191deg)
    brightness(110%) contrast(101%);
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  transition: 0.3s;
}
body.light .twitter {
  background: url("../assets/svg/social/3twitter.svg");
  filter: invert(100%) sepia(0%) saturate(2%) hue-rotate(191deg)
    brightness(110%) contrast(101%);
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  transition: 0.3s;
}
body.light .pinterest {
  background: url("../assets/svg/social/4pinterest.svg");
  filter: invert(100%) sepia(0%) saturate(2%) hue-rotate(191deg)
    brightness(110%) contrast(101%);
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  transition: 0.3s;
}
body.light .instagram:hover,
body.light .facebook:hover,
body.light .twitter:hover,
body.light .pinterest:hover {
  filter: invert(40%) sepia(25%) saturate(638%) hue-rotate(7deg) brightness(92%)
    contrast(87%);
}

body.light .footer a:hover {
  color: #bdae82;
}

@media (max-width: 768px) {
  body.light .header .container {
    background-image: url("../assets/img/light-theme/hero-light-tablet-bg.jpg");
  }
  body.light .hero .container {
    background-image: url("../assets/img/light-theme/hero-light-tablet-bg.jpg");
    background-position: center -90px;
    background-repeat: no-repeat;
    background-size: auto;
  }
  body.light .header-nav.open {
    background-color: rgba(255, 255, 255, 0.8);
    color: #000000;
  }
}
