*{    
    margin:0;    
    padding:0;    
    box-sizing:border-box;    
}    
    
html{    
    scroll-behavior:smooth;    
    scrollbar-gutter: stable;    
}    
    
body{    
    font-family:"Montserrat", sans-serif;    
    background:#111;    
    color:#fff;    
}    
    
.hero{    
    position:relative;    
    width:100%;    
    background:url("hero.jpg") center center/cover no-repeat;    
    display:flex;    
    justify-content:center;    
    align-items:flex-start;    
    padding:100px 20px 60px;    
    min-height: 100vh;    
}    
    
.hero::before{    
    content:"";    
    position:absolute;    
    inset:0;    
    background:linear-gradient(    
        to right,    
        rgba(0,0,0,.65),    
        rgba(0,0,0,.25),    
        rgba(0,0,0,.45)    
    );    
}    
    
.hero-container{    
    position:relative;    
    z-index:2;    
    width:100%;    
    max-width:1400px;    
    display:flex;    
    justify-content:center;    
    align-items:center;    
}    
    
.hero-content{    
    text-align:center;    
    max-width:900px;    
}    
    
.hero-label{    
    display:inline-block;    
    padding:10px 20px;    
    border:1px solid rgba(255,255,255,.2);    
    border-radius:50px;    
    color:#d6b47b;    
    font-size:13px;    
    letter-spacing:3px;    
    margin-bottom:20px;    
    margin-top: 40px;    
}    
    
.hero h1{    
    font-size:84px;    
    line-height:1;    
    font-weight:800;    
    text-transform:uppercase;    
    margin-bottom:30px;    
}    
    
.hero h1 span{    
    display:block;    
    color:#d6b47b;    
}    
    
.hero p{    
    font-size:22px;    
    line-height:1.7;    
    color:#ddd;    
    max-width:700px;    
    margin:0 auto;    
}    
    
.hero-buttons{    
    display:flex;    
    justify-content:center;    
    gap:20px;    
    margin-top:50px;    
}    
    
.hero-buttons a{    
    width: 45%;    
    text-decoration:none;    
    padding:18px 42px;    
    border-radius:50px;    
    font-size:18px;    
    transition:.3s;    
}    
    
.btn-primary{    
    position:relative;    
    overflow:hidden;    
    
    background:linear-gradient(    
        135deg,    
        #c8a56a,    
        #f0d9a5,    
        #c8a56a    
    );    
    
    background-size:250% 250%;    
    
    color:#111;    
    font-weight:bold;    
    
    animation:goldFlow 8s ease-in-out infinite;    
    
    transition:transform .35s ease;    
}    
    
.btn-primary::before{    
    content:"";    
    
    position:absolute;    
    
    top:-50%;    
    left:-120%;    
    
    width:70%;    
    height:200%;    
    
    background:linear-gradient(    
        90deg,    
        transparent,    
        rgba(255,255,255,.5),    
        transparent    
    );    
    
    transform:rotate(25deg);    
    
    animation:shine 5s ease-in-out infinite;    
}    
    
    
.btn-primary:hover{    
    transform:translateY(-5px) scale(1.03);    
}    
    
@keyframes goldFlow{    
    
    0%{    
        background-position:0% 50%;    
    }    
    
    50%{    
        background-position:100% 50%;    
    }    
    
    100%{    
        background-position:0% 50%;    
    }    
    
}    
    
    
@keyframes shine{    
    
    0%{    
        left:-120%;    
        opacity:0;    
    }    
    
    10%{    
        opacity:1;    
    }    
    
    35%{    
        left:150%;    
        opacity:1;    
    }    
    
    45%{    
        opacity:0;    
    }    
    
    100%{    
        left:150%;    
        opacity:0;    
    }    
    
}    
    
.btn-outline{    
    border:1px solid #fff;    
    color:#fff;    
}    
    
.btn-outline:hover{    
    background:#fff;    
    color:#111;    
}    
    
.hero-info{    
    margin-top:70px;    
    display:flex;    
    justify-content:center;    
    gap:80px;    
}    
    
.hero-info div{    
    text-align:center;    
}    
    
.hero-info strong{    
    display:block;    
    font-size:46px;    
    color:#fff;    
}    
    
.hero-info span{    
    color:#aaa;    
    margin-top:8px;    
    display:block;    
}    
    
.hero-image{    
    display:none;    
}    
    
.material-card{    
    display:none;    
}    
    
.header{    
    position:fixed;    
    top:0;    
    left:0;    
    width:100%;    
    padding:25px 0;    
    z-index:1000;    
    background:rgba(0,0,0,.2);    
    backdrop-filter:blur(12px);    
}    
    
.container{    
    width:90%;    
    max-width:1400px;    
    margin:0 auto;    
    
    display:flex;    
    justify-content:space-between;    
    align-items:center;    
}    
    
.logo{    
    color:#fff;    
    text-decoration:none;    
    font-size:32px;    
    font-weight:800;    
    letter-spacing:2px;    
}    
    
.logo span{    
    color:#c8a56a;    
}    
    
.header-phone{    
    color:#fff;    
    text-decoration:none;    
    font-size:18px;    
    font-weight:600;    
}    
    
.burger{    
    width:32px;    
    height:42px;    
    background:none;    
    border:none;    
    cursor:pointer;    
    
    display:flex;    
    flex-direction:column;    
    justify-content:center;    
    gap:6px;    
}    
    
.burger span{    
    width:100%;    
    height:2px;    
    background:#fff;    
    border-radius:10px;    
}    
    
.header-right{    
    display:flex;    
    align-items:center;    
    gap:15px;    
}    
    
/* =========================    
   PRODUCTION SECTION    
========================= */    
    
.production{    
    background:#111;    
    padding:60px 20px;    
}    
    
    
.production-container{    
    
    max-width:1400px;    
    margin:0 auto;    
    
    display:flex;    
    align-items:center;    
    gap:80px;    
    
}    
    
    
    
.production-content{    
    
    flex:1;    
    
}    
    
    
    
.production-label{    
    
    color:#c8a56a;    
    font-size:13px;    
    letter-spacing:3px;    
    margin-bottom:25px;    
    
}    
    
    
    
.production h2{    
    
    font-size:55px;    
    line-height:1.1;    
    font-weight:900;    
    text-transform:uppercase;    
    margin-bottom:35px;    
    
}    
    
    
    
.production h2 span{    
    
    display:block;    
    
}    
    
    
    
.production p{    
    
    font-size:19px;    
    line-height:1.7;    
    color:#ccc;    
    margin-bottom:20px;    
    max-width:600px;    
    
}    
    
    
    
/* ГАЛЕРЕЯ */    
    
.production-gallery{    
    
    flex:1;    
    
}    
    
    
    
.production-main-image{    
    
    width:100%;    
    height:520px;    
    overflow:hidden;    
    border-radius:20px;    
    margin-bottom:20px;    
    
}    
    
    
    
.production-main-image img{    
    
    width:100%;    
    height:100%;    
    object-fit:cover;    
    transition:.5s;    
    
}    
    
    
    
.production-main-image:hover img{    
    
    transform:scale(1.05);    
    
}    
    
    
    
.production-small-images{    
    
    display:grid;    
    grid-template-columns:1fr 1fr;    
    gap:20px;    
    
}    
    
    
    
.production-small-images img{    
    
    width:100%;    
    height:220px;    
    object-fit:cover;    
    border-radius:20px;    
    
    transition:.4s;    
    
}    
    
    
    
.production-small-images img:hover{    
    
    transform:translateY(-5px);    
    
}    
    
/* =========================    
   PRODUCTS    
========================= */    
    
.products{    
    padding:100px 20px;    
    background:#111;    
}    
    
.products-container{    
    max-width:1400px;    
    margin:0 auto;    
}    
    
.products-header{    
    margin-bottom:50px;    
}    
    
.products-label{    
    color:#c8a56a;    
    letter-spacing:3px;    
    font-size:13px;    
    margin-bottom:20px;    
}    
    
.products h2{    
    font-size:55px;    
    font-weight:900;    
    text-transform:uppercase;    
}    
    
.products-slider{    
    
    display:flex;    
    gap:25px;    
    
    overflow-x:auto;    
    overflow-y:hidden;    
    
    padding-bottom:15px;    
    
    scroll-behavior:smooth;    
    
}    
    
.products-slider::-webkit-scrollbar{    
    height:8px;    
}    
    
.products-slider::-webkit-scrollbar-thumb{    
    background:#555;    
    border-radius:20px;    
}    
    
.product-card{    
    
    flex:0 0 340px;    
    
    height:460px;    
    
    position:relative;    
    
    border-radius:20px;    
    
    overflow:hidden;    
    
    text-decoration:none;    
    
}    
    
.product-card img{    
    
    width:100%;    
    height:100%;    
    
    object-fit:cover;    
    
}    
    
.product-card::before{    
    
    content:"";    
    
    position:absolute;    
    inset:0;    
    
    background:linear-gradient(    
        to top,    
        rgba(0,0,0,.75),    
        transparent 60%    
    );    
    
}    
    
.product-card span{    
    
    position:absolute;    
    
    left:25px;    
    bottom:25px;    
    
    color:#fff;    
    
    font-size:28px;    
    font-weight:800;    
    
    z-index:2;    
    
}    
    
.products-text{    
    
    max-width:700px;    
    
    margin-top:25px;    
    
    color:#cfcfcf;    
    
    font-size:18px;    
    
    line-height:1.8;    
    
}    
    
/* =========================    
   STEPS    
========================= */    
    
.steps{    
    padding:100px 20px;    
    background:#111;    
}    
    
.steps-container{    
    max-width:900px;    
    margin:0 auto;    
}    
    
.steps-label{    
    color:#c8a56a;    
    font-size:13px;    
    letter-spacing:3px;    
    margin-bottom:20px;    
}    
    
.steps h2{    
    font-size:55px;    
    font-weight:900;    
    text-transform:uppercase;    
    margin-bottom:60px;    
}    
    
.steps-list{    
    display:flex;    
    flex-direction:column;    
}    
    
.step{    
    display:flex;    
    align-items:center;    
    gap:35px;    
    position: relative;    
    padding:30px 0;    
    
    border-bottom:1px solid rgba(255,255,255,.08);    
}    
    
.step-number{    
    font-size:64px;    
    font-weight:900;    
    color:#c8a56a;    
    min-width:110px;    
}    
    
.step-title{    
    position: absolute;    
    
    left: 50%;    
    
    transform: translateX(-50%);    
    font-size:32px;    
    font-weight:700;    
    color:#fff;    
}    
    
.step-arrow{    
    position:relative;    
    display:flex;    
    justify-content:center;    
    height:50px;    
    font-size: 40px;    
}    
    
.step-arrow::before{    
    content:"";    
    position:absolute;    
    top:0;    
    bottom:0;    
    background:rgba(255,255,255,.15);    
}    
    
.step-arrow span{    
    position:relative;    
    z-index:1;    
    
    width:60px;    
    height:60px;    
    
    display:flex;    
    align-items:center;    
    justify-content:center;    
    
    background:#111;    
    border:1px solid #c8a56a;    
    border-radius:50%;    
    
    color:#c8a56a;    
    font-size:18px;    
}    
    
/* =========================    
   CONTACTS    
========================= */    
    
.contacts{    
    padding:100px 20px;    
    background:#111;    
}    
    
.contacts-container{    
    max-width:1400px;    
    margin:0 auto;    
}    
    
.contacts-label{    
    color:#c8a56a;    
    font-size:13px;    
    letter-spacing:3px;    
    margin-bottom:20px;    
}    
    
.contacts h2{    
    font-size:55px;    
    font-weight:900;    
    text-transform:uppercase;    
    margin-bottom:25px;    
}    
    
.contacts-text{    
    max-width:650px;    
    font-size:18px;    
    line-height:1.8;    
    color:#ccc;    
    margin-bottom:60px;    
}    
    
.contacts-grid{    
    display:grid;    
    grid-template-columns:repeat(2,1fr);    
    gap:30px;    
    margin-bottom:70px;    
}    
    
.contact-item{    
    background:#181818;    
    border:1px solid rgba(255,255,255,.08);    
    border-radius:20px;    
    padding:30px;    
}    
    
.contact-item span{    
    display:block;    
    font-size:13px;    
    letter-spacing:2px;    
    color:#c8a56a;    
    margin-bottom:15px;    
    text-transform:uppercase;    
}    
    
.contact-item a,    
.contact-item p{    
    color:#fff;    
    text-decoration:none;    
    font-size:24px;    
    font-weight:700;    
    line-height:1.5;    
}    
    
.contact-item a:hover{    
    color:#c8a56a;    
}    
    
.contacts-footer{    
    padding-top:30px;    
    border-top:1px solid rgba(255,255,255,.08);    
    
    display:flex;    
    justify-content:space-between;    
    align-items:center;    
    gap:20px;    
}    
    
.contacts-footer p{    
    color:#888;    
    font-size:15px;    
}    
    
.contacts-footer a{    
    color:#c8a56a;    
    text-decoration:none;    
    font-size:15px;    
}    
    
.contacts-footer a:hover{    
    text-decoration:underline;    
}    
    
/* =========================    
   ADVANTAGES    
========================= */    
    
.advantages{    
    padding:100px 20px;    
    background:#111;    
}    
    
.advantages-container{    
    max-width:1400px;    
    margin:0 auto;    
    
    display:flex;    
    align-items:center;    
    gap:80px;    
}    
    
.advantages-content{    
    flex:1;    
}    
    
.advantages-label{    
    color:#c8a56a;    
    font-size:13px;    
    letter-spacing:3px;    
    margin-bottom:20px;    
}    
    
.advantages h2{    
    font-size:55px;    
    font-weight:900;    
    line-height:1.15;    
    margin-bottom:50px;    
    text-transform:uppercase;    
}    
    
.advantages-list{    
    display:flex;    
    flex-direction:column;    
    gap:30px;    
}    
    
.advantage-item{    
    padding-bottom:25px;    
    border-bottom:1px solid rgba(255,255,255,.08);    
}    
    
.advantage-item h3{    
    font-size:24px;    
    font-weight:800;    
    margin-bottom:12px;    
}    
    
.advantage-item p{    
    color:#cfcfcf;    
    font-size:17px;    
    line-height:1.7;    
}    
    
.advantages-image{    
    flex:1;    
}    
    
.advantages-image img{    
    width:100%;    
    border-radius:24px;    
    display:block;    
    object-fit:cover;    
}    
    
.modal{    
    position:fixed;    
    inset:0;    
    height:100dvh;    
    display:flex;    
    justify-content:center;    
    align-items:center;    
    
    background:rgba(0,0,0,.75);    
    backdrop-filter:blur(8px);    
    pointer-events:none;    
    
    opacity:0;    
    visibility:hidden;    
    
    transition:.35s;    
    
    z-index:9999;    
}    
    
.modal.active{    
    opacity:1;    
    visibility:visible;    
    pointer-events:auto;    
}    
    
.modal-window{    
    width:100%;    
    max-width:520px;    
    
    background:#181818;    
    
    border:1px solid rgba(255,255,255,.08);    
    border-radius:24px;    
    
    padding:45px;    
    
    position:relative;    
    
    transform:translateY(40px) scale(.95);    
    transition:.35s;    
}    
    
.modal.active .modal-window{    
    transform:translateY(0) scale(1);    
}    
    
.modal-close{    
    position:absolute;    
    top:18px;    
    right:20px;    
    
    background:none;    
    border:none;    
    
    color:#fff;    
    font-size:34px;    
    
    cursor:pointer;    
    transition:.3s;    
}    
    
.modal-close:hover{    
    color:#c8a56a;    
}    
    
.modal-window h2{    
    font-size:34px;    
    font-weight:800;    
    margin-bottom:18px;    
}    
    
.modal-window p{    
    color:#cfcfcf;    
    line-height:1.7;    
    margin-bottom:30px;    
}    
    
.modal form{    
    display:flex;    
    flex-direction:column;    
    gap:18px;    
}    
    
  
.btn-primary.sent {  
    background: #777 !important;  
    background-image: none !important;  
    color: #fff !important;  
    cursor: default;  
    pointer-events: none;  
    opacity: 1;  
    animation: none !important;  
    transform: none !important;  
}  
  
.btn-primary.sent::before {  
    display: none !important;  
    animation: none !important;  
    content: none !important;  
}  
  
.modal input{    
    width:100%;    
    
    background:#111;    
    
    border:1px solid rgba(255,255,255,.08);    
    border-radius:14px;    
    
    padding:18px 20px;    
    
    color:#fff;    
    font-size:16px;    
    
    outline:none;    
    transition:.3s;    
}    
    
.modal input:focus{    
    border-color:#c8a56a;    
}    
    
.modal button[type="submit"]{    
    padding:18px;    
    
    border:none;    
    border-radius:50px;    
    
    background:#c8a56a;    
    color:#111;    
    
    font-size:16px;    
    font-weight:700;    
    
    cursor:pointer;    
    transition:.3s;    
}    
    
.modal button[type="submit"]:hover{    
    background:#fff;    
    transform:translateY(-3px);    
}    
    
.modal-policy{    
    margin-top:20px;    
    
    color:#999;    
    font-size:13px;    
    line-height:1.6;    
}    
    
.modal-policy a{    
    color:#c8a56a;    
    text-decoration:none;    
}    
    
.modal-policy a:hover{    
    text-decoration:underline;    
}    
    
#toast{    
    position:fixed;    
    top:30px;    
    right:30px;    
    
    min-width:320px;    
    max-width:420px;    
    
    padding:18px 24px;    
    
    background:#181818;    
    color:#fff;    
    
    border:1px solid rgba(255,255,255,.08);    
    border-left:4px solid #c8a56a;    
    border-radius:16px;    
    
    font-size:15px;    
    line-height:1.6;    
    
    box-shadow:0 20px 60px rgba(0,0,0,.45);    
    
    transform:translateX(450px);    
    opacity:0;    
    
    transition:.35s ease;    
    
    z-index:10000;    
}    
    
#toast.show{    
    transform:translateX(0);    
    opacity:1;    
}    
    
#toast.success{    
    border-left-color:#58c26b;    
}    
    
#toast.error{    
    border-left-color:#d46b6b;    
}    
    
.mobile-menu{    
    position:fixed;    
    
    top:0;    
    right:-100%;    
    
    width:320px;    
    height:100vh;    
    
    background:#111;    
    
    padding:100px 35px 40px;    
    
    display:flex;    
    flex-direction:column;    
    gap:25px;    
    
    z-index:999;    
    
    transition:.4s;    
    
    border-left:1px solid rgba(255,255,255,.08);    
}    
    
    
.mobile-menu.active{    
    right:0;    
}    
    
    
.mobile-menu a{    
    color:#fff;    
    text-decoration:none;    
    
    font-size:20px;    
    font-weight:600;    
    
    transition:.3s;    
}    
    
    
.mobile-menu a:hover{    
    color:#c8a56a;    
}    
    
    
.menu-phone{    
    
    margin-top:auto;    
    
    padding-top:30px;    
    
    border-top:1px solid rgba(255,255,255,.1);    
    
}    
    
    
.menu-phone span{    
    
    display:block;    
    
    color:#c8a56a;    
    
    font-size:12px;    
    
    letter-spacing:2px;    
    
    margin-bottom:12px;    
    
    text-transform:uppercase;    
    
}    
    
    
.menu-phone a{    
    
    font-size:22px;    
    
}    
    
.menu-close{    
    
    position:absolute;    
    
    top:25px;    
    right:25px;    
    
    width:40px;    
    height:40px;    
    
    background:none;    
    border:none;    
    
    color:#fff;    
    
    font-size:40px;    
    line-height:1;    
    
    cursor:pointer;    
    
}    
    
    
.menu-close:hover{    
    
    color:#c8a56a;    
    
}    
    
    
    
@media(max-width:700px){    
    
.hero{    
    background:url("hero-mobile.jpg") center center/cover no-repeat;    
}    
        
.hero{    
    padding:40px 20px;    
}    
    
.hero h1{    
    font-size:42px;    
    font-weight: 900;    
}    
    
.hero p{    
    font-size:16px;    
}    
    
.hero-buttons{    
    flex-direction:column;    
}    
    
.hero-buttons a{    
    width:100%;    
}    
    
.hero-info{    
    flex-direction:column;    
    gap:20px;    
    margin-top: 30px;    
}    
    
.hero-label{    
    font-size:11px;    
    margin-bottom: 20px;    
    margin-top: 70px;    
}    
    
.hero-info strong{    
    font-size:32px;    
}    
    
.logo {    
    font-size: 20px;    
}    
    
.header-phone {    
    font-size: 15px;    
}    
    
.burger {    
    width: 30px;    
    height: 25px;    
}    
    
#production {    
    scroll-margin-top:80px;    
}    
    
.production{    
    
    padding:0px 20px;    
}    
    
    
    
.production-container{    
    
    flex-direction:column;    
    gap:50px;    
    
}    
    
    
    
.production h2{    
    
    font-size:34px;    
    
}    
    
    
    
.production p{    
    
    font-size:16px;    
    
}    
    
    
    
.production-main-image{    
    
    height:350px;    
    
}    
    
    
    
.production-small-images img{    
    
    height:150px;    
    
}    
    
.products{    
    
    padding:80px 20px;    
    
}    
    
.products h2{    
    
    font-size:34px;    
    
}    
    
.product-card{    
    
    flex:0 0 260px;    
    height:360px;    
    
}    
    
    
.products-text{    
    
    font-size:16px;    
    
    line-height:1.7;    
    
}    
    
.product-card span{    
    
    font-size:22px;    
    
}    
    
.steps{    
    padding:50px 20px;    
}    
    
.steps h2{    
    font-size:34px;    
    margin-bottom:40px;    
}    
    
.step{    
    gap:20px;    
    padding:22px 0;    
}    
    
.step-number{    
    font-size:42px;    
    min-width:70px;    
}    
    
.step-title{    
    font-size:22px;    
}    
    
.step-arrow{    
    font-size:24px;    
    padding:10px 0;    
}    
    
.contacts{    
    padding:40px 20px;    
}    
    
.contacts h2{    
    font-size:34px;    
}    
    
.contacts-text{    
    font-size:16px;    
    margin-bottom:40px;    
}    
    
.contacts-grid{    
    grid-template-columns:1fr;    
    gap:20px;    
    margin-bottom:40px;    
}    
    
.contact-item{    
    padding:25px;    
}    
    
.contact-item a,    
.contact-item p{    
    font-size:20px;    
}    
    
.contacts-footer{    
    flex-direction:column;    
    align-items:flex-start;    
}    
    
.contacts-footer p,    
.contacts-footer a{    
    font-size:14px;    
}    
    
.advantages{    
    padding:70px 20px;    
}    
    
.advantages-container{    
    flex-direction:column;    
    gap:50px;    
}    
    
.advantages h2{    
    font-size:27px;    
    margin-bottom:35px;    
}    
    
.advantage-item h3{    
    font-size:20px;    
}    
    
.advantage-item p{    
    font-size:16px;    
}    
    
    .modal{    
        padding:20px;    
    }    
    
    .modal-window{    
        padding:30px 25px;    
    }    
    
    .modal-window h2{    
        font-size:28px;    
    }    
    
    #toast{    
        left:20px;    
        right:20px;    
        top:20px;    
    
        min-width:auto;    
        max-width:none;    
    
        transform:translateY(-100px);    
    }    
    
    #toast.show{    
        transform:translateY(0);    
    }    
    
    #advantages,    
    #steps,    
    #contacts{    
        scroll-margin-top:50px;    
    }    
    
}