:root{--gold:#f6b800;--black:#090909;--soft:#f6f7f8;--green:#25d366;--muted:#6f6f6f;--radius:24px}
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;font-family:Arial,Helvetica,sans-serif;color:#111;background:#fff}
a{text-decoration:none;color:inherit} .container{width:min(1180px,92%);margin:auto}
.topbar{background:#090909;color:#fff;padding:.72rem 0;font-size:.92rem}
.topbar .container{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}
header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.97);backdrop-filter:blur(10px);border-bottom:1px solid #e8e8e8}
nav{min-height:76px;display:flex;justify-content:space-between;align-items:center;gap:1rem}
.brand{display:flex;align-items:center;gap:.75rem;font-weight:900;font-size:1.25rem}
.brand img{width:58px;height:58px;border-radius:16px;object-fit:cover;background:#000}
.navlinks{display:flex;gap:1.25rem;align-items:center;font-weight:800}
.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:.92rem 1.2rem;font-weight:900}
.btn-wa{background:var(--green);color:#fff}
.hero{background:radial-gradient(circle at 80% 15%,rgba(246,184,0,.25),transparent 28%),linear-gradient(135deg,#090909,#1d1d1f);color:#fff;padding:72px 0}
.hero-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:2.5rem;align-items:center}
.eyebrow{display:inline-block;padding:.48rem .8rem;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);color:#ffe08a;font-weight:900}
h1{font-size:clamp(2.45rem,6vw,5rem);line-height:.98;letter-spacing:-2px;margin:1rem 0}
.hero p{font-size:1.1rem;color:#e4e4e4;max-width:650px;line-height:1.6}
.hero-logo{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);padding:1rem;border-radius:30px}
.hero-logo img{width:100%;display:block;border-radius:22px}
section{padding:68px 0}
.section-title{font-size:clamp(2rem,4vw,3.2rem);margin:0 0 .6rem}
.section-sub{color:var(--muted);margin:0 0 1.6rem}
.catalog-tools{display:flex;gap:.8rem;flex-wrap:wrap;align-items:center;margin-bottom:1.4rem}
.search{flex:1;min-width:240px;padding:1rem 1.1rem;border:1px solid #dcdcdc;border-radius:999px;font-size:1rem}
.filter-btn{border:1px solid #ddd;background:#fff;border-radius:999px;padding:.72rem 1rem;font-weight:800;cursor:pointer}
.filter-btn.active{background:#111;color:#fff;border-color:#111}
.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.15rem}
.product-card{background:#fff;border:1px solid #e8e8e8;border-radius:var(--radius);overflow:hidden;box-shadow:0 10px 28px rgba(0,0,0,.06);display:flex;flex-direction:column}
.product-image{height:245px;background:#fff;display:grid;place-items:center;padding:1rem}
.product-image img{width:100%;height:100%;object-fit:contain}
.product-body{padding:1.15rem;display:flex;flex-direction:column;gap:.75rem;flex:1}
.category-tag{font-size:.75rem;font-weight:900;color:#6a4f00;background:#fff2bd;border-radius:999px;padding:.35rem .65rem;align-self:flex-start;margin-top:2.5rem}
.product-body h3{font-size:1.08rem;line-height:1.3;margin:0}
.price-note{font-weight:900;color:#7B2CBF;margin:auto 0 0}
.wa-button{background:var(--green);color:#fff;border-radius:999px;padding:.82rem .9rem;text-align:center;font-weight:900}
.empty{display:none;text-align:center;padding:2rem;color:#666}
.delivery{background:linear-gradient(135deg,#f6b800,#ffd861);border-radius:30px;padding:2rem;display:grid;grid-template-columns:1.1fr .9fr;gap:2rem;align-items:center}
.delivery h2{font-size:clamp(2rem,4vw,3.2rem);line-height:1.05;margin:0 0 .7rem}
.delivery-box{background:rgba(255,255,255,.86);border-radius:22px;padding:1.3rem;line-height:1.8}
footer{background:#090909;color:#fff;padding:32px 0}
.footer-row{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.float-wa{position:fixed;right:18px;bottom:18px;width:62px;height:62px;border-radius:50%;background:var(--green);color:#fff;display:grid;place-items:center;font-size:1.7rem;box-shadow:0 14px 34px rgba(0,0,0,.28);z-index:70}
@media(max-width:980px){.product-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.hero-grid,.delivery{grid-template-columns:1fr}.navlinks a:not(.btn){display:none}.product-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.topbar .container{justify-content:center;text-align:center}.product-grid{grid-template-columns:1fr 1fr;gap:.75rem}.product-image{height:180px;padding:.65rem}.product-body{padding:.85rem}.product-body h3{font-size:.95rem}.wa-button{font-size:.86rem}.brand span{font-size:1rem}h1{letter-spacing:-1px}}

/* Restored catalog prices and size/type selectors */
.price-note{line-height:1.65}.price-note strong{display:inline-block;margin-bottom:4px}
.variant-picker{display:flex;flex-direction:column;gap:.55rem}.variant-picker label{font-weight:700;color:#1f2937}.variant-select{width:100%;padding:.75rem .85rem;border:1px solid #cbd5e1;border-radius:10px;background:#fff;font:inherit}.variant-price{font-weight:800;color:#0f766e;min-height:1.5em}.wa-button[aria-disabled="true"]{opacity:.55;pointer-events:none}
.variant-selector label{font-weight:700;color:#1f2937}.product-variant{width:100%;padding:.75rem .85rem;border:1px solid #cbd5e1;border-radius:10px;background:#fff;font:inherit}

/* Mobile launch cleanup — Tools + Phone Accessories */
@media (max-width: 760px) {
  body > div:first-child {
    overflow-x: auto;
    overflow-y: hidden;
    justify-content: flex-start !important;
    white-space: nowrap;
    gap: 18px !important;
    padding: 10px 14px !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  body > div:first-child::-webkit-scrollbar { display:none; }
  body > div:first-child a { flex:0 0 auto; font-size:15px; }

  .topbar { padding:.55rem 0; }
  .topbar .container {
    display:grid;
    grid-template-columns:1fr;
    gap:.35rem;
    justify-items:center;
    text-align:center;
    font-size:.84rem;
    line-height:1.35;
  }

  header nav.container {
    min-height:auto;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto auto;
    align-items:center;
    gap:10px;
    padding-top:10px;
    padding-bottom:10px;
  }

  header .brand { min-width:0; gap:.55rem; }
  header .brand img { width:48px; height:48px; border-radius:13px; flex:0 0 auto; }
  header .brand span { font-size:.95rem !important; line-height:1.08; }

  header .navlinks { display:flex; gap:0; }
  header .navlinks a:not(.btn) { display:none !important; }
  header .navlinks .btn { padding:.72rem .9rem; font-size:.9rem; white-space:nowrap; }

  #cartButton {
    margin-left:0 !important;
    gap:5px !important;
    min-width:76px;
    justify-content:flex-end;
  }
  #cartButton > span { font-size:22px !important; }
  #cartButton > div { line-height:1.15 !important; text-align:left; }
  #cartButton > div > div { font-size:13px !important; white-space:nowrap; }

  .hero { padding:42px 0; }
  .hero-grid { display:block !important; }
  .hero-grid > div:first-child { width:100%; }
  .hero-logo { display:none; }
  .hero h1 {
    font-size:clamp(2.15rem,10vw,3rem) !important;
    line-height:1.02 !important;
    letter-spacing:-1px !important;
    margin:.9rem 0 !important;
  }
  .hero p { font-size:1rem; line-height:1.5; }
  .eyebrow { font-size:.84rem; }
}

@media (max-width: 430px) {
  header nav.container { grid-template-columns:minmax(0,1fr) auto; }
  header .navlinks { display:none !important; }
  #cartButton > div > div { font-size:12.5px !important; }
  .hero h1 { font-size:2.18rem !important; }
}
.price-note,
.price-note strong,
.variant-price {
    color: #7B2CBF !important;
}
#pagination .page-btn {
    border: 1px solid #7B2CBF;
    background: #fff;
    color: #7B2CBF;
    padding: 8px 12px;
    border-radius: 8px;
    font-weight: 700;
    cursor: pointer;
}

#pagination .page-btn:hover {
    background: #f3e8ff;
}

#pagination .active-page {
    background: #7B2CBF;
    color: #fff;
}