@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600&display=swap');

*,
*::before,
*::after {
   box-sizing: border-box;
}

body {
   font-family: "Open-sans", sans-serif;
   margin: 0;
   padding: 0;
   background: #000;
   font-weight: 400;
   font-size: 16px;
   line-height: 26px;
}

a {
   display: inline-block;
   text-decoration: none;
}

.container {
   max-width: 1320px;
   margin: 0 auto;
   padding: 0 12px;
}

.icon {
   display: inline-flex;
   width: 20px;
   height: 20px;
   flex: 0 0 20px;
}

.icon-address {
   background: url(img/icon_address.svg) center no-repeat;
}

.icon-email {
   background: url(img/icon_email.svg) center no-repeat;
}

.icon-phone {
   background: url(img/icon_phone.svg) center no-repeat;
}

.page-title {
   font-weight: 600;
   font-size: 64px;
   line-height: 92px;
   letter-spacing: 0.02em;
   color: #FFFFFF;
   margin-bottom: 48px;
}

.page-description {
   color: #FFFFFF;
}

.wrapper {
   min-height: 100vh;
   display: flex;
   flex-direction: column;
   justify-content: space-between;
   position: relative;
}

.main {
   overflow: hidden;
   flex: 1;
}

.main::before {
   content: "";
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background: rgba(0, 0, 0, 0.6);
   z-index: 5;
}

.main-section {
   z-index: 10;
   position: relative;
}

.header {
   padding: 48px 0;
   position: fixed;
   top: 0;
   z-index: 1000;
   left: 0;
   right: 0;
}

.header-inner {
   display: flex;
   align-items: center;
   justify-content: space-between;
}

.header-info {
   display: flex;
   align-items: center;
   gap: 48px;
}

.header-address {
   display: inline-flex;
   align-items: center;
   color: #FFFFFF;
   gap: 19px;
}

.header-phone {
   display: inline-flex;
   align-items: center;
   color: #FFFFFF;
   gap: 19px;
}

.header-email {
   display: inline-flex;
   align-items: center;
   color: #FFFFFF;
   gap: 19px;
}

.main-content {
   max-width: 866px;
   margin: 0 auto;
   padding: 0 12px;
   text-align: center;
   padding-top: 35vh;
}

#myVideo {
   position: fixed;
   right: 0;
   bottom: 0;
   left: 0;
   top: 0;
   height: 100%;
   z-index: 1;
   transform: scale(1.4);
 }
 
 .button-volume {
    display: inline-flex;
    width: 22px;
    height: 22px;
    flex: 0 0 22px;
    background-image: url(img/volume_on.svg);
    background-repeat: no-repeat;
    background-color: transparent;
    padding: 0;
    border: none;
    cursor: pointer;
 }

 @media (max-width: 767px) {
   .header-inner { flex-direction: column; }
 }

 @media (max-width: 576px) {
   .page-title { font-size: 48px; line-height: 58px; }
   .header-info { flex-direction: column; gap: 24px; margin-top: 16px; }
 }