.container{max-width:1200px;margin:0 auto;padding:0 16px}
.cpg-wrap{margin:20px 0 60px}
.cpg-breadcrumb{font-size:14px;margin:6px 0 14px;color:#666}
.cpg-breadcrumb a{text-decoration:none}

.cpg-grid{display:grid;grid-template-columns:2fr 1fr;gap:20px}
@media (max-width:992px){.cpg-grid{grid-template-columns:1fr}}

.cpg-card{background:#fff;border-radius:10px;padding:18px;box-shadow:0 6px 18px rgba(0,0,0,.06)}
.cpg-card-head{display:grid;grid-template-columns:170px 1fr;gap:18px}
@media (max-width:680px){.cpg-card-head{grid-template-columns:1fr}}

.cpg-thumb img{width:100%;height:auto;border-radius:12px}
.cpg-thumb--ph{width:100%;height:170px;border-radius:12px;background:#f3f3f3;display:flex;align-items:center;justify-content:center;color:#888}

.cpg-title{font-size:26px;margin:0 0 8px}
.cpg-meta-list{list-style:none;padding:0;margin:0 0 10px}
.cpg-meta-list li{display:flex;gap:8px;align-items:center;margin:6px 0;color:#333}
.cpg-meta-list strong{color:#111}

.cpg-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.cpg-terms{font-size:13px;color:#666}

.cpg-btn{display:inline-block;padding:12px 22px;border-radius:8px;background:#c68b59;color:#fff;text-decoration:none;border:none;cursor:pointer}
.cpg-btn:hover{opacity:.92}
.cpg-btn--block{width:100%;text-align:center}

.cpg-content{margin-top:18px;line-height:1.75;color:#333}

.cpg-sidebar .cpg-widget{background:#fff;border-radius:10px;padding:16px;box-shadow:0 6px 18px rgba(0,0,0,.06);margin-bottom:16px}
.cpg-widget-title{font-size:16px;margin:0 0 10px}
.cpg-store-list{list-style:none;margin:0;padding:0}
.cpg-store-list li{margin:8px 0}
.cpg-store-list a{text-decoration:none;color:#333}
.cpg-store-list a:hover{color:var(--brand-color-v4)}

.cpg-subscribe{display:flex;gap:8px}
.cpg-subscribe input{flex:1;border:1px solid #ddd;border-radius:8px;padding:10px}
.cpg-subscribe button{border:none;border-radius:10px;padding:10px 16px;background-color:var(--brand-color-v4);color:#fff;cursor:pointer}
.cpg-note{display:block;margin-top:8px;color:#666;font-size:12px}

/* Modal */
.cpg-modal[aria-hidden="true"]{display:none}
/* .cpg-modal{position:fixed;inset:0;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;z-index:9999} */
.cpg-modal-box{width:min(520px,92%);background:#fff;border-radius:12px;padding:18px;box-shadow:0 8px 30px rgba(0,0,0,.25)}
.cpg-close{float:right;border:none;background:transparent;font-size:26px;line-height:1;cursor:pointer}
.cpg-code-row{display:flex;gap:8px;margin:16px 0}
.cpg-code-row input{flex:1;border:1px solid #ddd;border-radius:8px;padding:12px 10px;font-size:18px;text-align:center;letter-spacing:.1em}
.cpg-code-row button{border:none;border-radius:8px;padding:12px 16px;background:#222;color:#fff;cursor:pointer}

.cpg-no-scroll{overflow:hidden}
.cpg-widget button:hover{
	background-color:var(--brand-black-color);
}










/* ===== Stores Carousel ===== */
.cpg-stores-carousel{background:#fff;border-radius:12px;padding:18px;margin:18px 0;box-shadow:0 6px 18px rgba(0,0,0,.06)}
.cpg-sc-head{display:flex;align-items:center;gap:10px;margin-bottom:12px}

.cpg-stores-carousel h2{font-size:22px;margin:0}

.cpg-sc-wrap{position:relative}
.cpg-sc-track{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:calc(20% - 12px); /* 5 per view on wide */
  gap:12px;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  padding:6px 44px; /* space for arrows */
}
@media (max-width:1200px){.cpg-sc-track{grid-auto-columns:calc(25% - 12px)}}
@media (max-width:992px){ .cpg-sc-track{grid-auto-columns:calc(33.333% - 12px)}}
@media (max-width:680px){ .cpg-sc-track{grid-auto-columns:calc(50% - 12px)}}
@media (max-width:420px){ .cpg-sc-track{grid-auto-columns:85%}}

.cpg-sc-item{scroll-snap-align:center;text-decoration:none;color:inherit}
.cpg-sc-card{
  background:#fff;border:1px solid #eee;border-radius:12px;
  box-shadow:0 2px 10px rgba(0,0,0,.04);
  padding:14px; text-align:center;
}


.cpg-sc-noimg{
  width:56px;height:56px;border-radius:10px;background:#f1f1f1;display:flex;align-items:center;justify-content:center;
  font-weight:700;color:#666
}
.cpg-sc-name{font-weight:600;margin-bottom:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}


/* arrows */

.cpg-sc-prev{left:6px}
.cpg-sc-next{right:6px}
.cpg-sc-nav:hover{opacity:.9}






/* ===== Stores Carousel (fixed) ===== */
.cpg-stores-carousel{
  background:#fff;border-radius:12px;padding:16px 12px;margin:16px 0 20px;
  box-shadow:0 6px 18px rgba(0,0,0,.06)
}
.cpg-sc-head{display:flex;align-items:center;gap:10px;margin:0 8px 10px}
.cpg-sc-pill{width:6px;height:22px;background:#c68b59;border-radius:4px;display:inline-block}
.cpg-stores-carousel h2{font-size:20px;margin:0;color:#222}

/* wrapper + arrows */
.cpg-sc-wrap{position:relative}
.cpg-sc-nav{
  position:absolute;top:50%;transform:translateY(-50%);
  width:34px;height:34px;border-radius:50%;border:none;background-color:var(--brand-color-v4);color:#fff;cursor:pointer;
  display:flex;align-items:center;justify-content:center;box-shadow:0 2px 10px rgba(0,0,0,.2);z-index:2
}
.cpg-sc-prev{left:4px}
.cpg-sc-next{right:4px}
.cpg-sc-nav[disabled]{opacity:.35;cursor:not-allowed}

/* track now uses flex to avoid grid gaps on few items */
.cpg-sc-track{
  display:flex;gap:12px;align-items:stretch;
  overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;
  padding:6px 44px; /* arrow space */
}
.cpg-sc-track::-webkit-scrollbar{display:none}

/* cards */
.cpg-sc-item{scroll-snap-align:center;text-decoration:none;color:inherit;min-width:200px;max-width:220px;flex:0 0 auto}
@media (max-width:1200px){ .cpg-sc-item{min-width:190px} }
@media (max-width:992px){  .cpg-sc-item{min-width:180px} }
@media (max-width:680px){  .cpg-sc-item{min-width:72%} }
@media (max-width:420px){  .cpg-sc-item{min-width:85%} }

.cpg-sc-card{
  background:#fff;border:1px solid #eee;border-radius:12px;
  box-shadow:0 2px 10px rgba(0,0,0,.04);
  padding:14px; text-align:center; height:100%;
}
.cpg-sc-logo{
  display:flex;align-items:center;justify-content:center;margin-bottom:8px
}

.cpg-sc-noimg{
  width:58px;height:58px;border-radius:10px;background:#f1f1f1;display:flex;align-items:center;justify-content:center;
  font-weight:700;color:#666
}
.cpg-sc-name{font-weight:600;margin-bottom:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#222}
.cpg-sc-badge{background-color:var(--brand-color-v4);border-radius:0 0 10px 10px;padding:5px;font-weight:500;text-align:center;}
.cpg-sc-nav:hover{opacity:.9}




.cpg-sc-logo img{height:100px;object-fit:contain;display:block}
