/* Theme: slate-black background with mint-blue accents */
:root{
  --bg-900: #0b0f12; /* very dark slate */
  --bg-800: #0f1416;
  --surface: #0f1720;
  --muted: #97a7a7;
  --mint-500: #3ee3d8; /* mint blue */
  --mint-400: #66f0e5;
  --accent-700: #19b3a8;
  --danger: #ff4757;
  --card: #0e1417;
  --glass: rgba(255,255,255,0.04);
  --radius: 14px;
  --container-width: 1300px;
}

/* Brand fonts: use a classic slab serif for 'Engineered' and a geometric display for 'Discounts' */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@700;900&family=Libre+Baskerville:wght@700&display=swap');

.brand{display:inline-flex;align-items:baseline;gap:10px;font-size:2.6rem}
.brand-engineered{font-family:'Libre Baskerville', serif;color:#ffffff;letter-spacing:-0.5px}
.brand-discounts{font-family:'Montserrat', sans-serif;color:var(--mint-500);font-weight:800;display:inline-flex;align-items:center}
.brand-d{display:inline-flex;align-items:center;justify-content:center;margin-right:6px;padding:6px;border-radius:6px;background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));box-shadow:inset 0 -6px 18px rgba(0,0,0,0.45), 0 6px 24px rgba(25,179,168,0.06);transform:skewX(-6deg)}
.brand-d{display:inline-flex;align-items:center;justify-content:center;margin-right:12px;padding:6px;border-radius:10px;position:relative;width:74px;height:74px;background:linear-gradient(180deg, rgba(255,255,255,0.01), rgba(255,255,255,0.005));box-shadow:inset 0 -8px 28px rgba(0,0,0,0.45), 0 8px 36px rgba(25,179,168,0.06);transform:skewX(-6deg)}
.brand-d .wrench{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(1);width:56px;height:56px;color:#c0c4c6;opacity:0.98}
.brand-d-letter{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-8deg);color:var(--mint-500);font-weight:900;font-family:'Montserrat', sans-serif;font-size:36px;line-height:1;text-shadow:0 4px 0 rgba(0,0,0,0.28)}

/* Base layout tweaks */
*{box-sizing:border-box}
html,body{height:100%}
body{
  background: radial-gradient(1200px 600px at 10% 10%, rgba(34,40,44,0.45), transparent), linear-gradient(180deg,var(--bg-900), var(--bg-800));
  color: #dff7f3;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  padding:28px;
}
.container{max-width:var(--container-width);margin:0 auto}

/* Header */
header{padding:36px 0;text-align:center}
h1{font-size:2.6rem;color:var(--mint-500);letter-spacing:-0.5px;margin-bottom:6px}
.logo{font-size:56px;margin-right:12px}
.tagline{color:var(--muted);font-size:1.05rem}

/* Search / filters */
.search-box input{
  background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));
  border:1px solid rgba(255,255,255,0.04);
  color:var(--mint-400);
  padding:14px 18px;font-size:1rem;border-radius:999px;outline:none;width:100%;
  box-shadow: 0 6px 30px rgba(2,6,8,0.6), inset 0 -1px 0 rgba(255,255,255,0.02);
}
.search-box input::placeholder{color:rgba(160,223,216,0.35)}
.filters{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:18px}
.filter-select{
  background: linear-gradient(180deg, rgba(255,255,255,0.01), rgba(255,255,255,0.005));
  color: var(--mint-400);
  border: 1px solid rgba(62,227,216,0.12);
  padding:10px 14px;border-radius:999px;min-width:160px;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,0.3);
}
.filter-select:hover{box-shadow:0 8px 30px rgba(34,46,46,0.45)}
.reset-btn{
  background: linear-gradient(90deg,var(--mint-500),var(--accent-700));
  border: none;
  color: #021212;
  padding:10px 18px;border-radius:999px;
  font-weight:700;box-shadow:0 8px 30px rgba(34,46,46,0.45);
}
.reset-btn:hover{transform:translateY(-3px);filter:brightness(1.03)}

/* Products grid */
.products-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:22px;margin-top:30px}
.product-card{
  background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));
  border:1px solid rgba(255,255,255,0.03);
  border-radius:var(--radius);
  overflow:hidden;box-shadow:0 8px 30px rgba(2,6,8,0.6);
  transition:transform .22s ease, box-shadow .22s ease;
  position:relative;
}
.product-card:hover{transform:translateY(-8px);box-shadow:0 18px 50px rgba(2,6,8,0.75)}

.product-image{width:100%;height:220px;object-fit:cover;background:linear-gradient(90deg,#091012 0%, #0e1417 100%)}
.category-tag{background:linear-gradient(90deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));color:var(--muted);padding:6px 10px;border-radius:999px;font-weight:600}
.discount-badge{background:var(--danger);color:white;padding:8px 12px;border-radius:999px;font-weight:700;position:absolute;right:14px;top:14px;box-shadow:0 6px 20px rgba(0,0,0,0.6)}
.store-badge{background:transparent;border:1px solid rgba(255,255,255,0.03);color:var(--muted);padding:8px 12px;border-radius:999px}

.product-info{padding:18px 18px 22px}
.product-name{color:#e6fffa;font-size:1.05rem;margin-bottom:8px}
.product-description{color:rgba(220,255,250,0.6);font-size:0.92rem;line-height:1.45;margin-bottom:14px}
.price-container{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.product-price{color:var(--mint-400);font-weight:800;font-size:1.25rem}
.original-price{color:rgba(255,255,255,0.25);text-decoration:line-through}
.buy-button{display:inline-block;padding:12px 16px;background:linear-gradient(90deg,var(--mint-500),var(--accent-700));color:#021214; font-weight:800;border-radius:10px;text-decoration:none;box-shadow:0 8px 30px rgba(34,46,46,0.45), 0 2px 10px rgba(62,227,216,0.08)}
.buy-button:hover{filter:brightness(1.06);transform:translateY(-3px);box-shadow:0 18px 50px rgba(34,46,46,0.55),0 6px 30px rgba(62,227,216,0.14)}

/* Pagination and generic button styles themed mint */
.pagination-btn{padding:10px 14px;font-size:0.95rem;border-radius:10px;background:transparent;border:1px solid rgba(62,227,216,0.08);color:var(--mint-400);font-weight:700;box-shadow:none;transition:all .18s ease}
.pagination-btn:hover:not(.disabled){transform:translateY(-3px);box-shadow:0 10px 30px rgba(34,46,46,0.45);background:linear-gradient(90deg, rgba(62,227,216,0.06), rgba(25,179,168,0.03))}
.pagination-btn.active{background:linear-gradient(90deg,var(--mint-500),var(--accent-700));color:#021214;border:1px solid rgba(0,0,0,0.12);box-shadow:0 12px 40px rgba(25,179,168,0.08)}
.pagination-btn.disabled{opacity:0.45;cursor:not-allowed}

/* Footer */
footer{margin-top:36px;padding:28px 0;border-top:1px solid rgba(255,255,255,0.03);color:var(--muted)}
.affiliate-disclosure{background:linear-gradient(90deg, rgba(255,255,255,0.01), rgba(255,255,255,0.005));padding:16px;border-radius:10px;color:var(--muted)}

/* SiteLock badge container */
.sitelock-container{display:flex;align-items:center;justify-content:center;margin:14px 0}
.sitelock-img{max-width:160px;height:auto;border-radius:6px;box-shadow:0 6px 20px rgba(0,0,0,0.5)}

/* Responsive tweaks */
@media (max-width:768px){
  .product-image{height:180px}
  h1{font-size:1.9rem}
  .logo{font-size:42px}
}

/* Small utility classes */
.text-muted{color:var(--muted)}
.center{display:flex;align-items:center;justify-content:center}

/* subtle focus styles for keyboard users */
a:focus, button:focus, input:focus, select:focus{outline:2px solid rgba(62,227,216,0.14);outline-offset:2px}