/* =========================
GLOBAL
========================= */
.sp-home{
overflow:hidden;
}

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

.sp-section{
padding:20px 0;
}

/* =========================
PREMIUM SECTION TITLES
========================= */

/* SECTION HEADER LAYOUT */
.sp-section-head{

display:flex;
align-items:flex-start;
justify-content:space-between;
gap:40px;

margin-bottom:46px;

}

.sp-section-head .sp-section-title{
margin-bottom:0;
flex-shrink:0;
}

.sp-section-head .sp-section-sub{

margin-bottom:0;

max-width:600px;

justify-content:flex-end;
text-align:right;

}

.sp-section-title{
position:relative;
display:inline-flex;
align-items:center;
gap:14px;

font-size:26px;
font-weight:700;
line-height:1.15;
letter-spacing:-1.5px;

margin-bottom:18px;

color:#0f172a;

padding-bottom:16px;

isolation:isolate;
}

/* animated underline */
.sp-section-title:after{
content:'';

position:absolute;
left:0;
bottom:0;

width:110px;
height:5px;

border-radius:999px;

background:
linear-gradient(
90deg,
#0ea5e9,
#2563eb,
#7c3aed
);

background-size:200% 200%;

animation:spGradientMove 4s linear infinite;

box-shadow:
0 6px 18px rgba(37,99,235,.22);
}

/* floating glow */
.sp-section-title:before{
content:'';

position:absolute;

left:-14px;
top:-10px;

width:42px;
height:42px;

border-radius:50%;

background:
radial-gradient(
circle,
rgba(14,165,233,.18),
transparent 72%
);

z-index:-1;

animation:spFloatGlow 3s ease-in-out infinite;
}

/* gradient animation */
@keyframes spGradientMove{

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

100%{
background-position:100% 50%;
}

}

/* glow float */
@keyframes spFloatGlow{

0%,100%{
transform:translateY(0);
opacity:.7;
}

50%{
transform:translateY(-5px);
opacity:1;
}

}

/* =========================
HOME PAGE H1
========================= */

.sp-home-title{

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

gap:18px;

margin:40px auto 25px;

padding:16px 24px;

max-width:max-content;

background:#f8fafc;

border:1px solid #e2e8f0;

border-radius:999px;

font-size:25px;
font-weight:800;
line-height:1.3;

background:
linear-gradient(
135deg,
#2563eb,
#0ea5e9,
#7c3aed
);

-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
background-clip:text;

text-align:center;

box-shadow:
0 8px 20px rgba(0,0,0,.03);

}

.sp-home-line{

width:60px;
height:2px;

background:
linear-gradient(
90deg,
#2563eb,
#0ea5e9
);

border-radius:999px;

flex-shrink:0;

}

@media(max-width:768px){

.sp-home-title{

font-size:14px;
font-weight: 700;
padding:12px 16px;

gap:10px;

width:100%;

max-width:none;

border-radius:18px;

}

.sp-home-line{

width:24px;

}

}

/* =========================
PREMIUM SUBTITLE
========================= */

.sp-section-sub{
position:relative;

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

font-size:17px;
font-weight:500;

line-height:1.8;

color:#64748b;

margin-bottom:46px;

max-width:760px;
}

/* icon */
.sp-section-sub:before{
content:'✦';

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

width:28px;
height:28px;

border-radius:50%;

background:
linear-gradient(
135deg,
#dbeafe,
#eff6ff
);

color:#2563eb;

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

flex-shrink:0;

box-shadow:
0 4px 12px rgba(37,99,235,.12);
}

/* =========================
SECTION ICON VARIANTS
========================= */

/* popular offers */
.sp-section:nth-of-type(1)
.sp-section-title:before{
background:
radial-gradient(
circle,
rgba(249,115,22,.18),
transparent 72%
);
}

.sp-section:nth-of-type(1)
.sp-section-sub:before{
content:'🔥';
color:#ea580c;
}

/* top coupons */
.sp-section:nth-of-type(2)
.sp-section-sub:before{
content:'🏷';
}

/* categories */
.sp-section:nth-of-type(3)
.sp-section-sub:before{
content:'📂';
}

/* seo */
.sp-section:nth-of-type(4)
.sp-section-sub:before{
content:'⭐';
}

/* subtle interaction */
.sp-section:hover .sp-section-title:after{
width:150px;
transition:.35s ease;
}

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

.sp-hero{
padding:10px 0 20px;
}

.sp-hero-grid{
display:grid;
grid-template-columns:2fr 420px;
gap:25px;
}

/* =========================
REAL SLIDER
========================= */

.sp-slider-wrap{
position:relative;
}

.sp-slider{
position:relative;
height:360px;
border-radius:20px;
overflow:hidden;
box-shadow:
0 25px 60px rgba(0,0,0,.15);
}

/* slide */
.sp-slide{
position:absolute;
inset:0;
opacity:0;
visibility:hidden;
transition:
opacity .6s ease,
transform .6s ease;
transform:scale(1.02);
}

.sp-slide.active{
opacity:1;
visibility:visible;
transform:scale(1);
z-index:2;
}

/* bg */
.sp-slide-bg{
position:absolute;
inset:0;
}

.sp-slide-bg img{
width:100%;
height:100%;
object-fit:cover;
}

/* overlay */
.sp-slide-overlay{
position:absolute;
inset:0;
background:
linear-gradient(
90deg,
rgba(15,23,42,.88),
rgba(15,23,42,.35)
);
}

/* content */
.sp-slide-content{
position:absolute;
left:60px;
bottom:60px;
max-width:650px;
z-index:3;
color:#fff;
}

.sp-slide-badge{
display:inline-flex;
padding:10px 18px;
border-radius:999px;
background:rgba(255,255,255,.12);
backdrop-filter:blur(10px);
font-size:13px;
font-weight:800;
margin-bottom:24px;
}

.sp-slide-content h2{
font-size:32px;
line-height:1.1;
font-weight:700;
margin-bottom:20px;
letter-spacing:-2px;
}

.sp-slide-content p{
font-size:18px;
line-height:1.8;
color:#dbeafe;
margin-bottom:30px;
margin-left: 28px;
}

.sp-slide-btn{
display:inline-flex;
align-items:center;
gap:10px;
padding:16px 24px;
margin-left: 28px;
border-radius:18px;
background:
linear-gradient(
135deg,
#0ea5e9,
#2563eb
);
color:#fff;
font-size:15px;
font-weight:800;
text-decoration:none;
transition:.25s;
}

.sp-slide-btn:hover{
transform:translateY(-2px);
}

/* arrows */
.sp-slide-arrow{
position:absolute;
top:50%;
transform:translateY(-50%);
width:58px;
height:58px;
border:none;
border-radius:50%;
background:rgba(255,255,255,.12);
backdrop-filter:blur(10px);
color:#fff;
font-size:36px;
cursor:pointer;
z-index:10;
transition:.25s;
}

.sp-slide-arrow:hover{
background:#fff;
color:#0f172a;
}

.sp-slide-arrow.prev{
left:20px;
}

.sp-slide-arrow.next{
right:20px;
}

/* nav */
.sp-slide-nav{
display:flex;
gap:14px;
margin-top:18px;
overflow:auto;
padding-bottom:4px;
}

.sp-slide-nav-item{
padding:10px 14px;
border-radius:16px;
background:#fff;
cursor:pointer;
font-size:12px;
font-weight:700;
white-space:nowrap;
transition:.2s;
box-shadow:
0 6px 20px rgba(0,0,0,.04);
}

.sp-slide-nav-item.active{
background:#2563eb;
color:#fff;
}

/* =========================
POPULAR OFFERS
========================= */

.sp-offer-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:24px;
}

.sp-offer-card{
background:#fff;
border-radius:28px;
overflow:hidden;
box-shadow:
0 18px 40px rgba(0,0,0,.05);

transition:.35s ease;

position:relative;

height:520px;

display:flex;
flex-direction:column;
}

.sp-offer-card:hover{
transform:translateY(-6px);
}

.sp-offer-image{
height:220px;
overflow:hidden;
position:relative;
flex-shrink:0;
}

.sp-offer-image img{
width:100%;
height:100%;
object-fit:cover;
transition:.45s ease;
}

.sp-offer-card:hover .sp-offer-image img{
transform:scale(1.06);
}

.sp-offer-content{
padding:24px;

position:absolute;

left:0;
bottom:0;

width:100%;
height:300px;

background:#fff;

transition:
transform .42s cubic-bezier(.22,1,.36,1);

display:flex;
flex-direction:column;

z-index:5;
}

.sp-offer-logo{
width:70px;
height:70px;
border-radius:50%;

background:#fff;

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

position:absolute;

top:-38px;
right:24px;

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

border:4px solid #fff;

transition:
transform .42s cubic-bezier(.22,1,.36,1);

z-index:8;
}

.sp-offer-logo img{
max-width:60%;
max-height:60%;
object-fit:contain;
}

.sp-offer-content h3{
font-size:22px;
line-height:1.4;
font-weight:800;
margin-bottom:14px;
color:#0f172a;
}

.sp-offer-content p{
font-size:14px;
line-height:1.8;
color:#64748b;
margin-bottom:20px;

overflow:hidden;

display:-webkit-box;
-webkit-line-clamp:4;
-webkit-box-orient:vertical;

min-height:100px;
}

.sp-offer-btn{
display:flex;
align-items:center;
justify-content:center;

height:54px;

border-radius:16px;

background:
linear-gradient(
135deg,
#0ea5e9,
#2563eb
);

color:#fff;
text-decoration:none;
font-weight:800;

/* hidden below */
margin-top:auto;

transform:
translateY(90px);

opacity:0;

transition:
transform .42s cubic-bezier(.22,1,.36,1),
opacity .28s ease;

flex-shrink:0;
}

/* =========================
PREMIUM HOVER EFFECT
========================= */

.sp-offer-card:hover{
transform:translateY(-8px);

box-shadow:
0 28px 55px rgba(0,0,0,.10);
}

/* image zoom */
.sp-offer-card:hover .sp-offer-image img{
transform:scale(1.08);
}

/* content moves upward */
.sp-offer-card:hover .sp-offer-content{
transform:translateY(-60px);
}

/* logo float */
.sp-offer-card:hover .sp-offer-logo{
transform:
translateY(-12px)
scale(1.05);
}

/* button reveal */
.sp-offer-card:hover .sp-offer-btn{
transform:translateY(0);
opacity:1;
}

/* button hover */
.sp-offer-btn:hover{
transform:
translateY(-2px)
scale(1.02) !important;
}

/* =========================
DISABLE OFFER HOVER EFFECTS
ON MOBILE
========================= */

@media(max-width:768px){
.sp-offer-content h3 {
    font-size: 16px;
}

/* remove card hover lift */
.sp-offer-card:hover{
transform:none;
box-shadow:
0 18px 40px rgba(0,0,0,.05);
}

/* disable image zoom */
.sp-offer-card:hover .sp-offer-image img{
transform:none;
}

/* disable content slide */
.sp-offer-card:hover .sp-offer-content{
transform:none;
}

/* disable logo float */
.sp-offer-card:hover .sp-offer-logo{
transform:none;
}

/* button always visible on mobile */
.sp-offer-btn{
transform:none;
opacity:1;
}

/* disable button hover animation */
.sp-offer-btn:hover{
transform:none !important;
}

}

/* =========================
FEATURED SLIDER
========================= */

.sp-feature-slider-wrap{
display:flex;
flex-direction:column;
height:100%;
}

/* slider */
.sp-feature-slider{
position:relative;
overflow:hidden;

height:360px;
}

/* slide */
.sp-feature-slide{
display:none;
height:100%;

animation:fadeFeature .45s ease;
}

.sp-feature-slide.active{
display:block;
}

/* fade */
@keyframes fadeFeature{

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

to{
opacity:1;
transform:none;
}

}

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

.sp-feature-card{
position:relative;

display:flex;
flex-direction:column;

height:100%;

padding:28px;

border-radius:28px;

background:
linear-gradient(
145deg,
#ffffff,
#f8fbff
);

border:1px solid #eef2f7;

box-shadow:
0 18px 50px rgba(15,23,42,.06);

overflow:hidden;
}

/* glow */
.sp-feature-card:before{
content:'';

position:absolute;

top:-80px;
right:-80px;

width:220px;
height:220px;

border-radius:50%;

background:
radial-gradient(
circle,
rgba(37,99,235,.12),
transparent 72%
);

pointer-events:none;
}

/* =========================
LABEL
========================= */

.sp-feature-label{
display:inline-flex;
align-items:center;

padding:8px 14px;

border-radius:999px;

background:#fff7ed;

color:#ea580c;

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

margin-bottom:18px;

align-self:flex-start;
}

/* =========================
STORE
========================= */

.sp-feature-store{
display:flex;
align-items:center;
gap:14px;

margin-bottom:20px;
}

/* logo */
.sp-feature-store img{
width:58px;
height:58px;

border-radius:18px;

object-fit:contain;

background:#fff;

border:1px solid #eef2f7;

padding:10px;

box-shadow:
0 8px 20px rgba(0,0,0,.05);
}

/* store name */
.sp-feature-store h4{
font-size:15px;
font-weight:800;
color:#0f172a;
margin-top: 0;
}

/* verified */
.sp-feature-store small{
font-size:12px;
font-weight:600;
color:#64748b;
}

/* =========================
TITLE
========================= */

.sp-feature-title{
font-size:20px;
line-height:1.35;
font-weight:800;

letter-spacing:-.5px;

margin-bottom:14px;

color:#0f172a;
}

/* =========================
DESCRIPTION
========================= */

/* description */
.sp-feature-desc{
font-size:14px;
line-height:1.75;

color:#64748b;

margin-bottom:24px;

overflow:hidden;

display:-webkit-box;
-webkit-line-clamp:4;
-webkit-box-orient:vertical;
}

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

.sp-feature-btn{
display:inline-flex;
align-items:center;
justify-content:center;
gap:10px;

width:100%;
height:52px;

border-radius:16px;

background:
linear-gradient(
135deg,
#0ea5e9,
#2563eb
);

color:#fff;

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

text-decoration:none;

margin-top:auto;

transition:.25s ease;
}

/* hover */
.sp-feature-btn:hover{
transform:translateY(-2px);

box-shadow:
0 12px 28px rgba(37,99,235,.22);
}

/* =========================
NAV
========================= */

.sp-feature-nav{
display:flex;
gap:10px;

margin-top:14px;

overflow:auto;

padding-bottom:2px;
}

/* nav item */
.sp-feature-nav-item{
padding:10px 14px;

border-radius:14px;

background:#fff;

cursor:pointer;

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

white-space:nowrap;

transition:.2s ease;

box-shadow:
0 6px 20px rgba(0,0,0,.04);
}

/* active */
.sp-feature-nav-item.active{
background:#2563eb;
color:#fff;
}

/* =========================
TRUST BAR
========================= */

.sp-trust-bar{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:22px;
margin-top:40px;
}

.sp-trust-box{
background:#fff;
padding:28px;
border-radius:24px;
text-align:center;
box-shadow:
0 12px 35px rgba(0,0,0,.04);
}

.sp-trust-box h3{
font-size:34px;
font-weight:900;
margin-bottom:8px;
color:#0f172a;
}

.sp-trust-box p{
color:#64748b;
font-size:15px;
}

/* =========================
TOP COUPONS
========================= */

.sp-coupon-list{
display:flex;
flex-direction:column;
gap:22px;
}

/* =========================
CATEGORY GRID
========================= */

.sp-category-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:22px;
}

.sp-category-card{
border-radius:28px;
padding:34px;
position:relative;
overflow:hidden;
transition:.25s;
box-shadow:
0 12px 35px rgba(0,0,0,.04);
}

.sp-category-card:hover{
transform:translateY(-4px);
}

.sp-category-card h3{
font-size:24px;
font-weight:900;
margin-bottom:10px;
color:#0f172a;
}

.sp-category-card p{
font-size:14px;
color:#475569;
margin-bottom:18px;
}

.sp-category-card a{
display:inline-flex;
align-items:center;
gap:8px;
font-size:14px;
font-weight:800;
color:#2563eb;
text-decoration:none;
}

/* =========================
VIEW ALL CATEGORY
========================= */

.sp-category-view-all{

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

text-align:center;

text-decoration:none;

background:#eff6ff;

border:2px dashed #bfdbfe;

min-height:220px;

}

.sp-category-view-all:hover{

transform:translateY(-4px);

border-color:#2563eb;

}

.sp-category-view-icon{

width:64px;
height:64px;

border-radius:50%;

background:#2563eb;

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

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

color:#fff;

margin-bottom:18px;

}

.sp-category-view-all h3{

font-size:24px;
font-weight:900;

margin-bottom:10px;

color:#0f172a;

}

.sp-category-view-all p{

font-size:14px;

color:#475569;

margin-bottom:18px;

}

.sp-category-view-link{

display:inline-flex;
align-items:center;
gap:8px;

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

color:#2563eb;

}

/* =========================
SEO
========================= */

.sp-seo{
background:#fff;
border-radius:32px;
padding:60px;
box-shadow:
0 12px 35px rgba(0,0,0,.04);
}

.sp-seo p{
font-size:16px;
line-height:2;
color:#475569;
}

.sp-home-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:24px;
}

/* =========================
HOME TABS
========================= */

.sp-home-tabs{
display:flex;
gap:14px;
margin-bottom:34px;
overflow:auto;
padding-bottom:4px;
}

.sp-home-tab{
padding:14px 20px;
border-radius:16px;
background:#fff;
cursor:pointer;
font-size:14px;
font-weight:800;
white-space:nowrap;
transition:.2s;
box-shadow:
0 6px 20px rgba(0,0,0,.04);
}

.sp-home-tab.active{
background:#2563eb;
color:#fff;
}

/* content */
.sp-home-tab-content{
display:none;
}

.sp-home-tab-content.active{
display:block;
}

/* =====================================================
MOBILE SLIDERS
===================================================== */

.sp-mobile-slider-wrap{
position:relative;
}

/* hide desktop arrows */
.sp-mobile-swipe-arrow{
display:none;
}

/* =========================
PREMIUM SEO SECTION
========================= */

.sp-seo-section{
position:relative;
overflow:hidden;
}

/* wrapper */
.sp-seo-premium{
position:relative;

background:
linear-gradient(
135deg,
#ffffff,
#f8fbff
);

border-radius:36px;

padding:70px;

overflow:hidden;

border:1px solid #e2e8f0;

box-shadow:
0 25px 60px rgba(15,23,42,.06);
}

/* glow */
.sp-seo-glow{
position:absolute;

top:-120px;
right:-120px;

width:320px;
height:320px;

border-radius:50%;

background:
radial-gradient(
circle,
rgba(37,99,235,.12),
transparent 72%
);

pointer-events:none;
}

/* badge */
.sp-seo-badge{
display:inline-flex;
align-items:center;
gap:10px;

padding:10px 18px;

border-radius:999px;

background:
linear-gradient(
135deg,
#eff6ff,
#dbeafe
);

margin-bottom:26px;

border:1px solid #bfdbfe;
}

.sp-seo-badge span{
font-size:13px;
font-weight:800;
color:#2563eb;
letter-spacing:.4px;
}

/* title */
.sp-seo-title{
max-width:900px;
margin-bottom:28px;
margin-left: 20px;
}

/* subtitle */
.sp-seo-sub{
font-size:20px;
line-height:1.9;
color:#334155;
max-width:1100px;
margin-bottom:34px;
font-weight:500;
}

/* content */
.sp-seo-content{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:26px;
margin-bottom:40px;
}

.sp-seo-content p{
font-size:15px;
line-height:2;
color:#475569;
margin:0;
}

/* features */
.sp-seo-features{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:22px;
}

/* card */
.sp-seo-feature{
display:flex;
align-items:flex-start;
gap:16px;

padding:24px;

background:#fff;

border-radius:24px;

border:1px solid #eef2f7;

transition:.25s ease;

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

/* hover */
.sp-seo-feature:hover{
transform:translateY(-4px);

box-shadow:
0 18px 40px rgba(0,0,0,.06);
}

/* icon */
.sp-seo-icon{
width:52px;
height:52px;

border-radius:18px;

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

background:
linear-gradient(
135deg,
#0ea5e9,
#2563eb
);

color:#fff;

font-size:20px;
font-weight:900;

flex-shrink:0;

box-shadow:
0 10px 24px rgba(37,99,235,.22);
}

/* headings */
.sp-seo-feature h4{
font-size:18px;
font-weight:800;
margin-top: 0;
margin-bottom:8px;
color:#0f172a;
}

/* text */
.sp-seo-feature p{
font-size:14px;
line-height:1.8;
color:#64748b;
margin:0;
}

/* =========================
TABLET
========================= */

@media(max-width:1100px){

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

.sp-feature-slider{
height:auto;
}

.sp-grid-store-link {
    padding: 8px 10px;
    font-size: 10px;
}

.sp-grid-body {
    padding: 14px;
}

}

@media (min-width: 769px) and (max-width: 1100px) {
.sp-category-grid{
grid-template-columns:repeat(3,1fr);
}

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

@media (min-width: 769px) and (max-width: 940px) {
.sp-offer-grid {
grid-template-columns: repeat(2, 1fr);
}
}
@media (min-width: 941px) and (max-width: 1245px) {
.sp-offer-grid {
grid-template-columns: repeat(3, 1fr);
}
}


/* =====================================================
MOBILE ONLY
===================================================== */

@media(max-width:768px){

/* GENERAL */

.sp-section{
padding:20px 0;
}

.sp-section-title{
font-size:24px;
line-height:1.2;
padding-bottom:14px;
gap:10px;
}

.sp-section-title:after{
width:80px;
height:4px;
}

.sp-section-sub{
font-size:14px;
line-height:1.7;
margin-bottom:26px;
gap:10px;
}

.sp-section-sub:before{
width:24px;
height:24px;
font-size:11px;
}

.sp-section-sub{
font-size:15px;
line-height:1.7;
margin-bottom:28px;
}

/* =========================
MOBILE HERO OPTIMIZED
========================= */

/* hero */
.sp-hero{
padding:4px 0 12px;
}

/* compact slider */
.sp-slider{
height:260px;
border-radius:20px;
}

/* better image focus */
.sp-slide-bg img{
object-position:center top;
}

/* overlay */
.sp-slide-overlay{
background:
linear-gradient(
180deg,
rgba(15,23,42,.55) 0%,
rgba(15,23,42,.28) 35%,
rgba(15,23,42,.82) 100%
);
}

/* content */
.sp-slide-content{
left:62px;
right:62px;
bottom:20px;

max-width:none;
}

/* badge */
.sp-slide-badge{
padding:6px 11px;

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

margin-bottom:10px;

border-radius:999px;
}

/* title */
.sp-slide-content h2{
font-size:20px;
line-height:1.22;
font-weight:800;

letter-spacing:-.8px;

margin-bottom:8px;

max-width:92%;
}

/* subtitle */
.sp-slide-content p{
font-size:12px;
line-height:1.65;

margin:0 0 14px;

color:#e2e8f0;

display:-webkit-box;
-webkit-line-clamp:2;
-webkit-box-orient:vertical;

overflow:hidden;
}

/* button */
.sp-slide-btn{
height:40px;

padding:0 15px;

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

border-radius:13px;

margin-left:0;
}

/* arrows */
.sp-slide-arrow{
width:34px;
height:34px;

font-size:20px;

backdrop-filter:blur(6px);

top:50%;
transform:translateY(-50%);
}

/* positions */
.sp-slide-arrow.prev{
left:12px;
}

.sp-slide-arrow.next{
right:12px;
}

/* nav */
.sp-slide-nav{
gap:8px;
margin-top:10px;
padding-bottom:2px;
}

/* nav item */
.sp-slide-nav-item{
padding:9px 13px;

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

border-radius:12px;
}

.sp-feature-slider{
height:auto;
}

/* card */
.sp-feature-card{
padding:20px;
border-radius:22px;
}

/* label */
.sp-feature-label{
font-size:10px;
padding:7px 11px;
margin-bottom:14px;
}

/* store */
.sp-feature-store{
gap:12px;
margin-bottom:16px;
}

/* logo */
.sp-feature-store img{
width:50px;
height:50px;

padding:8px;

border-radius:16px;
}

/* name */
.sp-feature-store h4{
font-size:14px;
}

/* small */
.sp-feature-store small{
font-size:11px;
}

/* title */
.sp-feature-title{
font-size:17px;
line-height:1.4;

margin-bottom:10px;
}

/* desc */
.sp-feature-desc{
font-size:13px;
line-height:1.7;
min-height:0;
margin-bottom:18px;

-webkit-line-clamp:3;
}

/* button */
.sp-feature-btn{
height:46px;

font-size:13px;

border-radius:14px;
}

/* nav */
.sp-feature-nav{
gap:8px;
margin-top:10px;
}

/* nav item */
.sp-feature-nav-item{
padding:9px 12px;

font-size:11px;

border-radius:12px;
}

/* =========================
LAYOUT
========================= */

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

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

.sp-seo{
padding:35px 26px;
}

/* =========================
SLIDER ARROWS
========================= */

.sp-mobile-swipe-arrow{
position:absolute;

top:50%;

transform:translateY(-50%);

width:46px;
height:46px;

border-radius:50%;

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

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

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

z-index:30;

cursor:pointer;

transition:
opacity .25s ease,
transform .25s ease;

animation:
spSwipeFloat 1.8s ease-in-out infinite;
}

/* positions */
.sp-mobile-swipe-arrow.left{
left:10px;
}

.sp-mobile-swipe-arrow.right{
right:10px;
}

/* icon */
.sp-mobile-swipe-arrow i{
font-size:16px;
color:#2563eb;
}

/* hidden */
.sp-mobile-swipe-arrow.hidden{
opacity:0;
pointer-events:none;
}

/* tap */
.sp-mobile-swipe-arrow:active{
transform:
translateY(-50%)
scale(.94);
}

/* =========================
POPULAR OFFERS SLIDER
========================= */

.sp-offer-grid{
display:flex !important;

grid-template-columns:none !important;

gap:18px;

overflow-x:auto;
overflow-y:hidden;

padding-bottom:10px;

scroll-snap-type:x mandatory;

-webkit-overflow-scrolling:touch;

scrollbar-width:none;
}

.sp-offer-grid::-webkit-scrollbar{
display:none;
}

.sp-offer-card{
min-width:84vw;
width:84vw;

flex-shrink:0;

scroll-snap-align:start;
}

/* =========================
TOP COUPONS SLIDER
========================= */

.sp-home-grid{
display:flex !important;

grid-template-columns:none !important;

gap:18px;

overflow-x:auto;
overflow-y:hidden;

padding-bottom:10px;

scroll-snap-type:x mandatory;

-webkit-overflow-scrolling:touch;

scrollbar-width:none;
}

.sp-home-grid::-webkit-scrollbar{
display:none;
}

/* wrappers */
.sp-home-grid > *{
width:84vw !important;
min-width:84vw !important;
max-width:84vw !important;

flex-shrink:0;

scroll-snap-align:start;
}

/* coupon card */
.sp-home-grid .sp-coupon-card{
width:100% !important;
max-width:100% !important;
min-width:unset !important;
}

/* smooth */
.sp-home-grid,
.sp-offer-grid{
scroll-behavior:smooth;
}

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

.sp-category-card {
    padding: 24px;
}

.sp-category-card h3 {
    font-size: 17px;
    font-weight: 700;
}

.sp-container {
    padding: 0 10px;
}

.sp-trust-bar{
margin-top:30px;
}

/* =========================
SLIDER ARROWS
========================= */

.sp-mobile-swipe-arrow{
position:absolute;

top:50%;

transform:translateY(-50%);

width:46px;
height:46px;

border-radius:50%;

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

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

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

z-index:30;

cursor:pointer;

transition:
opacity .25s ease,
transform .25s ease;

animation:
spSwipeFloat 1.8s ease-in-out infinite;
}

/* positions */
.sp-mobile-swipe-arrow.left{
left:10px;
}

.sp-mobile-swipe-arrow.right{
right:10px;
}

/* icon */
.sp-mobile-swipe-arrow i{
font-size:16px;
color:#2563eb;
}

/* hidden */
.sp-mobile-swipe-arrow.hidden{
opacity:0;
pointer-events:none;
}

/* hover */
.sp-mobile-swipe-arrow:active{
transform:
translateY(-50%)
scale(.94);
}

.sp-seo-premium{
padding:34px 22px;
border-radius:28px;
}

.sp-seo-title{
font-size:18px;
margin-left: 0;
text-align: left;
}

.sp-seo-sub{
font-size:16px;
line-height:1.8;
margin-bottom:26px;
}

.sp-seo-content{
grid-template-columns:1fr;
gap:18px;
margin-bottom:28px;
}

.sp-seo-content p{
font-size:14px;
line-height:1.9;
}

.sp-seo-features{
grid-template-columns:1fr;
gap:16px;
}

.sp-seo-feature{
padding:18px;
border-radius:20px;
}

.sp-seo-icon{
width:44px;
height:44px;
font-size:16px;
border-radius:14px;
}

.sp-seo-feature h4{
font-size:16px;
margin-top:0;
}

.sp-section-head{

flex-direction:column;
gap:18px;

}

.sp-section-head .sp-section-sub{

max-width:100%;

text-align:left;
justify-content:flex-start;

}

.sp-trust-box {
padding: 20px;
}

.sp-trust-box h3 {
font-size: 20px;
}

.sp-trust-box p {
font-size: 14px;
}

}

/* =========================
SECTION HEAD
========================= */
/*
.sp-section-head{
display:flex;
align-items:flex-end;
justify-content:space-between;
gap:20px;
}
*/

.sp-store-view-all-top{
font-size:14px;
font-weight:800;
color:#2563eb;
text-decoration:none;
}

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

.sp-premium-store-grid{
display:grid;

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

grid-template-rows:
repeat(2,180px);

gap:20px;
}

/* =========================
FEATURED
========================= */

.sp-premium-featured-store{
grid-row:1 / span 2;

position:relative;

border-radius:32px;

overflow:hidden;

text-decoration:none;

display:flex;
flex-direction:column;
justify-content:flex-end;

padding:34px;

isolation:isolate;

background:#0f172a;

min-height:380px;

transition:
transform .35s ease,
box-shadow .35s ease;

box-shadow:
0 20px 50px rgba(15,23,42,.18);
}

.sp-premium-featured-store:hover{
transform:translateY(-6px);
}

.sp-premium-bg{
position:absolute;
inset:0;
z-index:-3;
}

.sp-premium-bg img{
width:100%;
height:100%;
object-fit:cover;
}

.sp-premium-overlay{
position:absolute;
inset:0;

background:
linear-gradient(
180deg,
rgba(15,23,42,.15) 0%,
rgba(15,23,42,.82) 100%
);

z-index:-2;
}

/* =========================
FEATURED CONTENT
========================= */

.sp-premium-content{
display:flex;
flex-direction:column;
align-items:flex-start;
justify-content:flex-end;

width:100%;
height:100%;

position:relative;
z-index:5;

color:#fff;
}

/* badge */
.sp-premium-badge{
display:inline-flex;
align-items:center;

padding:10px 16px;

border-radius:999px;

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

backdrop-filter:blur(14px);

color:#fff;

font-size:11px;
font-weight:900;

letter-spacing:.5px;

margin-bottom:18px;
}

/* logo */
.sp-premium-logo{
width:96px;
height:96px;

border-radius:28px;

background:#fff;

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

padding:18px;

margin-bottom:22px;

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

.sp-premium-logo img{
width:100%;
height:100%;
object-fit:contain;
}

/* title */
.sp-premium-content h3{
font-size:24px;
font-weight:900;

line-height:1.15;

margin:0 0 14px;
}

/* stats */
.sp-premium-stats{
display:flex;
align-items:center;
gap:12px;
flex-wrap:wrap;
color:#c6dcdd;
font-size:15px;
font-weight:700;

opacity:.96;

margin-bottom:28px;
}

.sp-premium-stats strong{
font-weight:900;
}

.sp-premium-stats span{
opacity:.5;
}

/* button */
.sp-premium-btn{
display:inline-flex;
align-items:center;
justify-content:center;

height:54px;
padding:0 24px;

border-radius:18px;

background:#fff;
color:#111827;

font-size:14px;
font-weight:900;

box-shadow:
0 12px 30px rgba(255,255,255,.15);
}

/* =========================
MINI STORE CARD
========================= */

.sp-mini-store-card{
background:#fff;

border-radius:28px;

padding:24px 18px;

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

text-align:center;

text-decoration:none;

position:relative;
overflow:hidden;

min-height:180px;

transition:
transform .28s ease,
box-shadow .28s ease;

box-shadow:
0 12px 30px rgba(15,23,42,.05);
}

.sp-mini-store-card:hover{
transform:translateY(-5px);

box-shadow:
0 22px 45px rgba(15,23,42,.10);
}

/* hover background */
.sp-mini-store-card:before{
content:'';

position:absolute;

left:0;
bottom:0;

width:100%;
height:58%;

background:
linear-gradient(
180deg,
rgba(219,234,254,.06) 0%,
rgba(147,197,253,.16) 45%,
rgba(59,130,246,.22) 100%
);

transform:translateY(100%);

transition:.38s ease;

z-index:0;
}

.sp-mini-store-card:hover:before{
transform:translateY(0);
}

/* =========================
LOGO
========================= */

.sp-mini-store-logo{
width:96px;
height:96px;

border-radius:28px;

background:#fff;

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

padding:16px;

border:1px solid #eef2f7;

position:relative;
z-index:2;

margin-bottom:18px;

box-shadow:
0 12px 28px rgba(15,23,42,.06);
}

.sp-mini-store-logo img{
max-width:100%;
max-height:100%;

object-fit:contain;

transition:transform .32s ease;
}

.sp-mini-store-card:hover
.sp-mini-store-logo img{
transform:scale(1.08);
}

/* =========================
INFO
========================= */

.sp-mini-store-info{
position:relative;
z-index:2;
}

.sp-mini-store-info h4{
display:flex;
align-items:center;
justify-content:center;
gap:8px;
flex-wrap:wrap;

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

color:#0f172a;

margin:0;

line-height:1.5;
}

.sp-mini-store-info span{
color:#94a3b8;
font-weight:600;
}

/* =========================
ARROW
========================= */

.sp-mini-arrow{
position:absolute;

top:16px;
right:16px;

font-size:18px;
font-weight:900;

color:#2563eb;

opacity:0;

transform:
translate(-4px,4px);

transition:.28s ease;

z-index:3;
}

.sp-mini-store-card:hover .sp-mini-arrow{
opacity:1;

transform:
translate(0,0);
}

/* =========================
VIEW ALL
========================= */

.sp-view-all-store{
background:
linear-gradient(
135deg,
#2563eb,
#0ea5e9
);
}

.sp-view-all-store h4,
.sp-view-all-store span,
.sp-view-all-store .sp-mini-arrow{
color:#fff;
}

.sp-view-all-store .sp-mini-store-info span{
background:
rgba(255,255,255,.14);
}

.sp-view-all-icon{
width:96px;
height:96px;

border-radius:28px;

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

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

font-size:42px;
font-weight:300;

color:#fff;

margin-bottom:18px;
}

/* =========================
VIEW ALL
========================= */

.sp-view-all-store{
background:
linear-gradient(
135deg,
#2563eb,
#0ea5e9
);
}

.sp-view-all-store h4,
.sp-view-all-store span,
.sp-view-all-store .sp-mini-arrow{
color:#fff;
}

.sp-view-all-icon{
width:64px;
height:64px;

border-radius:20px;

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

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

font-size:32px;
font-weight:300;

color:#fff;
}

/* =========================
TABLET
========================= */

@media(max-width:1100px){

.sp-premium-store-grid{
grid-template-columns:
1fr 1fr 1fr;

grid-template-rows:auto;
}

.sp-premium-featured-store{
grid-column:1 / -1;
grid-row:auto;

min-height:320px;
}

}

/* =========================
MOBILE
========================= */

@media(max-width:768px){

.sp-section-head{
flex-direction:column;
align-items:flex-start;
}

.sp-premium-store-grid{
grid-template-columns:repeat(2,1fr);
gap:14px;
}

.sp-view-all-icon {
width: 34px;
height: 34px;
font-size: 16px;
}

.sp-premium-featured-store{
grid-column:1 / -1;
min-height:280px;

padding:24px;

border-radius:26px;
}

.sp-premium-content h3{
font-size:24px;
}

.sp-premium-content p{
font-size:13px;
line-height:1.7;
}

.sp-premium-logo{
width:64px;
height:64px;

border-radius:18px;
}

.sp-mini-store-card{
padding:16px;
min-height: 130px;
border-radius:20px;
}

.sp-mini-store-logo{
width:68px;
height:68px;

min-width:68px;

border-radius:18px;

padding:12px;
}

.sp-mini-store-info h4{
font-size:13px;
gap:6px;
}

}

/* =========================
CATEGORY CARD
========================= */

.sp-category-card{
position:relative;
overflow:hidden;
border-radius:28px;
padding:32px;
background:
linear-gradient(
135deg,
#eff6ff,
#dbeafe
);
transition:.25s;
}

/* variations */
.sp-category-card:nth-child(2n){
background:
linear-gradient(
135deg,
#fdf2f8,
#fce7f3
);
}

.sp-category-card:nth-child(3n){
background:
linear-gradient(
135deg,
#ecfeff,
#cffafe
);
}

.sp-category-card:nth-child(4n){
background:
linear-gradient(
135deg,
#f0fdf4,
#dcfce7
);
}

.sp-category-card:nth-child(5n){
background:
linear-gradient(
135deg,
#fff7ed,
#ffedd5
);
}

.sp-category-card:nth-child(6n){
background:
linear-gradient(
135deg,
#f5f3ff,
#ede9fe
);
}

.sp-category-card:hover{
transform:translateY(-4px);
box-shadow:
0 18px 40px rgba(15,23,42,.08);
}

/* =========================
HOME DEALS
========================= */

.sp-home-deal-grid{

display:grid;

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

gap:22px;

}

.sp-home-deal-view-all{

background:#fff;

border:2px dashed #dbeafe;

border-radius:28px;

padding:30px;

display:flex;

flex-direction:column;

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

text-align:center;

text-decoration:none;

transition:.25s;

}

.sp-home-deal-view-all:hover{

border-color:#2563eb;

transform:translateY(-4px);

}

.sp-home-deal-view-icon{

width:70px;
height:70px;

border-radius:50%;

background:#eff6ff;

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

font-size:32px;
font-weight:900;

color:#2563eb;

margin-bottom:18px;

}

.sp-home-deal-view-all h3{

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

margin-bottom:10px;

color:#0f172a;

}

.sp-home-deal-view-all p{

font-size:14px;

line-height:1.6;

color:#64748b;

margin-bottom:16px;

}

.sp-home-deal-view-link{

font-weight:700;

color:#2563eb;

}

@media(max-width:1100px){

.sp-home-deal-grid{

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

}

}

@media(max-width:768px){

.sp-home-deal-grid{

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

}

}