:root{
  --bg:#0a0b10;
  --card:#12131b;
  --sub:#181a25;
  --text:#f6f7fb;
  --muted:#9aa0aa;
  --primary:#ff8a00;
  --accent:#e52e71;
  --ring: rgba(255,255,255,.14);
  --glass: rgba(255,255,255,.06);
  --shadow: 0 12px 40px rgba(0,0,0,.35);
}

*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{height:100%}
body{
  margin:0;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, "Noto Sans", Arial;
  color:var(--text);
  background:
    radial-gradient(120% 100% at 50% -10%, #131428 0%, #0a0b10 60%);
  line-height:1.45;
}

.header{
  position:sticky;top:0;z-index:20;
  display:flex;align-items:center;gap:12px;
  padding:14px 16px;
  background:rgba(10,11,16,.65);
  backdrop-filter: blur(14px);
  border-bottom:1px solid var(--glass);
}
.header img{width:28px;height:28px;border-radius:8px;box-shadow:var(--shadow)}
.header h1{font-size:18px;margin:0;font-weight:800;letter-spacing:.3px}
.badge{margin-left:auto;font-size:11px;padding:6px 10px;border-radius:999px;border:1px solid var(--ring);color:var(--muted)}

.container{max-width:760px;margin:0 auto;padding:16px 16px 92px}

.card{
  background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.02));
  border:1px solid var(--glass);
  border-radius:22px;
  box-shadow: var(--shadow);
  overflow:hidden;
}

.grid{display:grid;gap:16px}
.grid.cols-2{grid-template-columns:repeat(2,1fr)}

.button,button,.btn{
  appearance:none;border:none;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:14px 18px;border-radius:16px;font-weight:800;letter-spacing:.2px;
  background: linear-gradient(135deg,var(--primary),var(--accent));
  color:white;box-shadow:0 10px 24px rgba(229,46,113,.35);
}
.button.block{width:100%}
.button.ghost{background:transparent;border:1px solid var(--ring);box-shadow:none;color:var(--text)}
.button.muted{background:#151726;color:var(--muted);box-shadow:none}

.notice{
  padding:14px 16px;margin:12px 0;border-radius:14px;
  border:1px dashed var(--ring);
  color:var(--muted);background:rgba(255,255,255,.03);
}
.homepage-cart-sec{
    padding: 0;
    margin: 0;
    list-style-type: none;
}
.Homepage-top-sec {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-pack: justify;
   -ms-flex-pack: justify;
   justify-content: space-between;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
}
.homepage-cart-sec li{
    display: inline;
    position: relative;
}
.bottom-nav{
  position:fixed;left:0;right:0;bottom:0;z-index:40;
  background:rgb(255 255 255 / 14%);
  border-top:1px solid var(--glass);
  backdrop-filter: blur(12px);
  box-shadow: 0 -10px 30px rgba(0,0,0,.35);
}
.tabbar{display:grid;grid-template-columns:repeat(5,1fr)}
.tab{padding:10px 8px;display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--muted);text-decoration:none}
.tab.active{color:white;box-shadow: inset 0px 15px 20px 10px rgb(255 255 255 / 47%)}
.tab .ico{width:22px;height:22px}

.product-card{padding:12px}
.product-card img{width:100%;border-radius:16px;display:block}
.product-card h3{margin:10px 0 6px;font-size:16px}
.product-card p{margin:0;color:var(--muted);font-size:13px}

.reel{
  position:relative;height:72vh;min-height:420px;border-radius:26px;overflow:hidden;background:#000;
  border:1px solid var(--glass);
}
.reel iframe,.reel video{position:absolute;inset:0;width:100%;height:100%}
.reel-ui{position:absolute;inset:0;pointer-events:none}
.reel-actions{position:absolute;right:12px;bottom:14px;display:flex;flex-direction:column;gap:12px;pointer-events:auto}
.fab{
  width:50px;height:50px;border-radius:16px;border:1px solid var(--ring);display:flex;align-items:center;justify-content:center;
  background:rgba(10,11,16,.45);backdrop-filter: blur(8px);color:white;cursor:pointer
}
.fab svg{width:22px;height:22px}

.seek{position:absolute;left:12px;right:12px;bottom:12px;height:4px;border-radius:999px;background:rgba(255,255,255,.2)}
.seek .bar{height:100%;width:0%;background:white;border-radius:999px}

.list{display:flex;flex-direction:column;gap:10px}
.list .row{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border:1px solid var(--glass);border-radius:14px;background:rgba(255,255,255,.03)}
.list .row b{font-size:14px}
.list .row small{color:var(--muted)}

.form{display:flex;flex-direction:column;gap:10px}
.input{padding:12px 14px;border-radius:14px;border:1px solid var(--ring);background:#10121d;color:var(--text)}
input::placeholder,textarea::placeholder{color:#768099}

footer.disclaimer{font-size:12px;color:#9aa0aa;padding:16px;text-align:center;opacity:.9}
.ripple{position:relative;overflow:hidden}
.ripple:after{content:'';position:absolute;inset:0;background:radial-gradient(circle,rgba(255,255,255,.28) 10%, transparent 10.01%) center/0% 0% no-repeat;transition:background-size .6s}
.ripple:active:after{background-size:1200% 1200%}
button {
border: none;
}
.shop-ad-card {
background-repeat: no-repeat;
background-position: top center;
background-size: cover;
padding: 16px;
border-radius: 16px;
margin: 0px 8px 0 8px;

}
.shop-ad-card-img1 {
background-image: url('../../uploads/slides/cap-man-img1.jpg');
}
.shop-ad-card-img2 {
background-image: url('../../uploads/slides/cap-man-img2.jpg');
}
.shop-ad-card-img3 {
background-image: url('../../uploads/slides/cap-man-img3.jpg');
}
.shop-ad-card-img4 {
background-image: url('../../uploads/slides/cap-man-img4.jpg');
}
.shop-ad-card-img5 {
background-image: url('../../uploads/slides/cap-man-img6.jpg');
}
.shop-ad-card-img7 {
background-image: url('../../uploads/slides/cap-man-img7.jpg');
}
.season {
color: var(--1, #FFF);
font-family: "League Spartan";
font-size: 24px;
font-weight: 700;
line-height: 36px;
padding-bottom: 8px;
max-width: 220px;
}
.disc {
color: var(--1, #FFF);
font-family: Jost;
font-size: 14px;
font-weight: 500;
line-height: 20px;
}
.ShopNowBtn a {
margin-top: 32px;
display: inline-block;
}
.shop-card {
position: relative;

}
.shop-card ul.slick-dots {
display: flex;
align-items: center;
gap: 5px;
position: absolute;
right: 12px;
bottom: 0px;
}
.shop-card ul.slick-dots button {
font-size: 0; /* Hide numbers if present */
width: 12px;
height: 12px;
border-radius: 50%;
background-color: #ccc; /* Default dot color */
border: none;
cursor: pointer;
padding: 0;
}
.slick-dots li {
display: inline-block; /* Arrange dots horizontally */
margin: 0 5px; /* Spacing between dots */
}
.shop-card li.slick-active button {
width: 24px;
height: 8px;
background-color: #FFF;
border-radius: 15px;
border: none;
}
.section-main-ver {
padding: 0 12px;
margin-bottom: 20px;
}
.container {
width: 100%;
max-width: 100%;
}