/* =========================================
   Glowzie BANGLADESH
   PREMIUM RESPONSIVE CSS
   FINAL COMPLETE VERSION
========================================= */

/* =========================================
   GOOGLE FONT
========================================= */

@import url('https://fonts.googleapis.com/css2?family=Hind+Siliguri:wght@400;500;600;700;800;900&display=swap');

/* =========================================
   ROOT VARIABLES
========================================= */

:root{

--primary:#ec4899;
--primary-dark:#db2777;

--green:#12c97b;
--green-dark:#0ea765;

--bg:#f5f7fb;
--white:#ffffff;

--text:#1e293b;
--muted:#6b7280;

--border:#e9edf5;

--shadow-sm:
0 5px 15px rgba(0,0,0,.05);

--shadow:
0 12px 35px rgba(0,0,0,.08);

--shadow-lg:
0 25px 60px rgba(0,0,0,.12);

--gradient:
linear-gradient(
135deg,
#ff5b2e,
#ff8744
);

--gradient-green:
linear-gradient(
135deg,
#12c97b,
#0ea765
);

--radius:28px;

}

/* =========================================
   RESET
========================================= */

*{
margin:0;
padding:0;
box-sizing:border-box;
}

html{
scroll-behavior:smooth;
overflow-x:hidden;
}

body{

font-family:'Hind Siliguri',sans-serif;

background:var(--bg);

color:var(--text);

overflow-x:hidden;

padding-bottom:110px;

-webkit-font-smoothing:antialiased;

}

/* =========================================
   LOADED EFFECT
========================================= */

body.loaded{
animation:fadeBody .5s ease;
}

@keyframes fadeBody{

from{
opacity:0;
transform:translateY(10px);
}

to{
opacity:1;
transform:translateY(0);
}

}

/* =========================================
   SELECTION
========================================= */

::selection{

background:var(--primary);
color:#fff;

}

/* =========================================
   GENERAL
========================================= */

img{

max-width:100%;
display:block;

user-select:none;

-webkit-user-drag:none;

}

a{
text-decoration:none;
}

button{

border:none;
outline:none;

cursor:pointer;

font-family:inherit;

background:none;

}

button,
a{

-webkit-tap-highlight-color:transparent;

}

ul{
list-style:none;
}

/* =========================================
   FOCUS STATE
========================================= */

button:focus,
a:focus,
input:focus{

outline:none;

box-shadow:
0 0 0 4px rgba(255,91,46,.18);

}

/* =========================================
   CONTAINER
========================================= */

.container{

width:100%;
max-width:1380px;

margin:auto;

padding-left:20px;
padding-right:20px;

}

/* =========================================
   SCROLLBAR
========================================= */

::-webkit-scrollbar{
width:8px;
}

::-webkit-scrollbar-thumb{

background:var(--gradient);
border-radius:50px;

}

::-webkit-scrollbar-track{
background:#edf1f7;
}

/* =========================================
   CURSOR GLOW
========================================= */

.cursor-glow{

position:fixed;

width:300px;
height:300px;

border-radius:50%;

background:
radial-gradient(
circle,
rgba(255,91,46,.15),
transparent 70%
);

pointer-events:none;

transform:
translate(-50%,-50%);

z-index:1;

mix-blend-mode:multiply;

}

/* =========================================
   TOPBAR
========================================= */

.topbar{

background:var(--gradient);

padding:12px 0;

overflow:hidden;

white-space:nowrap;

box-shadow:
0 5px 20px rgba(255,91,46,.18);

}

.topbar-scroll{

display:flex;

gap:60px;

width:max-content;

animation:
scrollTopbar 20s linear infinite;

}

.topbar-item{

font-size:14px;

font-weight:700;

color:#fff;

display:flex;

align-items:center;

gap:8px;

}

@keyframes scrollTopbar{

0%{
transform:translateX(0);
}

100%{
transform:translateX(-50%);
}

}

/* =========================================
   HEADER
========================================= */

.header{

position:sticky;

top:0;

z-index:9999;

background:
rgba(255,255,255,.92);

backdrop-filter:blur(14px);

-webkit-backdrop-filter:blur(14px);

border-bottom:
1px solid var(--border);

}

.header-wrapper{

display:flex;

justify-content:space-between;

align-items:center;

padding:16px 0;

gap:20px;

}

.logo-wrap{

display:flex;
align-items:center;

}

.logo-img{

width:170px;
height:auto;

object-fit:contain;

}

/* =========================================
   MENU
========================================= */

.desktop-menu{

display:flex;

align-items:center;

gap:35px;

}

.desktop-menu a{

font-size:15px;

font-weight:700;

color:var(--text);

position:relative;

transition:.3s ease;

}

.desktop-menu a::after{

content:"";

position:absolute;

left:0;
bottom:-8px;

width:0%;

height:3px;

background:var(--gradient);

border-radius:50px;

transition:.35s ease;

}

.desktop-menu a:hover{

color:var(--primary);

}

.desktop-menu a:hover::after{

width:100%;

}

/* =========================================
   BUTTONS
========================================= */

.checkout-btn,
.shop-btn,
.hero-checkout-btn,
.btn{

position:relative;

overflow:hidden;

transition:.35s ease;

will-change:transform;

}

.checkout-btn:hover,
.shop-btn:hover,
.hero-checkout-btn:hover,
.btn:hover{

transform:
translateY(-3px);

}

/* =========================================
   BUTTON SHINE EFFECT
========================================= */

.checkout-btn::before,
.shop-btn::before,
.premium-btn::before{

content:"";

position:absolute;

top:0;
left:-100%;

width:100%;
height:100%;

background:
linear-gradient(
90deg,
transparent,
rgba(255,255,255,.35),
transparent
);

transition:.7s;

}

.checkout-btn:hover::before,
.shop-btn:hover::before,
.premium-btn:hover::before{

left:100%;

}

/* =========================================
   CHECKOUT BUTTON
========================================= */

.checkout-btn{

display:flex;

justify-content:center;
align-items:center;

background:var(--gradient);

padding:15px 25px;

border-radius:18px;

font-size:15px;

font-weight:800;

color:#fff;

box-shadow:
0 15px 30px rgba(255,91,46,.25);

}

/* =========================================
   HERO
========================================= */

.hero{

padding:70px 0;

}

.hero-grid{

display:grid;

grid-template-columns:
1fr 1fr;

gap:55px;

align-items:center;

}

/* =========================================
   HERO IMAGE
========================================= */

.hero-image{

position:relative;

background:#fff;

border-radius:36px;

overflow:hidden;

border:
1px solid var(--border);

box-shadow:var(--shadow-lg);

will-change:transform;

}

.hero-image::before{

content:"";

position:absolute;

width:250px;
height:250px;

background:
rgba(255,91,46,.12);

border-radius:50%;

top:-100px;
right:-100px;

filter:blur(10px);

}

.sale-badge{

position:absolute;

top:18px;
left:18px;

z-index:5;

background:var(--gradient);

color:#fff;

padding:10px 18px;

border-radius:50px;

font-size:14px;

font-weight:800;

box-shadow:
0 10px 20px rgba(255,91,46,.25);

animation:
pulseBadge 2s infinite;

}

@keyframes pulseBadge{

0%{
transform:scale(1);
}

50%{
transform:scale(1.06);
}

100%{
transform:scale(1);
}

}

.hero-image img{

width:100%;

height:620px;

object-fit:contain;

padding:40px;

transition:.4s ease;

transform:translateZ(0);

backface-visibility:hidden;

}

.hero-image:hover img{

transform:scale(1.05);

}

/* =========================================
   HERO CONTENT
========================================= */

.hero-content{

background:#fff;

padding:55px;

border-radius:36px;

border:
1px solid var(--border);

box-shadow:var(--shadow);

}

.hero-badge{

display:inline-flex;

align-items:center;

gap:8px;

background:#fff1eb;

color:var(--primary);

padding:12px 20px;

border-radius:50px;

font-size:14px;

font-weight:700;

margin-bottom:25px;

}

.hero-content h1{

font-size:48px;

line-height:1.2;

font-weight:900;

margin-bottom:20px;

}

.hero-description{

font-size:17px;

line-height:1.9;

color:var(--muted);

margin-bottom:28px;

}

/* =========================================
   PRICE
========================================= */

.hero-price{

margin-bottom:24px;

}

.old-price{

font-size:24px;

text-decoration:line-through;

color:#9ca3af;

margin-right:10px;

font-weight:600;

}

.new-price{

font-size:60px;

font-weight:900;

color:var(--green);

text-shadow:
0 5px 15px rgba(18,201,123,.18);

}

/* =========================================
   RATING
========================================= */

.hero-rating{

display:inline-flex;

align-items:center;

gap:10px;

padding:12px 18px;

border-radius:16px;

background:#fff8e7;

color:#f59e0b;

font-weight:700;

margin-bottom:28px;

}

/* =========================================
   FEATURES
========================================= */

.hero-features{

display:grid;

grid-template-columns:
repeat(2,1fr);

gap:15px;

margin-bottom:30px;

}

.feature-box{

background:#f9fbff;

border:
1px solid var(--border);

padding:16px;

border-radius:18px;

font-size:15px;

font-weight:600;

transition:.3s ease;

}

.feature-box:hover{

transform:translateY(-3px);

border-color:#ffd1c2;

}

/* =========================================
   HERO BUTTONS
========================================= */

.hero-buttons{

display:flex;

gap:15px;

}

.shop-btn{

flex:1;

background:var(--gradient);

padding:18px;

border-radius:18px;

font-size:18px;

font-weight:800;

color:#fff;

text-align:center;

box-shadow:
0 15px 30px rgba(255,91,46,.25);

}

.hero-checkout-btn{

flex:1;

display:flex;

justify-content:center;

align-items:center;

background:#fff3ee;

border:
1px solid #ffd8ca;

padding:18px;

border-radius:18px;

font-weight:700;

color:var(--primary);

}

/* =========================================
   LIVE PROOF
========================================= */

.live-proof{

margin-top:24px;

display:inline-flex;

align-items:center;

background:#fff1eb;

padding:14px 18px;

border-radius:16px;

font-size:14px;

font-weight:700;

color:var(--primary);

}

/* =========================================
   TRUST SECTION
========================================= */

.trust-section{

padding:10px 0 80px;

}

.trust-grid{

display:grid;

grid-template-columns:
repeat(4,1fr);

gap:25px;

}

.trust-card{

background:#fff;

padding:38px 22px;

border-radius:28px;

text-align:center;

border:
1px solid var(--border);

box-shadow:var(--shadow);

transition:.3s ease;

will-change:transform;

}

.trust-card:hover{

transform:translateY(-6px);

box-shadow:var(--shadow-lg);

}

.trust-card h3{

font-size:42px;

font-weight:900;

color:var(--primary);

margin-bottom:10px;

}

.trust-card p{

color:var(--muted);

}

/* =========================================
   FLASH SALE
========================================= */

.flash-sale{

padding-bottom:30px;

}

.flash-sale-box{

background:var(--gradient);

padding:14px 20px;

border-radius:20px;

display:flex;

justify-content:space-between;

align-items:center;

color:#fff;

box-shadow:
0 8px 20px rgba(255,91,46,.15);

}

.flash-left{

font-size:18px;

font-weight:700;

}

.flash-timer{

font-size:18px;

font-weight:700;

}

@media(max-width:768px){

.flash-sale{

padding-bottom:20px;

}

.flash-sale-box{

padding:12px 15px;

border-radius:16px;

}

.flash-left{

font-size:14px;

}

.flash-timer{

font-size:14px;

}

}
/* =========================================
   COUPON
========================================= */

.coupon-section{

padding-bottom:80px;

}

.coupon-box{

background:#fff;

padding:35px;

border-radius:30px;

display:flex;

justify-content:space-between;

align-items:center;

gap:20px;

border:
1px solid var(--border);

box-shadow:var(--shadow);

}

.coupon-left{

font-size:50px;

}

.coupon-content h3{

font-size:30px;

margin-bottom:6px;

}

.coupon-content p{

color:var(--muted);

}

.coupon-code{

background:var(--gradient);

padding:16px 28px;

border-radius:18px;

color:#fff;

font-size:26px;

font-weight:900;

letter-spacing:1px;

}

/* =========================================
   PRODUCTS
========================================= */

.products-section{

padding-bottom:120px;

}

.section-header{

text-align:center;

margin-bottom:55px;

}

.section-badge{

display:inline-block;

background:#fff1eb;

color:var(--primary);

padding:10px 18px;

border-radius:50px;

font-size:13px;

font-weight:700;

margin-bottom:18px;

}

.section-header h2{

font-size:54px;

font-weight:900;

margin-bottom:12px;

}

.section-header p{

font-size:16px;

color:var(--muted);

}

/* =========================================
   PRODUCT GRID
========================================= */

.products-grid,
#products{

display:grid;

grid-template-columns:
repeat(4,1fr);

gap:28px;

}

/* =========================================
   PRODUCT CARD
========================================= */

.product-card{

background:#fff;

border-radius:30px;

overflow:hidden;

border:
1px solid var(--border);

box-shadow:var(--shadow);

transition:.35s ease;

position:relative;

will-change:transform;

}

.product-card:hover{

transform:
translateY(-8px);

box-shadow:var(--shadow-lg);

}

.product-image-box{

min-height:320px;

padding:20px;

display:flex;

justify-content:center;

align-items:center;

background:
linear-gradient(
180deg,
#ffffff,
#f8fafc
);

position:relative;

overflow:hidden;

}

.product-image{

width:100%;
height:100%;

object-fit:contain;

transition:.4s ease;

transform:translateZ(0);

backface-visibility:hidden;

}

.product-card:hover .product-image{

transform:scale(1.06);

}

.product-content{

padding:24px;

}

.product-title{

font-size:22px;

font-weight:800;

margin-bottom:10px;

}

.product-desc{

font-size:15px;

line-height:1.8;

color:var(--muted);

margin-bottom:18px;

min-height:54px;

}

.product-price{

margin-bottom:22px;

}

.product-old-price{

font-size:15px;

text-decoration:line-through;

color:#94a3b8;

}

.product-new-price{

display:block;

margin-top:5px;

font-size:36px;

font-weight:900;

color:var(--green);

text-shadow:
0 5px 15px rgba(18,201,123,.18);

}

/* =========================================
   PRODUCT BUTTONS
========================================= */

.product-buttons{

display:flex;

flex-direction:column;

gap:12px;

}

.btn{

padding:16px;

border-radius:18px;

font-size:15px;

font-weight:700;

text-align:center;

color:#fff;

}

.premium-btn{

background:var(--gradient-green);

}

.btn-outline{

background:var(--gradient);

}

/* =========================================
   SKELETON
========================================= */

.skeleton-card{

height:520px;

border-radius:30px;

background:
linear-gradient(
90deg,
#f1f5f9 25%,
#e2e8f0 50%,
#f1f5f9 75%
);

background-size:200% 100%;

animation:
skeleton 1.4s infinite;

}

@keyframes skeleton{

0%{
background-position:200% 0;
}

100%{
background-position:-200% 0;
}

}

/* =========================================
   EMPTY BOX
========================================= */

.empty-box{

grid-column:1/-1;

background:#fff;

padding:40px;

border-radius:24px;

text-align:center;

font-size:20px;

font-weight:700;

border:1px solid var(--border);

}

/* =========================================
   FLOAT CART
========================================= */

.cart-float{

position:fixed;

right:20px;

bottom:100px;

width:72px;
height:72px;

border-radius:50%;

background:var(--gradient);

display:flex;

flex-direction:column;

justify-content:center;

align-items:center;

font-size:24px;

font-weight:800;

color:#fff;

z-index:9999;

box-shadow:
0 18px 35px rgba(255,91,46,.28);

animation:
floatCart 2s ease infinite;

}

@keyframes floatCart{

0%{
transform:translateY(0);
}

50%{
transform:translateY(-8px);
}

100%{
transform:translateY(0);
}

}

.cart-float span{

font-size:13px;

}

/* =========================================
   STICKY CHECKOUT
========================================= */

.sticky-checkout{

position:fixed;

left:0;
bottom:0;

width:100%;

padding:14px;

background:
rgba(255,255,255,.94);

backdrop-filter:blur(12px);

-webkit-backdrop-filter:blur(12px);

border-top:
1px solid var(--border);

z-index:9998;

}

.sticky-checkout a{

display:flex;

justify-content:center;

align-items:center;

background:var(--gradient);

padding:17px;

border-radius:18px;

font-size:18px;

font-weight:800;

color:#fff;

box-shadow:
0 10px 25px rgba(255,91,46,.25);

}

/* =========================================
   WHATSAPP
========================================= */

.whatsapp-chat{

position:fixed;

left:20px;

bottom:20px;

z-index:99999;

}

.whatsapp-chat a{

display:flex;

align-items:center;

gap:14px;

background:
linear-gradient(
135deg,
#25d366,
#18b95c
);

padding:14px 18px;

border-radius:60px;

color:#fff;

box-shadow:
0 15px 30px rgba(37,211,102,.25);

transition:.3s ease;

}

.whatsapp-chat a:hover{

transform:translateY(-4px);

}

.whatsapp-chat img{

width:42px;
height:42px;

background:#fff;

border-radius:50%;

padding:5px;

}

.chat-text{

display:flex;

flex-direction:column;

}

.chat-text strong{

font-size:15px;

}

.chat-text span{

font-size:12px;

opacity:.9;

}

/* =========================================
   TOAST
========================================= */

#cartToast{

position:fixed;

top:100px;
right:20px;

background:var(--gradient-green);

color:#fff;

padding:16px 22px;

border-radius:18px;

font-weight:700;

z-index:999999;

opacity:0;

visibility:hidden;

transform:
translateY(20px);

transition:.35s ease;

box-shadow:
0 15px 35px rgba(18,201,123,.25);

}

#cartToast.show{

opacity:1;

visibility:visible;

transform:
translateY(0);

}

/* =========================================
   LIVE POPUP
========================================= */

#livePopup{

position:fixed;

left:20px;
bottom:110px;

background:#fff;

padding:14px 18px;

border-radius:18px;

box-shadow:
0 15px 35px rgba(0,0,0,.12);

border:
1px solid var(--border);

font-size:14px;

font-weight:700;

z-index:999999;

opacity:0;

visibility:hidden;

transform:
translateY(20px);

transition:.35s ease;

max-width:280px;

}

#livePopup.show{

opacity:1;

visibility:visible;

transform:
translateY(0);

}

/* =========================================
   FOOTER
========================================= */

.footer{

background:#fff;

padding-top:75px;

border-top:
1px solid var(--border);

}

.footer-grid{

display:grid;

grid-template-columns:
2fr 1fr 1fr;

gap:45px;

padding-bottom:55px;

}

.footer-logo-img{

width:150px;

margin-bottom:18px;

}

.footer p,
.footer a{

font-size:15px;

line-height:1.9;

color:var(--muted);

}

.footer-links{

display:flex;

flex-direction:column;

}

.footer-links a{

margin-bottom:12px;

transition:.3s ease;

}

.footer-links a:hover{

color:var(--primary);

}

.footer h4{

font-size:22px;

font-weight:800;

margin-bottom:18px;

}

.footer-bottom{

padding:22px;

text-align:center;

border-top:
1px solid var(--border);

font-size:14px;

color:#94a3b8;

}

/* =========================================
   SECTION FIX
========================================= */

section{
position:relative;
}

/* =========================================
   RESPONSIVE
========================================= */

@media(max-width:1200px){

.products-grid,
#products{
grid-template-columns:
repeat(3,1fr);
}

.hero-content h1{
font-size:50px;
}

}

@media(max-width:992px){

.hero-grid{
grid-template-columns:1fr;
gap:35px;
}

.products-grid,
#products{
grid-template-columns:
repeat(2,1fr);
}

.trust-grid{
grid-template-columns:
repeat(2,1fr);
}

.footer-grid{
grid-template-columns:1fr;
}

.hero-content h1{
font-size:42px;
}

.hero-image img{
height:480px;
}

}

@media(max-width:768px){

.desktop-menu{
display:none;
}

.logo-img{
width:130px;
}

.hero{
padding:35px 0;
}

.hero-content{
padding:30px 22px;
}

.hero-content h1{
font-size:34px;
}

.hero-image img{
height:340px;
padding:25px;
}

.hero-buttons{
flex-direction:column;
}

.hero-features{
grid-template-columns:1fr;
}

.products-grid,
#products{
grid-template-columns:1fr;
}

.section-header h2{
font-size:36px;
}

.trust-grid{
grid-template-columns:1fr;
}

.coupon-box{
flex-direction:column;
text-align:center;
}

.flash-sale-box{
flex-direction:column;
gap:15px;
text-align:center;
}

.whatsapp-chat{
left:14px;
bottom:90px;
}

.chat-text{
display:none;
}

.cart-float{
right:14px;
bottom:95px;
}

.new-price{
font-size:44px;
}

button,
a{
min-height:48px;
}

}

@media(max-width:480px){

.hero-content h1{
font-size:28px;
}

.new-price{
font-size:42px;
}

.section-header h2{
font-size:30px;
}

.coupon-content h3{
font-size:22px;
}

.coupon-code{
font-size:20px;
}

.sticky-checkout a{
font-size:20px;
font-weight:900;
}

.hero-image{
border-radius:24px;
}

.product-card{
border-radius:24px;
}

}

@media(max-width:360px){

.hero-content{
padding:22px 18px;
}

.hero-content h1{
font-size:24px;
}

.new-price{
font-size:36px;
}

.flash-left{
font-size:22px;
}

.flash-timer{
font-size:28px;
}

}

/* =========================================
BLINK PRICE ANIMATION
BANGLA + ENGLISH PRICE STYLE
========================================= */

.product-new-price,
.new-price{
animation:none;
}

/* Bangla Price */
.product-new-price::before,
.new-price::before{

display:block;

font-size:13px;
font-weight:700;

color:#ff5b2e;

letter-spacing:.5px;

margin-bottom:4px;

animation:textBlink 1s infinite;

}

/* English Price */
.product-new-price::after,
.new-price::after{

content:"Special Offer Price";
display:block;

font-size:12px;
font-weight:600;

color:#12c97b;

margin-top:4px;

letter-spacing:.4px;

animation:textBlink 1s infinite alternate;

}

/* Main Price Blink */
@keyframes priceBlink{

0%{
opacity:1;
transform:scale(1);
}

50%{
opacity:.7;
transform:scale(1.05);
}

100%{
opacity:1;
transform:scale(1);
}

}

/* Text Blink */
@keyframes textBlink{

0%{
opacity:1;
}

50%{
opacity:.4;
}

100%{
opacity:1;
}

}

/* Mobile Fix */
@media(max-width:768px){

.product-new-price::before,
.new-price::before{

font-size:11px;

}

.product-new-price::after,
.new-price::after{

font-size:10px;

}

}

/* =========================================
BANGLA SYMBOL + ENGLISH PRICE
========================================= */

.product-new-price,
.new-price{

font-size:36px;
font-weight:900;
color:#12c97b;

line-height:1.2;

font-variant-numeric:tabular-nums;

}

/* Optional Offer Text */

.product-new-price::after,
.new-price::after{

content:"🔥 আজকের অফার";

display:block;

font-size:12px;
font-weight:700;

color:#ff5b2e;

margin-top:5px;

letter-spacing:.3px;

}

/* =========================================
OFFICIAL SOCIAL BUTTONS
========================================= */

.trust-share-wrap{

margin-top:35px;
text-align:center;

}

.trust-share-title{

font-size:28px;
font-weight:800;

margin-bottom:25px;

color:#111;

}

.official-social-buttons{

display:flex;
justify-content:center;
flex-wrap:wrap;

gap:18px;

}

.official-social-btn{

display:flex;
align-items:center;
gap:10px;

padding:14px 24px;

border-radius:16px;

text-decoration:none;

font-size:16px;
font-weight:700;

color:#fff;

transition:.3s ease;

box-shadow:
0 10px 25px rgba(0,0,0,.12);

}

.official-social-btn i{

font-size:22px;

}

.official-social-btn:hover{

transform:translateY(-5px);

}

/* COLORS */

.fb-btn{
background:#1877f2;
}

.wa-btn{
background:#25d366;
}

.msg-btn{
background:#0084ff;
}

.tg-btn{
background:#229ED9;
}

/* MOBILE */

@media(max-width:768px){

.trust-share-title{

font-size:22px;
line-height:1.5;

}

.official-social-buttons{

flex-direction:column;
align-items:center;

}

.official-social-btn{

width:100%;
max-width:320px;
justify-content:center;

}

}
/* =========================================
REVIEW SECTION
========================================= */

.review-section{

padding:80px 0;
background:#f8f8f8;
overflow:hidden;

}

.review-slider{

overflow:hidden;
position:relative;

}

.review-track{

display:flex;
gap:25px;
width:max-content;

animation:reviewSlide 35s linear infinite;

}

.review-card{

min-width:350px;
max-width:350px;

background:#fff;
border-radius:25px;

padding:25px;

box-shadow:
0 10px 30px rgba(0,0,0,.06);

transition:.3s ease;

}

.review-card:hover{

transform:translateY(-10px);

}

.review-top{

display:flex;
align-items:center;
gap:15px;

margin-bottom:15px;

}

.review-top img{

width:65px;
height:65px;

border-radius:50%;
object-fit:cover;

border:3px solid #ff5b2e;

}

.review-top h4{

font-size:18px;
font-weight:700;
margin-bottom:4px;

}

.review-top span{

font-size:14px;
color:#777;

}

.review-stars{

font-size:20px;
margin-bottom:15px;

}

.review-card p{

font-size:15px;
line-height:1.7;
color:#444;

}

@keyframes reviewSlide{

0%{
transform:translateX(0);
}

100%{
transform:translateX(-50%);
}

}

/* MOBILE */

@media(max-width:768px){

.review-card{

min-width:280px;
max-width:280px;

}

}

/* =========================================
IMAGE ZOOM MODAL
========================================= */

.image-zoom-modal{

position:fixed;
top:0;
left:0;

width:100%;
height:100%;

background:rgba(0,0,0,.85);

display:flex;
justify-content:center;
align-items:center;

opacity:0;
visibility:hidden;

transition:.35s ease;

z-index:999999;

padding:20px;

}

.image-zoom-modal.show{

opacity:1;
visibility:visible;

}

.image-zoom-modal img{

max-width:90%;
max-height:90%;

border-radius:20px;

background:#fff;

padding:15px;

animation:zoomIn .35s ease;

}

@keyframes zoomIn{

from{
transform:scale(.7);
opacity:0;
}

to{
transform:scale(1);
opacity:1;
}

}

.close-zoom{

position:absolute;

top:25px;
right:25px;

width:50px;
height:50px;

border-radius:50%;

background:#fff;

display:flex;
justify-content:center;
align-items:center;

font-size:28px;
font-weight:700;

color:#111;

cursor:pointer;

transition:.3s ease;

}

.close-zoom:hover{

transform:rotate(90deg);

}

/* =========================================
CHECKOUT RESPONSIVE FIX
========================================= */

@media(max-width:992px){

.checkout-grid{

display:flex;
flex-direction:column;

}

}

/* =========================================
MOBILE CHECKOUT ORDER FIX
========================================= */

@media(max-width:768px){

.checkout-grid{

display:flex !important;
flex-direction:column !important;

}

/* ╨Б╨п╨г╨╢ ╤А╨╢╨Х╤А╨╢тЦС╤А╨╖╨Э╤А╨╢╨▒╤А╨╢тХЫ╤А╨╢тЦС ╤А╨╢╨┤╤А╨╢╨╡╤А╨╖╨Э╤А╨╢╨┐ ╤А╨╢╨╢╤А╨╢тФР╤А╨╢╨╕ */
.checkout-form{

order:1 !important;

}

/* ╨Б╨п╨╖тХЫ ╤А╨╢╨Х╤А╨╢тЦС╤А╨╖╨Э╤А╨╢╨▒╤А╨╢тХЫ╤А╨╢тЦС ╤А╨╢тХХ╤А╨╢тХЫ╤А╨╢╨╛╤А╨╢тХЫ╤А╨╢тЦС╤А╨╢тФР */
.summary{

order:2 !important;

}

}

.goog-te-banner-frame.skiptranslate{
display:none !important;
}

body{
top:0 !important;
}

.skiptranslate{
display:none !important;
}

.header-wrapper{
display:flex;
align-items:center;
justify-content:space-between;
gap:10px;
}

.logo-wrap{
margin-right:auto;
}

.desktop-menu{
margin-left:auto;
margin-right:15px;
}

.checkout-btn{
padding:12px 18px;
font-size:14px;
white-space:nowrap;
}



.checkout-btn{
margin-left:0 !important;
padding:10px 14px;
font-size:14px;
}

/* =========================================
HEADER PERFECT GAP FIX
========================================= */

.header{
overflow:hidden;
}

.header-wrapper{

display:flex;
align-items:center;
justify-content:space-between;

gap:6px;

padding:10px 0;

}

/* LOGO */

.logo-wrap{

display:flex;
align-items:center;

flex-shrink:0;

margin:0;
padding:0;

}

.logo-img{

width:125px;
height:auto;

display:block;

}

/* MENU */

.desktop-menu{

display:flex;
align-items:center;

gap:18px;

margin-left:auto;
margin-right:6px;

}

/* CHECKOUT BUTTON */

.checkout-btn{

padding:10px 14px;

font-size:13px;

border-radius:12px;

white-space:nowrap;

flex-shrink:0;

margin:0;

}

/* MOBILE FIX */

@media(max-width:768px){

.header{

padding:6px 10px;

}

.header-wrapper{

gap:4px;
flex-wrap:nowrap;

}

/* LOGO */

.logo-img{

width:100px;

}

/* HIDE MENU */

.desktop-menu{

display:none;

}

/* BUTTON */

.checkout-btn{

padding:7px 10px;

font-size:12px;

border-radius:10px;

min-height:auto;

}

/* PREVENT OVERFLOW */

body,
html{

overflow-x:hidden;

}

.container{

padding-left:12px;
padding-right:12px;

}

}

/* MOBILE FIX */

@media(max-width:768px){

.header{
padding:8px 10px;
}

.header-wrapper{
gap:4px !important;
}

.logo-img{
width:110px;
}

.desktop-menu{
display:none;
}

.checkout-btn{
padding:8px 12px;
font-size:13px;
border-radius:12px;
}

}

/* =========================================
DESKTOP PRODUCT FIX
========================================= */

.products-section{
overflow:hidden;
}

.products-grid,
#products{

display:grid;

grid-template-columns:
repeat(auto-fit,minmax(300px,1fr));

gap:28px;

width:100%;

}

/* PRODUCT CARD */

.product-card{

width:100%;

min-width:0;

}

/* IMAGE FIX */

.product-image-box{

width:100%;

overflow:hidden;

}

/* CONTAINER FIX */

.container{

width:100%;

max-width:1400px;

margin:auto;

padding-left:20px;
padding-right:20px;

overflow:visible;

}

/* DESKTOP LARGE SCREEN */

@media(min-width:1400px){

.products-grid,
#products{

grid-template-columns:
repeat(4,1fr);

}

}

/* LAPTOP */

@media(max-width:1200px){

.products-grid,
#products{

grid-template-columns:
repeat(3,1fr);

}

}

/* TABLET */

@media(max-width:992px){

.products-grid,
#products{

grid-template-columns:
repeat(2,1fr);

}

}

/* MOBILE */

@media(max-width:768px){

.products-grid,
#products{

grid-template-columns:1fr;

}

}

/* =========================================
PRODUCT DESKTOP FIX
========================================= */

html,
body{

overflow-x:hidden;

}

/* MAIN SECTION */

.products-section{

width:100%;

overflow:visible !important;

}

/* PRODUCT WRAPPER */

.products-grid,
#products{

display:grid;

grid-template-columns:
repeat(4,minmax(0,1fr));

gap:28px;

width:100%;

overflow:visible !important;

}

/* CARD */

.product-card{

width:100%;

max-width:100%;

overflow:hidden;

}

/* IMAGE */

.product-image-box{

width:100%;

height:320px;

display:flex;

justify-content:center;
align-items:center;

overflow:hidden;

}

.product-image{

width:100%;
height:100%;

object-fit:contain;

}

/* CONTAINER */

.container{

max-width:1400px;

width:100%;

margin:auto;

padding-left:20px;
padding-right:20px;

overflow:visible !important;

}

/* FIX FOR LARGE DESKTOP */

@media(min-width:1400px){

.container{

max-width:1500px;

}

}

/* LAPTOP */

@media(max-width:1200px){

.products-grid,
#products{

grid-template-columns:
repeat(3,1fr);

}

}

/* TABLET */

@media(max-width:992px){

.products-grid,
#products{

grid-template-columns:
repeat(2,1fr);

}

}

/* MOBILE */

@media(max-width:768px){

.products-grid,
#products{

grid-template-columns:1fr;

}

}
.product-description,
.product-description p {
    font-size: 16px;
    line-height: 1.8;
    white-space: normal;
    word-break: normal;
    overflow-wrap: break-word;
}

.product-desc {
    line-height: 1.4; /* рж▓рж╛ржЗржирзЗрж░ ржорж╛ржЭрзЗ ржХржо ржлрж╛ржБржХ */
    font-size: 16px;
    color: #555;
    margin-bottom: 8px; /* ржЧрзНржпрж╛ржк ржХржорж╛ржирзЛрж░ ржЬржирзНржп */
}

.product-desc br {
    display: block;
    margin-bottom: 6px;
}

.mobile-features{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    margin-top:15px;
}

.mobile-features .feature-item{
    background:linear-gradient(135deg,#fff,#f8f8f8);
    border:1px solid #eee;
    border-radius:12px;
    padding:12px;
    text-align:center;
    font-size:14px;
    font-weight:700;
    box-shadow:0 4px 12px rgba(0,0,0,.05);
}

.mobile-features .feature-item:nth-child(1){
    color:#16a34a;
}

.mobile-features .feature-item:nth-child(2){
    color:#2563eb;
}

.mobile-features .feature-item:nth-child(3){
    color:#ea580c;
}

.mobile-features .feature-item:nth-child(4){
    color:#dc2626;
}

.hero-features .feature-item{

background:#fff;

border:1px solid #e5e7eb;

border-radius:12px;

padding:12px;

font-size:14px;

font-weight:700;

box-shadow:0 4px 12px rgba(0,0,0,.05);

}
.mobile-hero-order{
    display:none;
}

@media(max-width:768px){

    .mobile-hero-order{

        display:flex;

        justify-content:center;
        align-items:center;

        width:100%;

        margin-top:12px;

        padding:15px;

        background:#ec4899;

        color:#fff;

        border-radius:14px;

        font-size:17px;

        font-weight:800;

        text-align:center;

    }

}
/* =========================================
PRODUCT IMAGE PERFECT FIX
NO CROP / NO CUT
========================================= */

.products-section,
.products-grid,
#products,
.product-card{
overflow:visible !important;
}

.product-image-box{

width:100% !important;

height:350px !important;

padding:20px !important;

display:flex !important;

justify-content:center !important;

align-items:center !important;

background:#fff !important;

overflow:visible !important;

}

.product-image-box img,
.product-image{

width:100% !important;

height:100% !important;

max-width:100% !important;

max-height:100% !important;

object-fit:contain !important;

object-position:center center !important;

display:block !important;

margin:auto !important;

transform:none !important;

}

/* HOVER ZOOM OFF */

.product-card:hover .product-image,
.product-card:hover img{

transform:none !important;

}

/* DESKTOP */

@media(min-width:992px){

.product-image-box{

height:380px !important;

padding:25px !important;

}

}

/* TABLET */

@media(max-width:991px){

.product-image-box{

height:320px !important;

padding:20px !important;

}

}

/* MOBILE */

@media(max-width:768px){

.product-image-box{

height:280px !important;

padding:15px !important;

}

}

/* EXTRA SMALL */

@media(max-width:480px){

.product-image-box{

height:240px !important;

padding:12px !important;

}

}
/* PRODUCT IMAGE FULL VIEW FIX */
.product-card,
.product-image-box{
  overflow: hidden !important;
}

.product-image-box{
  height: 300px !important;
  padding: 18px !important;
  background: #fff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.product-image-box img,
.product-image{
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
  display: block !important;
  transform: none !important;
}

.product-card:hover .product-image,
.product-card:hover img{
  transform: none !important;
}

@media(max-width:768px){
  .product-image-box{
    height: 260px !important;
    padding: 14px !important;
  }
}

/* =====================================
SPECIAL OFFER BADGE OVERRIDE
===================================== */

.sale-badge{
    position: absolute !important;
    top: 8px !important;
    left: 8px !important;
    right: auto !important;

    padding: 6px 14px !important;

    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;

    border-radius: 25px !important;

    z-index: 20 !important;
}

/* Product card badge */
.product-card .sale-badge{
    top: 8px !important;
    left: 8px !important;

    padding: 5px 12px !important;

    font-size: 12px !important;
    border-radius: 20px !important;
}
.product-card .sale-badge{
    padding: 4px 10px !important;
    font-size: 11px !important;
}