.intro_mobile {color:#fff; padding:160px 20px 0 20px}
.intro_mobile h3 {font-size:2em; font-weight:600; max-width:250px; line-height:1.5em; text-shadow:4px 4px 8px rgb(0 0 0 / 80%)}
.intro_mobile p {margin-top:50px; margin-bottom:30px; font-size:1.1em; max-width:300px; line-height:1.6em; background-color:#fcfcfcdb; padding:10px 15px; border-radius:20px; font-weight:650; color:#202020}
.navig {width:100%; text-align:center; margin-top:-70px}
.navig a {color:#000; text-decoration:none; font-weight:300; font-size:0.9em}
.block_one {margin-top:45px; padding:0 30px; max-width:100%}
.block_one h3 {color:#393636; font-weight:400; line-height:1.3em}
.block_one p {font-weight:300; line-height:1.6em; margin-top:20px; color:#737373}
.intro {max-width:350px; margin-left:50px}
.btnbig {background:#40cfec; background:linear-gradient(326deg,#0078aa 0,#83d4ed 100%); color:#fff; font-weight:650; padding:13px 35px; border:none; border-radius:30px; margin-top:20px; min-width:200px}
.spad {padding-top:80px; padding-left:20px; padding-right:20px; padding-bottom:40px}
.sale {border:2px solid#E96A4F; border-radius:30px; padding:30px; max-width:700px; margin:0 auto}
.sale_name {background-color:#E96A4F; color:#fff; margin:0 auto; text-align:center; max-width:200px; border-radius:30px; font-size:1.4em; font-weight:600; margin-top:-45px; margin-bottom:20px}
.promo-item {display:flex; align-items:center; gap:10px}
.promo-item img {max-width:50px; height:auto}
.promo-text h3 {margin:0; font-size:20px}
.promo-text p {margin:0; font-size:0.9em; color:#555}
.katalog {max-width:740px; margin:0 auto}
.title {border-left:4px solid#40B9EC; padding-left:10px; margin:20px}
.title p {font-size:0.8em; color:#706e6e}
.banka {border-radius:30px; margin:120px 20px 20px 20px; text-align:center; padding-bottom:40px}
.bpik {width:60%; margin:0 auto}
.bpik img {margin-top:-80px}
.banka h3 {font-weight:600; margin-top:10px}
.banka p {padding:0; margin:0; font-size:0.9em}
.line {background-color:#86D0EF; width:80px; height:2px; margin:0 auto; margin-bottom:15px}
.sal {background-color:#E96A4F; width:150px; color:#fff; margin:0 auto; margin-top:10px; border-radius:30px; padding:5px 0; font-weight:500}
.btnbig2 {background-color:#40B9EC; color:#fff; font-weight:600; padding:10px 30px; border:none; border-radius:30px; min-width:200px}
.kupiti {text-align:center; margin-top:-45px}
.fake {border-radius:20px; padding:10px 0; text-align:center; font-size:0.7em; max-width:700px; margin:0 auto; margin-top:70px; margin-bottom:70px; font-weight:600; margin-left:-15px; margin-right:-15px; padding:20px; background:#f8f8f8}
.dostavka {background:#48BBEC; background:linear-gradient(0deg,rgba(72,187,236,1) 0,rgba(255,255,255,1) 100%); text-align:center; padding:40px}
.dostavka h2 {font-size:1.4em}
.dostavka h3 {width:100%; background-color:#40B9EC; color:#fff; font-size:1em; padding:10px 0; margin-top:20px; border-radius:20px}
.dostavka img {width:80px; margin-top:40px}
.usloviea {max-width:600px; margin:0 auto}
.usloviea p {color:#0d658a; margin-top:20px; font-size:0.9em; font-weight:400}
.block_one2 {margin-top:100px; padding:50px 30px 30px 30px; max-width:100%; background-color:#00bcee}
.block_one2 h3 {color:#fff; font-weight:400; line-height:1.5em}
.block_one2 p {font-weight:300; line-height:1.6em; margin-top:20px; color:#fff}
.intro2 {margin-top:10px; max-width:350px; margin-left:50px}
.btnbig3 {background-color:#fff; color:#40B9EC; font-weight:600; padding:10px 30px; border:none; border-radius:30px; margin-top:20px; min-width:200px}
.wave_bottom {text-align:center; background-image:url('./img/wave.webp'); background-size:cover; height:100px}
.order {padding:60px 20px}
.or_title {text-align:center; margin:0 0; font-size:1.5em; font-weight:600}
.order_text {margin:30px 0; font-size:0.9em; font-weight:300; padding-top:30px}
.ordered {margin-top:30px; padding:0 30px}
.form-control {margin-top:30px; height:50px; border-radius:20px}
.btnbig4 {background-color:#40B9EC; color:#fff; font-weight:600; padding:10px 30px; border:none; border-radius:30px; min-width:100%; height:50px; margin-top:30px}
.slider_block {text-align:center}
.slider_block h2 {margin:40px 0; font-size:1.4em}
.slider {position:relative; width:100%; margin:auto; overflow:hidden; padding:20px}
.slider-track {display:flex; transition:transform 0.5s ease}
.slider-track img {max-width:280px; flex-shrink:0; pointer-events:none; user-select:none; margin:0 10px; border-radius:30px}
.footer {background-color:#0e61b1; text-align:center; color:#fff; font-weight:300; font-size:0.9em; padding-top:10px; padding-bottom:40px}
.footer a {color:#8dd0eb; margin:0 0}
.product-offer {padding:20px; text-align:center; font-family:"Inter",sans-serif; margin-top:-5px}
.product-offer .weight {font-size:18px; margin-bottom:10px; font-weight:600}
.product-offer .weight span {font-weight:600; color:#222}
.product-offer .price {margin:10px 0 16px}
.product-offer .old-price {font-size:22px; font-weight:600; color:#3a3939; text-decoration:line-through; margin-right:8px}
.product-offer .new-price {font-size:31px; font-weight:700; color:#0081c5; padding:4px 8px; border-radius:8px; text-align:center; display:inline-block; margin:0 auto}
.product-offer .limited {font-size:9px; font-weight:600; padding:8px 0; border-radius:10px; text-transform:uppercase; letter-spacing:0.5px}
@media (min-width:270px) and (max-width:450px) {.wave {position:absolute; width:100%}
 .logo {margin-top:10px}
 .spad {margin-top:0; padding-left:20px; padding-right:20px; padding-bottom:40px}
 .sale {background-color:#fff}
 .intro {margin-top:0; max-width:350px; margin-left:0; text-align:center}
 .intro2 {margin-top:0; max-width:350px; margin-left:0; text-align:center}
 .mob {margin-top:50px}
 .promo-text p {margin:0; font-size:0.7em; color:#555}
 .fake {margin:0 20px}
 .ordered {margin-top:30px; padding:0 10px; text-align:center}
 .order_text {margin:30px 0; font-size:0.9em; font-weight:300; padding-top:0}
}
 .block_one {align-items:center; justify-content:center; background-size:cover; position:relative; color:#fff; background-size:120% auto; background-position:center bottom}
 .block_one::before {content:""; position:absolute; top:0; left:0; width:100%; height:100%; background-size:120% auto; opacity:0.3; z-index:-1}
 .block_one .row {position:relative; z-index:2; width:100%; margin:0}
 .intro {text-align:center}
 @media (min-width:768px) {.intro {text-align:left}
 }
 .intro-img {max-width:100%}
 @media (max-width:576px) {.intro-img {max-width:70%; margin:0 auto; display:block}
 }
 .product-info {list-style:none; padding-left:0; margin:10px 0; color:#020202; font-size:0.9em; word-wrap:break-word; overflow-wrap:break-word; word-break:break-word}
 .product-info li {margin-bottom:8px; line-height:1.6; padding-left:28px; font-family:sans-serif; position:relative; text-align:left}
 .product-info li::before {content:"✔️"; position:absolute; left:0; top:0.2em}
 .bpik {position:relative; display:inline-block}
 .discount-badge {position:absolute; top:-7px; right:-35px; background:linear-gradient(45deg,#ff0000,#ff6600,#ff0000,#ff0000); background-size:300% 300%; color:#fff; font-weight:bold; font-size:16px; width:60px; height:60px; line-height:60px; border-radius:50%; box-shadow:0 2px 8px rgba(0,0,0,0.6); z-index:10; animation:gradientShift 3s ease infinite; text-align:center}
 .discount-badge2 {position:absolute; top:-67px; right:190px; background:linear-gradient(45deg,#ff0000,#ff6600,#ff0000,#ff0000); background-size:300% 300%; color:#fff; font-weight:bold; font-size:16px; width:90px; height:35px; display:flex; align-items:center; justify-content:center; box-shadow:0 2px 8px rgba(0,0,0,0.6); z-index:10; animation:gradientShift 3s ease infinite; text-align:center; border-radius:6px}
.discount-badge3 {position:absolute; background:linear-gradient(45deg,#00bcee,#0081c5,#0081c5,#00bcee); background-size:300% 300%; color:#fff; display:flex; align-items:center; justify-content:center; box-shadow:0 2px 8px rgba(0,0,0,0.6); z-index:10; animation:gradientShift 3s ease infinite; text-align:center}
 .discount-badge4 {position:absolute; top:-66px; right:-70px; background:linear-gradient(45deg,#ff0000,#ff6600,#ff0000,#ff0000); background-size:300% 300%; color:#fff; font-weight:bold; font-size:11px; width:90px; height:35px; display:flex; align-items:center; justify-content:center; box-shadow:0 2px 8px rgba(0,0,0,0.6); z-index:10; animation:gradientShift 3s ease infinite; text-align:center; border-radius:6px}
.dot-anim {display:inline-block; background:linear-gradient(90deg,#40b9ec,#00b4ff,#40b9ec); -webkit-background-clip:text; -webkit-text-fill-color:transparent; animation:shimmer 3s linear infinite}
@keyframes shimmer {0% {background-position:0 50%}
 50% {background-position:100% 50%}
 100% {background-position:0 50%}
}
 @keyframes gradientShift {0% {background-position:0 50%}
 50% {background-position:100% 50%}
 100% {background-position:0 50%}
 }
 .sale_name {background:linear-gradient(45deg,#ff0000,#ff6600,#ff0000,#ff0000); background-size:300% 300%; color:#fff; font-weight:bold; font-size:16px; padding:6px 12px; border-radius:8px; box-shadow:0 2px 8px rgba(0,0,0,0.6); animation:gradientShift 3s ease infinite; text-align:center}
 @keyframes gradientShift {0% {background-position:0 50%}
 50% {background-position:100% 50%}
 100% {background-position:0 50%}
 }
 .footer_top {text-align:center; background-image:url(./img/footer_top2.webp); background-size:cover; height:210px; background-repeat:repeat-x; animation:waveMove 100s linear infinite}
 @keyframes waveMove {0% {background-position-x:0}
 100% {background-position-x:1000px}
 }
 .img-fluid2 {max-width:70%; height:auto}
 .img-fluid3 {max-width:30%; height:auto}
 .footer {position:relative; overflow:hidden}
 .footer .bubble {position:absolute; bottom:0; width:10px; height:10px; background:rgba(255,255,255,0.8); border-radius:50%; animation:rise 1s linear infinite}
 @keyframes rise {0% {transform:translateY(0) scale(1); opacity:0.8}
 50% {transform:translateY(-90px) scale(1.2); opacity:0.6}
 100% {transform:translateY(-150px) scale(0.8); opacity:0}
 }
 .product-offer {display:block; font-size:0.9rem; color:#000000; margin-bottom:12px; font-family:'Montserrat'}
 .product-offer strong {color:#0098d8}
 .logo {display:inline-block; padding:2px; border-radius:50%}
 .intro3 {font-weight:600; text-align:center}
 .price_block {margin:20px auto; width:100%; max-width:380px; position:relative}
 .price_item {display:inline-block; text-align:center; margin:0 10px}
 .price_item.old {color:#888}
 .price_item .text {font-size:14px; margin-bottom:5px; color:#555}
 .price_item .value {font-size:24px; font-weight:bold; line-height:1.2}
 .price_item.old .value {text-decoration:line-through}
 .price_item.new .value {color:#40b9ec; font-size:28px}
 .order_form {margin:18px 0}
 .order_form .field {display:block; width:100%; max-width:380px; margin:0 auto 15px; padding:12px 20px; border:1px solid #c9c9c9; border-radius:5px; font-size:16px; color:#000; outline:none; transition:border-color 0.3s; border-radius:30px}
 .order_form .field:focus {border-color:#40B9EC}
 .order_form .button {display:block; width:80%; max-width:300px; margin:20px auto; padding:15px; background-color:#40B9EC; color:white; border:none; border-radius:5px; font-size:18px; font-weight:bold; cursor:pointer; transition:background-color 0.3s; border-radius:30px}
 .order_form .button:hover {background-color:#0098d8}
 .deadline_text {text-align:center; color:#ff0000; font-weight:bold; margin-top:10px; font-size:14px}
 @media (max-width:576px) {.price_item {display:block; margin:10px auto}
 .price_item .value {font-size:20px}
 .price_item.new .value {font-size:24px}
 .order_form .field,.order_form .button {max-width:100%}
 }
.price-container {position:relative; width:400px; height:50px; left:-12px}
.price-label {position:absolute; top:14px; left:25px; font-size:18px; font-weight:800}
.new-price {position:absolute; top:0; left:87px; font-size:31px; font-weight:bold; color:#000; font-family:'Montserrat'}
.old-price-block {position:absolute; top:12px; left:235px; font-size:14px; color:#888; text-decoration:line-through}
 .thin {font-weight:900; font-size:25px; color:#000000}
.bold {font-weight:300}
 .product-offer2 {padding:20px; text-align:center; font-family:"Inter",sans-serif; border-top:1px solid #00000014; border-bottom:1px solid #00000014}
.title {margin-top:50px}
 html,body {overflow-x:hidden}
 .img-overlay {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.9); justify-content:center; align-items:center; z-index:9999}
 .img-overlay img {max-width:90%; max-height:90%; border-radius:20px}
 .img-overlay .close-btn {position:absolute; top:20px; right:40px; font-size:40px; color:#fff; cursor:pointer}
.intro_mobile h1 {color:#fff; text-shadow:1px 1px 3px rgba(0,0,0,0.3); font-weight:700}
.intro_mobile h2 {color:#333; font-size:1rem; font-weight:400}
.intro_mobile .btn-order {background:linear-gradient(135deg,#3ABEFF,#005C99); color:#fff; font-weight:bold; padding:12px 24px; border-radius:8px; border:none; cursor:pointer; transition:transform 0.2s,box-shadow 0.2s}
.intro_mobile .btn-order:hover {transform:translateY(-2px); box-shadow:0 4px 8px rgba(0,0,0,0.2)}
.order {position:relative; overflow:hidden; z-index:1}
.order::before {content:""; position:absolute; top:130px; left:120%; width:400px; height:200px; background:url("/img/lojkaikri.webp") no-repeat top right; background-size:contain; opacity:0; transform:translateX(0); transition:transform 1s ease,opacity 1s ease; z-index:-1}
.order.show-spoon::before {opacity:1; transform:translateX(-370px)}
@media (min-width:1024px) {.order.show-spoon::before {transform:translateX(-600px)}
}
 .slider_block {max-width:1200px; margin:0 auto}
 .slider_block h2 {text-align:center; margin-bottom:10px}
 .slider_block .line {width:60px; height:4px; background:#333; margin:0 auto 20px auto}
 .slider .slick-slide {padding:0 10px}
 .slider img {max-height:300px; object-fit:contain; margin:0 auto; border-radius:20px; display:block}
 .slider2 .slick-slide {padding:0 10px}
 .slider2 img {max-height:300px; object-fit:contain; margin:0 auto; border-radius:20px; display:block}
.promo-block {display:grid; gap:20px; margin:20px 0; padding:6px}
.promo-item {border:2px solid #4dabf7; border-radius:16px; padding:20px; text-align:center; box-shadow:0 4px 12px rgba(0,0,0,0.08); transition:all 0.3s ease; padding:20px}
.promo-item:hover {transform:translateY(-4px); box-shadow:0 8px 20px rgba(0,0,0,0.12)}
.promo-title {font-size:22px; font-weight:700; color:#000; margin-bottom:8px}
.promo-title .highlight {display:inline-block; border-radius:8px; color:#40b9ec}
.promo-desc {font-size:16px; color:#444; line-height:1.5; text-align:left}
.katalog {max-width:740px; margin:0 auto; margin-top:40px}
.center {display:flex; flex-direction:column; justify-content:center; align-items:center; gap:10px}
.intro_mobile {background:rgba(0,0,0,0.10); color:#fff; height:100vh}
.logo-c img {display:block; margin:0 auto; height:auto}
.logo-animated {position:absolute; top:50px; left:50%; transform:translate(-50%,-50%); pointer-events:none}
.logo-animated img {display:block; height:auto; animation:spin 10s linear infinite}
@keyframes spin {from {transform:rotate(0deg)}
 to {transform:rotate(360deg)}
}
 .custom-offcanvas {width:70% !important; max-width:320px}
 html {scroll-behavior:smooth}
#catalog {scroll-margin-top:72px}
 .offcanvas {transition:transform 0.3s ease-in-out}
 html {scroll-behavior:smooth}
 .offcanvas-body .nav-link {padding:12px 15px; margin:5px 0; border-radius:5px; transition:all 0.2s ease; font-weight:700}
 .offcanvas-body .nav-link:hover {background-color:rgba(0,0,0,0.05)}
 .btn-outline-dark {transition:all 0.3s ease}
 .btn-outline-dark:hover {transform:scale(1.05)}
 #catalog,#promo,#delivery,#reviews,#contacts {scroll-margin-top:80px}
 @media (max-width:768px) {#catalog,#promo,#delivery,#reviews,#contacts {scroll-margin-top:60px}
 }
 .section-animate {opacity:0; transform:translateY(30px); transition:all 0.6s ease-out}
 .section-visible {opacity:1; transform:translateY(0)}
 .btn-outline-dark {background:transparent !important; border:none !important; outline:none !important; box-shadow:none !important; padding:8px}
.btn-outline-dark .bi-list {color:white !important; font-size:49px !important; font-weight:bold !important; text-shadow:0 0 4px rgba(0,0,0,0.8)}
.btn-outline-dark:hover .bi-list {color:#f8f9fa !important}
.btn-outline-dark:focus,.btn-outline-dark:active {box-shadow:none !important; outline:none !important; background:transparent !important}
.fixed-menu-btn {position:fixed; top:15px; right:15px; z-index:2147483647; background:rgba(0,0,0,0.6); border:2px solid white; border-radius:8px; width:50px; height:50px; display:flex; align-items:center; justify-content:center; backdrop-filter:blur(4px); transition:all 0.3s ease}
.fixed-menu-btn.scrolled {background:rgba(255,255,255,0.9); border:2px solid #000}
.fixed-menu-btn .menu-icon,.fixed-menu-btn .menu-close-icon {color:white; font-size:28px; font-weight:bold; filter:drop-shadow(0 0 3px rgba(0,0,0,0.7)); transition:all 0.3s ease; position:absolute}
.fixed-menu-btn.scrolled .menu-icon,.fixed-menu-btn.scrolled .menu-close-icon {color:#000; filter:none}
.fixed-menu-btn:hover {transform:scale(1.1)}
.fixed-menu-btn.scrolled:hover {background:rgba(255,255,255,1)}
.fixed-menu-btn.menu-open {background:rgb(0 0 0 / 28%) !important; border-color:#fff !important}
.fixed-menu-btn.menu-open .menu-icon,.fixed-menu-btn.menu-open .menu-close-icon {color:#fff !important}
.delivery-info {text-align:left; margin-left:5px}
.slider .slick-dots,.slider2 .slick-dots {position:relative; bottom:-15px; text-align:center}
.slider .slick-dots li button:before,.slider2 .slick-dots li button:before {opacity:0.75}
.slider .slick-dots li.slick-active button:before,.slider2 .slick-dots li.slick-active button:before {opacity:1}
 @media (min-width:992px) {.footer_top {height:400px}
}
.menu-inside-btn {position:fixed; left:auto; right:calc(50% - 520px + 15px); z-index:1050}
 .fake {text-align:left}
.visually-hidden {position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0}
.slick-next:before {content:'›' !important}
