@font-face{font-display:swap;
    font-family:Roadstore;
    font-style:auto;
    font-weight:auto;
    src:url(/wp-content/themes/wp-webpack-br2/assets/fonts/Roadstore.woff2) format("woff2")
}
html{
    margin:0!important
}
body{
    background:#0d0d0d;
    color:#939393;
    font-family:WorkSans,sans-serif;
    font-size:1.4vw;
    font-style:normal;
    font-weight:400;
    line-height:normal;
    margin:0
}
header{
    align-items:center;
    background:#1a1b20;
    border-bottom:1px solid #27292e;
    column-gap:8px;
    display:flex;
    flex-direction:row;
    height:68px;
    justify-content:space-between;
    max-width:-webkit-fill-available;
    padding:0!important;
    row-gap:12px;
    width:100%
}
a:active{
    color:#850101
}
a{
    color:#fff;
    text-decoration:none
}
.offer p{
    color:#929292;
    font-family:WorkSans,sans-serif;
    font-size:12px;
    font-weight:500;
    letter-spacing:-.02em;
    line-height:1.4;
    margin:4px;
    overflow:hidden
}
footer{
    background:#16171b;
    border-radius:24px 24px 0 0;
    color:#929292
}
.main-menu{
    display:flex;
    flex-direction:row;
    gap:1em;
    justify-content:space-between;
    list-style:none;
    margin:0;
    padding:0
}
.offer .img{
    border:1px solid #1b1d22;
    border-radius:8px;
    padding:4px
}
.offer .img img{
    border-radius:5px;
    -webkit-border-radius:5px;
    -moz-border-radius:5px;
    -ms-border-radius:5px;
    -o-border-radius:5px;
    width:100%
}
td{
    border:1px solid #00694e
}
h1{
    font-size:2vw
}
h1,h2{
    color:#fff;
    line-height:1.5em;
    margin:0
}
h2{
    font-size:1.8vw;
    text-align:left;
    text-shadow:0 .75px .75px #80ffdf
}
h3{
    font-size:1.7vw
}
h3,h4{
    color:#fff;
    line-height:1.5em;
    text-align:left
}
h4{
    font-size:1.6vw
}
.blog p,.offers-block h3{
    text-align:center
}
.main .title{
    display:flex
}
.info_block .img{
    display:flex;
    justify-content:center
}
.header-container{
    align-items:center;
    display:flex;
    gap:1em;
    justify-content:space-between;
    margin:0 4vw;
    padding-block:4px;
    width:100%
}
.main-navigation{
    align-items:center;
    display:flex;
    gap:8px
}
.navigation_post a{
    color:#fff;
    font-size:20px
}
.main-navigation ul{
    display:flex;
    list-style:none;
    margin:0;
    padding:0
}
.error404 .container{
    align-items:center;
    display:flex;
    flex-direction:column;
    height:calc(100vh - 89px);
    justify-content:center;
    margin:auto
}
section.offers-block{
    border-radius:2em;
    margin:4em auto;
    max-width:1330px;
    padding:0 2vh
}
.single section.main{
    margin:0 5vw 5vh
}
.main-navigation li{
    margin:0 10px;
    width:max-content
}
.main-navigation a{
    color:#fff;
    font-size:21px;
    text-decoration:none
}
.banner .button a{
    color:#e6e5e6;
    font-family:"BreeSerif",sans-serif;
    font-size:clamp(14px,3vw,25px);
    font-weight:400;
    text-shadow:0 2px 0 rgba(0,0,0,.25),0 4px 5px rgba(0,0,0,.55);
    text-transform:uppercase
}
.but-version-lang{
    margin-right:3em
}
.lang-dropdown li{
    list-style:none
}
ul.lang-dropdown{
    background:#1a1c21;
    border-radius:5px;
    padding:1px 5px;
    position:absolute;
    z-index:1
}
.lang-dropdown li{
    margin:0
}
.current-lang{
    padding:1px
}
.banner .button{
    align-items:center;
    background-image:-webkit-linear-gradient(270deg,#7ed54f 33%,#005407 83%);
    border-color:#c7f8b9 #7cc672 #49a441;
    border-style:solid;
    border-width:1px;
    box-shadow:0 2px 0 #000;
    display:flex;
    justify-content:center;
    min-height:58px;
    min-width:220px;
    padding:.1em .6em;
    position:relative;
    width:fit-content
}
.burger-menu{
    background:none;
    border:none;
    cursor:pointer;
    display:none;
    flex-direction:column;
    height:fit-content;
    justify-content:space-around;
    width:fit-content
}
.payment-systems{
    align-items:center;
    color:#c39f82;
    display:flex;
    flex-wrap:wrap;
    gap:2em
}
.payments-more span{
    color:#ca6d00;
    font-size:14px;
    font-weight:500;
    line-height:1.4
}
.payments-more{
    width:78px!important
}
.home .burger-menu div{
    background-color:hsla(0,0%,100%,.96)
}
.burger-menu div{
    background-color:#fff;
    height:3px;
    width:25px
}
.mobile-menu{
    display:none
}
footer a{
    color:#dddddf
}
.mobile-menu ul{
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:0
}
.mobile-menu li{
    font-size:27px;
    font-weight:700;
    margin:10px 0;
    text-align:center
}
.no-bullets{
    list-style:none
}
.accordion-content.active{
    max-height:max-content!important
}
.accordion-content{
    max-height:0;
    overflow:hidden;
    transition:max-height .3s linear;
    -webkit-transition:max-height .3s linear;
    -moz-transition:max-height .3s linear;
    -ms-transition:max-height .3s linear;
    -o-transition:max-height .3s linear
}
.faq .accordion-content li,.faq .accordion-content li::marker,.faq .accordion-content span{
    color:#939393;
    font-size:1em
}
.accordion-item{
    margin:.5em 0
}
.blog .container#post-container{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    grid-column-gap:2em;
    grid-row-gap:2em
}
.post-item h3{
    margin:0
}
.post-navigation{
    border-radius:1em;
    display:flex;
    gap:1em;
    justify-content:space-between
}
.blurred-background .description a{
    background:#521616;
    border:1px solid rgba(85,40,40,.671);
    border-radius:.6em;
    box-shadow:0 0 9px rgba(47,5,5,.522);
    font-size:36px;
    font-weight:600;
    padding:.3em 1em
}
.left.one{
    display:flex;
    flex-direction:column
}
.show{
    display:block
}
img{
    height:auto;
    max-width:100%;
    vertical-align:middle
}
.offer button{
    background:none;
    border:none;
    cursor:pointer;
    margin:0;
    padding:0
}
.rang img{
    max-width:35px
}
.faq .container_flex{
    margin-top:2em
}
.offers-block .offers{
    display:grid;
    gap:20px;
    grid-template-columns:repeat(5,minmax(0,1fr));
    justify-content:space-between;
    width:100%
}
table tr:first-child td{
    background:rgba(152,255,218,.212)
}
footer .main{
    align-items:center;
    display:flex;
    flex-direction:column;
    gap:1em;
    margin:0 15vw;
    padding:2em 0;
    text-align:center
}
footer .ct-container{
    align-items:center;
    display:flex;
    justify-content:center
}
.site-logo{
    max-width:103px
}
a.blog-read-more{
    background-color:#521616;
    border-radius:1em;
    box-shadow:0 0 9px rgba(47,5,5,.522);
    color:#fff;
    cursor:pointer;
    padding:1.5vh 3.5vw
}
.banner-container{
    display:block;
    overflow:hidden;
    padding:6vw 9vw;
    position:relative
}
.banner .mini-text-banner{
    color:#e6e5e6;
    font-family:Flathead-Round,sans-serif;
    font-size:16px;
    font-weight:500;
    line-height:19.2px;
    text-transform:uppercase
}
.banner .info-block{
    align-items:center;
    display:flex;
    flex-direction:column;
    gap:.6em;
    max-width:17em;
    padding:30px;
    text-align:center
}
.banner .main-text-banner p{
    background:linear-gradient(180deg,#ffead2 45%,#eda82f 64%);
    -webkit-background-clip:text;
    display:inline;
    text-transform:uppercase;
    -webkit-text-fill-color:transparent;
    background-clip:text;
    font-family:Roadstore,sans-serif;
    font-size:50px;
    font-weight:500;
    letter-spacing:.03em;
    line-height:normal
}
section.banner{
    background-position:0 0;
    background-repeat:no-repeat;
    background-size:cover
}
svg.svg-burger{
    fill:#ffab49;
    font-size:50px;
    height:1em;
    line-height:1;
    text-align:center
}
button.authorization{
    background:linear-gradient(180deg,hsla(0,0%,100%,.12) 48%,hsla(0,0%,100%,0) 0),linear-gradient(180deg,#ffc786,#c79258 35%,#723c0a 80%) padding-box,linear-gradient(180deg,#ffead2,#a36022) border-box;
    border:1px solid transparent;
    border-radius:6px;
    box-shadow:0 1px 0 0 #000;
    color:#e6e5e6;
    cursor:pointer;
    font-family:"BreeSerif",sans-serif;
    font-size:14px;
    font-weight:600;
    line-height:1.2;
    min-height:36px;
    min-width:36px;
    padding:0 14px;
    text-transform:uppercase
}
.home .blurred-background .left{
    display:flex;
    flex-direction:column;
    gap:1em
}
section.main{
    align-items:center;
    display:flex;
    margin:1em 0
}
.error404 .container .error-404{
    align-items:center;
    display:flex;
    flex-direction:column;
    gap:1em;
    margin:auto;
    max-width:max-content;
    padding:1.2em 2em;
    text-align:center;
    width:100%
}
.error-404 h3{
    margin:0;
    text-align:center
}
.error404 .container .error-404 p{
    color:#1f1f1f;
    font-size:13em;
    font-weight:800;
    line-height:100%;
    margin:0
}
.error404 .container .error-404 h2{
    color:#b1b1b1;
    font-size:1.5em;
    font-weight:900;
    line-height:48px;
    text-align:center
}
.anchor-nav{
    border:1px solid #1b1d22;
    border-radius:8px;
    float:right;
    margin:1em 0 1em .5em;
    max-width:25%;
    min-width:min-content;
    padding:4px;
    position:relative;
    width:fit-content
}
.anchor-content{
    background:#1a1b20;
    border-radius:8px;
    padding:1rem
}
.acf-block{
    display:flex;
    flex-direction:column;
    width:auto
}
.anchor-nav ul ul{
    padding-left:1rem
}
ul.anchor-nav__sublist li{
    margin:.5rem
}
.anchor-nav ul{
    list-style:none;
    margin:0;
    max-height:60vh;
    overflow-x:hidden;
    overflow-y:auto;
    padding-left:0;
    scrollbar-color:#939393 #1a1b20;
    scrollbar-width:thin
}
.anchor-nav li{
    border-top:1px solid;
    margin:0 0 1rem;
    padding:1rem .2em 0
}
.anchor-nav a{
    color:#939393;
    text-decoration:none;
    transition:all .5s ease;
    -webkit-transition:all .5s ease;
    -moz-transition:all .5s ease;
    -ms-transition:all .5s ease;
    -o-transition:all .5s ease
}
a:not([class]){
    text-decoration-skip-ink:auto
}
.anchor-nav__title{
    color:#939393;
    font-weight:700;
    margin-bottom:.5rem
}
.anchor-nav__item{
    margin-left:1rem
}
.anchor-nav__item--h2{
    margin-left:0
}
.anchor-nav__item--h2 a{
    font-size:.7em
}
.anchor-nav__item--h3 a{
    font-size:.6em
}
.blog section.blog{
    margin:0 5vw
}
section.post.post-blok{
    backdrop-filter:blur(9px);
    background:rgba(169,59,59,.18);
    border-radius:1em;
    -webkit-border-radius:1em;
    -moz-border-radius:1em;
    -ms-border-radius:1em;
    -o-border-radius:1em;
    box-shadow:0 0 9px rgba(47,5,5,.522);
    margin:0 5vw;
    padding:1em
}
.payment-systems img{
    max-width:108px
}
.home section.info{
    margin:1em 0
}
section.navigation_post{
    background:rgba(169,59,59,.18);
    border-radius:1em;
    box-shadow:0 0 9px rgba(47,5,5,.522);
    margin:3em 5vw 0;
    padding:1em
}
.blog h2{
    color:#fff
}
.home .mobile-menu li a{
    color:#fafafb!important
}
.faq button.accordion-header{
    background-color:#16171b;
    border:1px solid #2d313b;
    border-radius:6px;
    color:#e0fff7;
    cursor:pointer;
    font-family:Oswald,sans-serif;
    font-size:1em;
    font-weight:500;
    line-height:1.4;
    min-height:48px;
    text-align:left
}
wrapper .content-wrapper{
    margin:auto;
    max-width:1330px;
    padding:0 2vh;
    position:relative
}
.home section.blog{
    margin:0 5vw
}
section.faq .accordion{
    display:flex;
    flex-direction:column
}
section.faq{
    margin:2em 0
}
.site-logo span{
    color:#fff
}
body section{
    display:block
}
.single h2{
    margin-top:1em
}
.post-excerpt{
    border-bottom:1px solid #511;
    border-top:1px solid #511;
    margin:18px 0
}
.blog button{
    margin-top:4em
}
footer p span{
    display:grid;
    font-size:12px;
    justify-items:center;
    line-height:1;
    grid-gap:5px
}
blockquote{
    margin:0
}
.post-item{
    align-items:center;
    background:rgba(82,22,22,.349);
    border:1px solid #521616;
    border-radius:2em;
    box-shadow:0 0 9px rgba(47,5,5,.522);
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:1em;
    text-align:center
}
table{
    border-collapse:collapse;
    width:fit-content!important
}
.home .blurred-background{
    align-items:center;
    display:flex;
    height:100%;
    justify-content:center;
    width:auto
}
.blog .blurred-background{
    margin:2em 0 1em
}
.single-post .blurred-background{
    margin:8em 0 1em
}
.blog header{
    position:relative
}
@keyframes scroll{
    0%{
        transform:translateX(0)
    }
    to{
        transform:translateX(650px)
    }
}
@media(min-width:560px){
    td{
        padding:0 1em
    }
}
@media(max-width:1750px){
    .banner .info-block{
        max-width:24em
    }
}
@media(max-width:1670px){
    .current-lang{
        padding:1px 4px
    }
}
@media(max-width:1300px){
    .blog .container#post-container{
        grid-column-gap:2em;
        grid-row-gap:3em
    }
}
@media(max-width:1140px){
    body{
        font-size:18px;
        line-height:24px
    }
    h4{
        font-size:20px
    }
    h3{
        font-size:22px
    }
    h2{
        font-size:24px
    }
    h1{
        font-size:30px
    }
}
@media(max-width:1130px){
    .blog .container#post-container{
        grid-template-columns:repeat(2,minmax(0,1fr));
        grid-column-gap:2em;
        grid-row-gap:2em
    }
}
@media(max-width:1110px){
    .offers-block .offers{
        grid-template-columns:repeat(5,minmax(0,1fr))
    }
}
@media(max-width:1024px){
    .custom-image.image1:before{
        left:-7em;
        max-width:29em;
        top:14em
    }
    .banner-container{
        padding:6vw 1vw
    }
    .banner .main-text-banner{
        font-size:45px
    }
    .banner .info-block{
        max-width:38em
    }
    .custom-image.image2:before{
        right:-6em;
        width:31em
    }
}
@media(max-width:997px){
    .info.info-section-9 .info_block.info-block-9-3,.info.info-section-9 .info_block.info-block-9-4,.info.info-section-9 .info_block.info-block-9-5{
        min-width:fit-content
    }
}
@media(max-width:995px){
    .site-logo span{
        font-size:20px
    }
}
@media(max-width:986px){
    .blog .container#post-container{
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
        grid-column-gap:2em;
        grid-row-gap:2em
    }
}
@media(max-width:864px){
    .offers-block .offers{
        grid-template-columns:repeat(4,minmax(0,1fr))
    }
}
@media(max-width:850px){
    .blurred-background .description a{
        font-size:30px
    }
    .site-logo span{
        font-size:18px
    }
}
@media(max-width:787px){
    .banner .main-text-banner{
        font-size:38px
    }
    .banner .mini-text-banner{
        font-size:21px
    }
    .banner .button{
        min-height:68px
    }
    .banner .info-block{
        gap:17px;
        max-width:615px
    }
    .error404 .container .error-404 p{
        font-size:10em
    }
}
@media(max-width:768px){
    .banner .button{
        min-height:63px
    }
    .home .blurred-background:after{
        height:36vh;
        max-width:33vw;
        right:12%;
        top:11em
    }
    .header-container{
        align-items:center;
        justify-content:space-between
    }
    .mobile-menu svg{
        fill:#00d09b;
        height:1em;
        width:1em
    }
    .active-block,.mobile-menu.active{
        align-items:center;
        background:rgba(0,0,0,.8);
        display:flex;
        justify-content:center;
        position:absolute
    }
    .mobile-menu.active{
        flex-direction:column;
        height:100%;
        right:0;
        top:0;
        width:100%;
        z-index:5
    }
    .custom-image.image1:before{
        left:-6em;
        max-width:22em;
        top:16em
    }
    .custom-image.image2:before{
        right:-9em;
        width:30em
    }
}
@media(max-width:680px){
    body{
        font-size:16px
    }
    h4{
        font-size:18px
    }
    h3{
        font-size:20px
    }
    h2{
        font-size:22px
    }
    h1{
        font-size:28px
    }
    .anchor-nav{
        float:none;
        margin-left:0;
        max-width:100%;
        position:relative;
        top:0;
        width:auto
    }
    .acf-block{
        flex-direction:column;
        max-width:100%
    }
    .anchor-nav ul{
        max-height:35vh
    }
    .anchor-nav li{
        margin:.5rem 0
    }
}
@media(max-width:673px){
    .banner .main-text-banner{
        font-size:32px
    }
    .banner .mini-text-banner{
        font-size:16px
    }
    .banner .info-block{
        max-width:516px
    }
    .banner .button{
        min-height:55px
    }
}
@media(max-width:640px){
    .blog .container#post-container{
        display:grid;
        grid-template-columns:repeat(1,minmax(0,1fr));
        grid-gap:1em
    }
    .current-lang{
        padding:1px 9px
    }
    .banner .main-text-banner p{
        font-size:40px
    }
    footer .main{
        margin:0 10vw
    }
    .faq button.accordion-header{
        font-size:16px
    }
    header .burger-menu{
        display:block
    }
    header .main-menu{
        display:none
    }
    header{
        height:auto
    }
    .header-container{
        flex-direction:column
    }
    header .main-menu.active{
        background-color:#1a1b20;
        box-shadow:0 8px 7px 0 rgba(0,0,0,.33);
        display:flex;
        flex-direction:column;
        left:0;
        overflow-y:scroll;
        padding:15px 4vw;
        position:absolute;
        top:20%;
        width:100%;
        z-index:998
    }
}
@media(max-width:580px){
    .navigation_post a{
        font-size:16px
    }
    .banner .button:after,.banner .button:before{
        height:35px;
        top:12px;
        width:35px
    }
    .banner .button:before{
        left:-18px
    }
    .banner .button:after{
        right:-18px
    }
    a.blog-read-more{
        font-size:16px;
        padding:1vh 3.5vw
    }
    .site-logo span{
        font-size:16px
    }
    .blog .container#post-container{
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
        grid-gap:1em
    }
}
@media(max-width:576px){
    .banner .main-text-banner{
        font-size:28px
    }
    .banner .info-block{
        max-width:100%;
        padding:21px
    }
}
@media(max-width:540px){
    wrapper .main span{
        line-height:1.5em
    }
}
@media(max-width:512px){
    .banner .main-text-banner{
        font-size:24px
    }
}
@media(max-width:500px){
    .offers-block .offers{
        grid-template-columns:repeat(3,minmax(0,1fr))
    }
}
@media(max-width:480px){
    .blurred-background .description a{
        font-size:26px
    }
    .faq button.accordion-header{
        font-size:14px
    }
    .banner .button{
        min-height:42px;
        min-width:158px
    }
    .banner .button:after,.banner .button:before{
        height:25px;
        top:2px;
        width:25px
    }
    .banner .button:before{
        left:-14px
    }
    .banner .button:after{
        right:-14px
    }
    body{
        font-size:14px;
        line-height:22px
    }
    h4{
        font-size:16px
    }
    h3{
        font-size:18px
    }
    h2{
        font-size:20px
    }
    h1{
        font-size:26px
    }
    .accordion-content.active{
        max-width:100%
    }
    .navigation_post a,.site-logo span{
        font-size:14px
    }
    footer p{
        font-size:14px!important
    }
}
@media(max-width:468px){
    .blog .container#post-container{
        display:grid;
        grid-template-columns:repeat(1,minmax(0,1fr));
        grid-gap:1em
    }
    .offers-block .offers{
        grid-template-columns:repeat(2,minmax(0,1fr))
    }
    .banner .main-text-banner p{
        font-size:31px
    }
}
@media(max-width:448px){
    .banner .main-text-banner{
        font-size:21px
    }
}
@media(max-width:420px){
    button.authorization{
        padding:0 3px
    }
    .but-version-lang{
        margin-right:0
    }
}
@media(max-width:400px){
    .banner .main-text-banner{
        font-size:18px
    }
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
}

.error-404-wrapper {
    min-height: 80vh;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(135deg, #1a1a1a 0%, #2d1810 30%, #1a0e08 70%, #0d0d0d 100%);
    border: 2px solid #333;
    border-radius: 15px;
    overflow: hidden;
    margin: 40px 0;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
}

.cowboy-scene {
    text-align: center;
    position: relative;
    z-index: 2;
    padding: 40px 20px;
}

.desert-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    opacity: 0.3;
}

.sun {
    position: absolute;
    top: 20px;
    right: 30px;
    font-size: 3rem;
    filter: drop-shadow(0 0 10px rgba(255, 215, 0, 0.5));
    animation: sunGlow 4s ease-in-out infinite alternate;
}

.cactus {
    position: absolute;
    bottom: 20px;
    left: 30px;
    font-size: 4rem;
    opacity: 0.4;
    filter: drop-shadow(0 0 5px rgba(34, 139, 34, 0.3));
}

.tumbleweed {
    position: absolute;
    bottom: 30px;
    right: 20px;
    font-size: 2rem;
    opacity: 0.4;
    animation: roll 12s linear infinite;
}

.error-content {
    position: relative;
    z-index: 2;
    max-width: 500px;
    margin: 0 auto;
    color: #fff;
}

.cowboy-hat {
    font-size: 4rem;
    margin-bottom: 20px;
    filter: drop-shadow(0 0 10px rgba(255, 215, 0, 0.3));
    animation: hatTip 6s ease-in-out infinite;
}

.error-number {
    font-size: 8rem;
    font-weight: 900;
    color: #DAA520;
    text-shadow: 
        0 0 10px rgba(218, 165, 32, 0.5),
        4px 4px 8px rgba(0,0,0,0.7);
    margin: 20px 0;
    font-family: 'Georgia', serif;
    animation: numberGlow 3s ease-in-out infinite alternate;
}

.error-content h2 {
    font-size: 2.5rem;
    color: #fff;
    margin: 20px 0;
    font-family: 'Georgia', serif;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.8);
}

.error-content p {
    font-size: 1.2rem;
    color: #ccc;
    margin: 20px 0;
    font-family: 'Georgia', serif;
    opacity: 0.9;
}

.but-all.yellow-but {
    background: linear-gradient(145deg, #DAA520, #B8860B);
    border: 2px solid #8B4513;
    color: #fff;
    padding: 15px 35px;
    font-size: 1.1rem;
    font-weight: bold;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    margin-top: 20px;
    font-family: 'Georgia', serif;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.5);
    box-shadow: 
        0 4px 0 #654321,
        0 8px 15px rgba(0,0,0,0.4);
    position: relative;
    overflow: hidden;
}

.but-all.yellow-but::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
    transition: left 0.5s;
}

.but-all.yellow-but:hover {
    background: linear-gradient(145deg, #FFD700, #DAA520);
    transform: translateY(-2px);
    box-shadow: 
        0 6px 0 #654321,
        0 12px 20px rgba(0,0,0,0.5);
}

.but-all.yellow-but:hover::before {
    left: 100%;
}

.but-all.yellow-but:active {
    transform: translateY(2px);
    box-shadow: 
        0 2px 0 #654321,
        0 4px 10px rgba(0,0,0,0.4);
}

/* Анимации */
@keyframes sunGlow {
    0% { 
        filter: drop-shadow(0 0 10px rgba(255, 215, 0, 0.3));
        transform: scale(1);
    }
    100% { 
        filter: drop-shadow(0 0 20px rgba(255, 215, 0, 0.6));
        transform: scale(1.05);
    }
}

@keyframes hatTip {
    0%, 90%, 100% { transform: rotate(0deg); }
    95% { transform: rotate(15deg); }
}

@keyframes numberGlow {
    0% { 
        color: #DAA520;
        text-shadow: 
            0 0 10px rgba(218, 165, 32, 0.5),
            4px 4px 8px rgba(0,0,0,0.7);
    }
    100% { 
        color: #FFD700;
        text-shadow: 
            0 0 20px rgba(255, 215, 0, 0.8),
            4px 4px 8px rgba(0,0,0,0.7);
    }
}

@keyframes roll {
    0% { 
        transform: translateX(0) rotate(0deg);
        opacity: 0.4;
    }
    50% {
        opacity: 0.6;
    }
    100% { 
        transform: translateX(-120px) rotate(-360deg);
        opacity: 0.2;
    }
}

/* Адаптивность */
@media (max-width: 768px) {
    .error-number {
        font-size: 6rem;
    }
    
    .error-content h2 {
        font-size: 2rem;
    }
    
    .cowboy-hat {
        font-size: 3rem;
    }
    
    .sun, .cactus {
        font-size: 2.5rem;
    }
    
    .error-404-wrapper {
        min-height: 70vh;
        margin: 20px 0;
    }
}

@media (max-width: 480px) {
    .error-404-wrapper {
        margin: 10px 0;
        padding: 20px 10px;
    }
    
    .error-number {
        font-size: 4rem;
    }
    
    .error-content h2 {
        font-size: 1.5rem;
    }
    
    .error-content p {
        font-size: 1rem;
    }
    
    .but-all.yellow-but {
        padding: 12px 25px;
        font-size: 1rem;
    }
    
    .cowboy-scene {
        padding: 30px 15px;
    }
}

/* Дополнительные темные акценты */
.error-404-wrapper::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: radial-gradient(circle at 30% 20%, rgba(218, 165, 32, 0.1) 0%, transparent 50%);
    pointer-events: none;
    z-index: 1;
}