:root{
  --purple-dk:#18233D;
  --purple:#5B4FE9;
  --pink:#FF5B8D;
  --pink-dk:#E64275;
  --grad:linear-gradient(135deg,#18233D 0%,#5B4FE9 62%,#FF5B8D 100%);
  --ink:#18233D;
  --ink-soft:#667085;
  --muted:#98A2B3;
  --border:#E5E7EB;
  --bg:#F8FAFC;
  --surface-2:#F4F5FF;
  --success:#10B981;
  --radius:14px;
  --maxw:1220px;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{font-family:'Poppins', sans-serif; color:var(--ink); background:var(--bg); -webkit-font-smoothing:antialiased; letter-spacing:-0.005em;}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
ul{list-style:none;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 32px;}
h1,h2,h3,h4{font-weight:700; line-height:1.15;}

.announce{background:var(--purple-dk); color:#fff; text-align:center; font-size:13.5px; padding:10px 0;}
.announce a{text-decoration:underline; font-weight:600; margin-left:6px; color:#fff;}

header{background:rgba(255,255,255,.98); position:sticky; top:0; z-index:50; border-bottom:1px solid var(--border); box-shadow:0 4px 18px rgba(24,35,61,.05); backdrop-filter:blur(10px);}
nav.wrap{display:flex; align-items:center; justify-content:space-between; height:88px; gap:24px;}
.logo{display:flex; align-items:center; gap:10px; font-weight:800; font-size:22px; color:var(--ink);}
.logo .mark{width:34px; height:34px; border-radius:9px; background:var(--purple); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:800; font-size:18px; flex:none;}
.nav-links{display:flex; gap:32px; font-size:15px; font-weight:600;}
.nav-links a{color:var(--ink); opacity:.9;}
.nav-links a:hover{opacity:1; color:var(--purple);}
.search-bar{display:flex; align-items:center; background:#fff; border:1px solid var(--border); border-radius:12px; overflow:hidden; flex:1; max-width:440px; box-shadow:0 4px 14px rgba(24,35,61,.04);}
.search-bar input{flex:1; border:none; outline:none; padding:13px 16px; font-family:'Poppins'; font-size:13.5px; color:var(--ink); background:none;}
.search-bar input::placeholder{color:var(--muted);}
.search-bar button{background:var(--purple); border:none; color:#fff; width:46px; height:46px; flex:none; display:flex; align-items:center; justify-content:center; cursor:pointer; font-size:16px;}

.breadcrumb{padding:20px 0 0; font-size:13px; color:var(--muted);}
.breadcrumb a{color:var(--ink-soft); font-weight:500;}
.breadcrumb a:hover{color:var(--pink);}
.breadcrumb span{margin:0 6px;}

section{padding:52px 0;}
.sec-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:28px;}
.sec-head h2{font-size:30px; position:relative; padding-bottom:12px;}
.sec-head h2::after{content:''; position:absolute; left:0; bottom:0; width:52px; height:4px; background:var(--pink); border-radius:4px;}

/* hero */
.hero{padding:34px 0 20px;}
.hero-slide{background:var(--grad); border-radius:24px; padding:60px 68px; position:relative; min-height:320px; display:flex; align-items:center; overflow:hidden;}
.hero-slide::before{content:''; position:absolute; right:0; top:0; bottom:0; width:52%; background:url('https://picsum.photos/seed/clhero1/700/500') center/cover no-repeat; opacity:0.9;}
.hero-slide::after{content:''; position:absolute; inset:0; background:linear-gradient(90deg, var(--purple-dk) 0%, var(--purple-dk) 30%, rgba(24,35,61,.16) 55%, rgba(255,91,141,.10) 100%), radial-gradient(circle at 78% 30%, rgba(255,255,255,0.10), transparent 55%);}
.hero-card{background:#fff; border-radius:18px; padding:34px 32px; max-width:370px; position:relative; z-index:2; box-shadow:0 24px 48px rgba(11,37,69,0.28);}
.hero-badge{display:inline-block; background:var(--purple-dk); color:#fff; font-weight:700; font-size:14px; padding:9px 18px; border-radius:8px; margin-bottom:18px;}
.hero-card h2{font-size:28px; margin-bottom:22px;}
.hero-card a.cta{color:var(--pink); font-weight:700; font-size:14px; display:inline-flex; align-items:center; gap:8px; border-bottom:2px solid var(--pink); padding-bottom:2px;}
.disclosure{background:var(--surface-2); text-align:center; padding:16px; border-radius:12px; font-size:13.5px; color:var(--ink-soft); margin:24px 0 8px;}

/* store cards (fashion / featured stores) */
.card-row{display:grid; grid-template-columns:repeat(4,1fr); gap:20px;}
.store-card{border:1px solid var(--border); border-radius:14px; overflow:hidden; background:#fff; transition:box-shadow .2s ease, transform .2s ease;}
.store-card:hover{transform:translateY(-4px); box-shadow:0 18px 32px rgba(24,35,61,.10);}
.store-card .logo-box{height:130px; display:flex; align-items:center; justify-content:center; background:var(--surface-2); font-weight:800; font-size:19px; color:var(--purple-dk); padding:14px; position:relative; overflow:hidden;}
.store-card .logo-box img{max-height:80px; position:relative; z-index:2;}
.store-card .logo-box img.bg{position:absolute; inset:0; width:100%; height:100%; max-height:none; object-fit:cover; z-index:1;}
.store-card .card-body{padding:18px 20px 22px;}
.store-card .card-body p{font-weight:600; font-size:15px; margin-bottom:14px; min-height:44px;}
.shop-now{color:var(--purple-dk); font-weight:700; font-size:13.5px; display:inline-flex; align-items:center; gap:8px; border-bottom:2px solid var(--pink); padding-bottom:2px;}

/* brand grid */
.brand-grid{display:grid; grid-template-columns:repeat(6,1fr); gap:16px;}
.brand-box{border:1px solid var(--border); border-radius:14px; height:110px; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:14px; color:var(--purple-dk); text-align:center; padding:10px;}

.wallet-banner{background:var(--grad); border-radius:20px; padding:56px 60px; color:#fff; margin-top:44px; display:flex; align-items:center; justify-content:space-between; overflow:hidden; position:relative; min-height:160px;}
.wallet-banner::before{content:''; position:absolute; right:0; top:0; bottom:0; width:44%; background:url('https://picsum.photos/seed/clwallet1/600/400') center/cover no-repeat; opacity:0.85;}
.wallet-banner::after{content:''; position:absolute; inset:0; background:linear-gradient(90deg, var(--purple-dk) 0%, var(--purple-dk) 34%, rgba(24,35,61,.10) 62%, transparent 100%);}
.wallet-banner h2{font-size:34px; color:#fff; max-width:400px; position:relative; z-index:2;}

/* category strip */
.cat-strip{background:var(--grad); border-radius:16px; padding:22px 28px; display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap;}
.cat-item{display:flex; align-items:center; gap:14px; color:#fff;}
.cat-item .icon{width:48px; height:48px; border-radius:12px; background:rgba(255,255,255,0.16); display:flex; align-items:center; justify-content:center; font-weight:800; font-size:15px; flex:none; overflow:hidden;}
.cat-item .icon img{width:100%; height:100%; object-fit:cover;}
.cat-item span{font-weight:700; font-size:14px; line-height:1.25;}
.all-stores-btn{background:var(--purple-dk); color:#fff; font-weight:700; font-size:14px; padding:12px 22px; border-radius:9px; flex:none;}

/* product row (e.g. fitness trackers style banner cards) */
.product-row{display:grid; grid-template-columns:repeat(4,1fr); gap:20px;}
.product-card{position:relative; border-radius:16px; overflow:hidden; height:220px; display:flex; align-items:flex-end; background:var(--surface-2);}
.product-card .ph{position:absolute; inset:0; background-size:cover; background-position:center;}
.product-card .ph::after{content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(18,32,58,0) 40%, rgba(18,32,58,0.85) 100%);}
.product-card .pc-content{position:relative; z-index:2; padding:18px; color:#fff;}
.product-card .pc-content p{font-weight:700; font-size:14.5px; margin-bottom:10px; line-height:1.3;}
.product-card .pc-content a{color:#fff; font-weight:700; font-size:13px; display:inline-flex; align-items:center; gap:6px; border-bottom:2px solid var(--pink); padding-bottom:2px;}

/* travel style cards */
.travel-row{display:grid; grid-template-columns:repeat(4,1fr); gap:20px;}
.travel-card{border-radius:14px; overflow:hidden; border:1px solid var(--border);}
.travel-card .ph{height:170px; background-size:cover; background-position:center; position:relative;}
.travel-card .loc{position:absolute; left:12px; top:12px; background:#fff; padding:6px 12px; border-radius:8px; font-size:12px; font-weight:600; display:flex; align-items:center; gap:6px;}
.travel-card .tc-body{padding:16px;}
.travel-card .tc-body h4{font-size:15px; margin-bottom:8px;}
.price-row{display:flex; align-items:center; gap:8px; font-size:14px;}
.price-row .now{color:var(--pink); font-weight:800;}
.price-row .was{color:var(--muted); text-decoration:line-through; font-size:12.5px;}
.stars{color:#F0A93B; font-size:12.5px; margin-left:auto;}

/* top picks */
.picks-wrap{position:relative; background:var(--surface-2); border-radius:22px; padding:60px 40px 40px;}
.picks-title{position:absolute; top:-24px; left:50%; transform:translateX(-50%) rotate(-3deg); background:var(--pink); color:#fff; font-weight:800; font-size:22px; padding:15px 42px; border-radius:8px; box-shadow:0 14px 30px rgba(255,122,61,0.35);}
.picks-row{display:grid; grid-template-columns:1.3fr 1fr; gap:22px;}
.pick-main{border-radius:16px; overflow:hidden; position:relative; height:100%; min-height:320px; background:var(--ink);}
.pick-main .ph{position:absolute; inset:0; background:url('https://picsum.photos/seed/clfitness1/700/500') center/cover no-repeat; display:flex; align-items:flex-end; justify-content:flex-start;}
.pick-main .ph::after{content:''; position:absolute; inset:0; background:linear-gradient(0deg, rgba(18,32,58,0.85), rgba(18,32,58,0.1) 60%);}
.pick-main .ph span{color:#fff; font-weight:800; font-size:24px; text-align:left; padding:28px; position:relative; z-index:2;}
.pick-side{display:flex; flex-direction:column; gap:22px;}
.pick-item{display:flex; gap:14px; background:#fff; border-radius:14px; overflow:hidden; border:1px solid var(--border);}
.pick-item .thumb{width:120px; flex:none; background-size:cover; background-position:center;}
.pick-item .pi-body{padding:14px 16px 14px 0;}
.pick-item .tag{color:var(--pink); font-weight:700; font-style:italic; font-size:12px; margin-bottom:6px;}
.pick-item h4{font-size:14px; line-height:1.35;}

/* maximize savings */
.save-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:24px; text-align:center;}
.save-item .icon{width:76px; height:76px; border-radius:50%; background:var(--surface-2); color:var(--pink); display:flex; align-items:center; justify-content:center; margin:0 auto 18px; font-size:26px; font-weight:800;}
.save-item h4{font-size:16px; margin-bottom:12px;}
.save-item p{font-size:13px; color:var(--ink-soft); line-height:1.6;}

/* FAQ */
.faq-banner{background:var(--pink); border-radius:20px 20px 0 0; padding:30px; text-align:center;}
.faq-banner h2{color:#fff; font-size:28px; position:relative; display:inline-flex; align-items:center; gap:18px;}
.faq-banner h2 .line{width:44px; height:3px; background:#fff; border-radius:3px;}
.faq-body{background:var(--surface-2); border-radius:0 0 20px 20px; padding:10px 40px 30px;}
.faq-body .faq-item{border-bottom:1px solid var(--border); padding:22px 0; background:none; box-shadow:none; margin:0; display:block;}
.faq-body .faq-item summary{list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; font-weight:700; font-size:15.5px;}
.faq-body .faq-item summary::-webkit-details-marker{display:none;}
.faq-toggle{width:34px; height:34px; border-radius:9px; background:var(--purple); color:#fff; flex:none; display:flex; align-items:center; justify-content:center; font-size:17px; font-weight:700; box-shadow:0 2px 6px rgba(24,35,61,.07);}
.faq-body .faq-item p{margin-top:14px; color:var(--ink-soft); font-size:14px; max-width:760px; line-height:1.6;}

/* offer / deal cards (grid variant on homepage) */
.deal-row{display:grid; grid-template-columns:repeat(4,1fr); gap:20px;}
.deal-row .offer-card{flex-direction:column; align-items:flex-start; gap:12px;}
.deal-row .offer-card .offer-btn{width:100%; text-align:center;}

/* offer card (list variant on store page) */
.cl-sortbar{display:flex; align-items:center; justify-content:flex-end; gap:10px; margin:20px 0 16px; padding:0 2px;}
.cl-sortbar label{font-size:14px; color:var(--ink-soft); font-weight:600;}
.cl-sortbar select{appearance:none; -webkit-appearance:none; min-width:160px; padding:10px 38px 10px 13px; border:1px solid #D9DDEA; border-radius:10px; background:#fff; color:var(--ink); font:600 13px 'Poppins',sans-serif; cursor:pointer; box-shadow:0 3px 10px rgba(24,35,61,.04); background-image:linear-gradient(45deg,transparent 50%,#667085 50%),linear-gradient(135deg,#667085 50%,transparent 50%); background-position:calc(100% - 17px) 14px,calc(100% - 12px) 14px; background-size:5px 5px,5px 5px; background-repeat:no-repeat;}
.cl-sortbar select:focus{outline:none; border-color:var(--purple); box-shadow:0 0 0 3px rgba(91,79,233,.12);}
.offer-card{background:#fff; border:1px solid var(--border); border-radius:16px; padding:22px 24px; display:flex; align-items:center; gap:22px; margin-bottom:16px; transition:box-shadow .2s ease, transform .2s ease;}
.offer-card:hover{box-shadow:0 14px 28px rgba(24,35,61,.07); transform:translateY(-2px);}
.offer-logo{width:88px; height:64px; flex:none; border-radius:10px; background:var(--surface-2); display:flex; align-items:center; justify-content:center; font-weight:800; font-size:13px; color:var(--purple-dk); overflow:hidden;}
.offer-logo img{max-width:80%; max-height:80%;}
.offer-mid{flex:1;}
.offer-mid h4{font-size:17px; margin-bottom:10px;}
.offer-meta{display:flex; align-items:center; gap:18px; font-size:13px; color:var(--ink-soft); flex-wrap:wrap;}
.offer-meta .m-item{display:flex; align-items:center; gap:6px;}
.m-icon{width:20px; height:20px; border-radius:50%; background:var(--pink); color:#fff; display:flex; align-items:center; justify-content:center; font-size:11px; flex:none;}
.m-icon.ok{background:var(--success);}
.offer-btn{flex:none; background:var(--pink); color:#fff; font-weight:700; font-size:13.5px; padding:13px 26px; border-radius:10px; border:none; cursor:pointer; transition:background .18s ease;}
.offer-btn:hover{background:var(--pink-dk);}
.offer-card:target{outline:2px solid var(--pink); outline-offset:4px;}

/* store single page layout */
.store-page{padding:24px 0 60px;}
.store-layout{display:grid; grid-template-columns:300px 1fr; gap:28px; align-items:start;}
.side-card{background:#fff; border:1px solid var(--border); border-radius:18px; padding:26px; box-shadow:0 4px 18px rgba(24,35,61,.05);}
.store-logo-box{height:150px; border-radius:14px; background:var(--surface-2); display:flex; align-items:center; justify-content:center; font-weight:800; font-size:26px; color:var(--purple-dk); margin-bottom:26px;}
.side-card h3{font-size:16px; margin-bottom:16px;}
.mini-store-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-bottom:22px;}
.mini-store{height:64px; border:1px solid var(--border); border-radius:10px; display:flex; align-items:center; justify-content:center; font-size:10.5px; font-weight:700; color:var(--ink-soft); text-align:center; padding:6px; overflow:hidden; position:relative;}
.mini-store img{max-width:100%; max-height:100%; position:relative; z-index:2;}
.mini-store img{max-width:100%; max-height:100%;}
.offer-count-row{display:flex; align-items:center; justify-content:space-between; border-top:1px solid var(--border); padding-top:18px; margin-top:4px;}
.offer-count-row span:first-child{font-size:14px; color:var(--ink-soft);}
.offer-count-row span:last-child{font-size:22px; font-weight:800; color:var(--pink);}
.store-title-card{background:#fff; border:1px solid var(--border); border-radius:18px; padding:28px 32px; margin-bottom:20px; box-shadow:0 8px 26px rgba(24,35,61,.05);}
.store-title-card h1{letter-spacing:-.03em;}
.store-title-card p{color:var(--ink-soft);}
.store-title-card h1{font-size:30px;}

/* newsletter + footer */
.newsletter{background:var(--grad); border-radius:20px; padding:60px 50px; text-align:center; color:#fff;}
.newsletter h2{font-size:28px; color:#fff; margin-bottom:26px;}
.nl-form{display:flex; max-width:640px; margin:0 auto 20px; background:#fff; border-radius:10px; overflow:hidden;}
.nl-form input{flex:1; border:none; outline:none; padding:16px 18px; font-family:'Poppins'; font-size:14px;}
.nl-form button{background:var(--purple-dk); border:none; color:#fff; width:56px; display:flex; align-items:center; justify-content:center; cursor:pointer; font-size:17px;}
.captcha{max-width:280px; margin:0 auto; background:#fff; border-radius:8px; padding:14px 16px; display:flex; align-items:center; gap:10px; color:var(--ink); font-size:13px;}
.foot-links{display:flex; justify-content:space-between; gap:30px; margin-top:50px; flex-wrap:wrap; text-align:left;}
.foot-col h5{font-size:14px; margin-bottom:16px; letter-spacing:.03em;}
.foot-col ul li{margin-bottom:10px;}
.foot-col ul li a{font-size:13.5px; color:rgba(255,255,255,0.82);}
.foot-col ul li a:hover{color:#fff; text-decoration:underline;}
footer{padding:26px 0; text-align:center; font-size:12.5px; color:var(--muted);}
.footer-policy{display:flex; justify-content:center; gap:26px; flex-wrap:wrap; margin-bottom:14px;}
.footer-policy a{color:var(--ink-soft); font-size:13px;}
.footer-policy a:hover{color:var(--pink);}

/* ---------------------------------------------------------
   OFFER POPUP MODAL (Get Code / Get Deal)
--------------------------------------------------------- */
.cl-modal-backdrop{
  position:fixed; inset:0; background:rgba(11,37,69,0.55); z-index:999;
  display:flex; align-items:center; justify-content:center; padding:20px;
  opacity:0; animation:clFadeIn .18s ease forwards;
}
@keyframes clFadeIn{ to{ opacity:1; } }
.cl-modal{
  background:#fff; border-radius:18px; max-width:480px; width:100%;
  box-shadow:0 30px 60px rgba(11,37,69,0.35); overflow:hidden;
  transform:translateY(12px); animation:clSlideUp .2s ease forwards;
}
@keyframes clSlideUp{ to{ transform:translateY(0); } }
.cl-modal-head{display:flex; align-items:center; gap:16px; padding:24px 26px; border-bottom:1px solid var(--border); position:relative;}
.cl-modal-logo{width:64px; height:48px; border-radius:8px; background:var(--surface-2); display:flex; align-items:center; justify-content:center; font-weight:800; font-size:12px; color:var(--purple-dk); flex:none; overflow:hidden;}
.cl-modal-logo img{max-width:80%; max-height:80%;}
.cl-modal-head h3{font-size:19px;}
.cl-modal-close{
  position:absolute; top:16px; right:16px; width:32px; height:32px; border-radius:50%;
  background:var(--surface-2); border:none; cursor:pointer; font-size:15px; color:var(--ink-soft);
}
.cl-modal-close:hover{background:var(--border);}
.cl-modal-body{padding:26px;}
.cl-modal-instructions{text-align:center; color:var(--ink-soft); font-size:14px; margin-bottom:20px;}
.cl-code-row{display:flex; align-items:center; background:var(--surface-2); border-radius:10px; overflow:hidden; border:1.5px dashed var(--border);}
.cl-code-row span{flex:1; text-align:center; font-weight:800; font-size:17px; letter-spacing:.03em; padding:14px;}
.cl-code-row button{background:var(--pink); color:#fff; border:none; font-weight:700; font-size:14px; padding:14px 24px; cursor:pointer;}
.cl-code-row button:hover{background:var(--pink-dk);}
.cl-modal-deal-msg{text-align:center; color:var(--ink-soft); font-size:14.5px; line-height:1.6;}
.cl-modal-deal-msg strong{color:var(--ink); display:block; font-size:16px; margin-bottom:8px;}

@media (max-width:980px){
  .card-row, .deal-row, .product-row, .travel-row{grid-template-columns:repeat(2,1fr);}
  .brand-grid{grid-template-columns:repeat(3,1fr);}
  .save-grid{grid-template-columns:repeat(2,1fr);}
  .picks-row{grid-template-columns:1fr;}
  .cat-strip{flex-direction:column; align-items:stretch;}
  .store-layout{grid-template-columns:1fr;}
  .nav-links, .search-bar{display:none;}
  .offer-card{flex-wrap:wrap;}
  .cl-sortbar{justify-content:space-between;}
  .cl-sortbar select{min-width:150px;}
  .foot-links{flex-direction:column;}
}


/* Header store-search dropdown */
.search-bar{position:relative;overflow:visible!important;z-index:1000}
.cl-store-search-results{display:none;position:absolute;left:0;right:0;top:calc(100% + 8px);background:#fff;border:1px solid #e6e4ef;border-radius:14px;box-shadow:0 18px 45px rgba(24,35,61,.14);padding:6px;z-index:9999;max-height:360px;overflow:auto}
.cl-store-search-results.is-open{display:block}
.cl-store-search-item{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:10px;text-decoration:none!important;color:#18233d!important;font-weight:600;font-size:13px}
.cl-store-search-item:hover{background:#f6f4fb}
.cl-store-search-item img,.cl-store-search-initial{width:36px;height:36px;flex:none;border-radius:9px;object-fit:contain;background:#f5f3fa;display:flex;align-items:center;justify-content:center;color:#5b4bb7;font-size:13px;font-weight:800}
.cl-store-search-item span:not(.cl-store-search-initial){flex:1}
.cl-store-search-item b{color:#5b4bb7;font-size:17px}
.cl-store-search-empty{padding:14px 12px;color:#6f7180;font-size:13px;text-align:center}
