/* ── RESET & BASE ─────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
.hs-wrap{font-family:'Inter Tight',ui-sans-serif,system-ui,sans-serif;color:#0e0e0e;-webkit-font-smoothing:antialiased;overflow-x:hidden}
.hs-wrap a{text-decoration:none;color:inherit}
.hs-wrap img{max-width:100%;display:block}
html{scroll-behavior:smooth;scroll-padding-top:64px}

:root{
  --red:#E63946;--red-dk:#B91818;--red-glow:rgba(230,57,70,.25);
  --cream:#f7f1e8;--dk:#3d2a1f;--ink:#0e0e0e;--white:#fff;
  --g50:#f8f8f8;--g100:#f0f0f0;--g200:#e5e5e5;--g400:#9e9e9e;--g500:#757575;--g700:#4a4a4a;
  --yellow:#FFB800;--yellow-dk:#B8860B;--green:#16a34a;
  --mono:'JetBrains Mono',ui-monospace,monospace;
  --serif:'Instrument Serif',Georgia,serif;
  --head:'Space Grotesk',ui-sans-serif,system-ui,sans-serif;
  --ease-out:cubic-bezier(.23,1,.32,1);
}

/* ── SCROLL REVEAL ────────────────────────────────────── */
.hs-reveal{opacity:0;transform:translateY(28px);transition:opacity .65s var(--ease-out),transform .65s var(--ease-out)}
.hs-reveal.visible{opacity:1;transform:translateY(0)}
.hs-reveal-l{opacity:0;transform:translateX(-28px);transition:opacity .65s var(--ease-out),transform .65s var(--ease-out)}
.hs-reveal-l.visible{opacity:1;transform:translateX(0)}
.hs-reveal-r{opacity:0;transform:translateX(28px);transition:opacity .65s var(--ease-out),transform .65s var(--ease-out)}
.hs-reveal-r.visible{opacity:1;transform:translateX(0)}
.hs-reveal-d1{transition-delay:.1s}
.hs-reveal-d2{transition-delay:.18s}
.hs-reveal-d3{transition-delay:.26s}
.hs-reveal-d4{transition-delay:.34s}

/* ── TICKER ───────────────────────────────────────────── */
.hs-ticker{background:var(--red);color:#fff;overflow:hidden;height:36px;display:flex;align-items:center}
.hs-ticker-track{display:flex;gap:0;animation:ticker 22s linear infinite;white-space:nowrap;will-change:transform}
.hs-ticker-item{font-size:11px;font-weight:800;font-family:var(--mono);letter-spacing:.18em;text-transform:uppercase;padding:0 32px;opacity:.92}
.hs-ticker-sep{opacity:.4;padding:0}
@keyframes ticker{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ── TOPBAR ───────────────────────────────────────────── */
.hs-topbar{background:var(--dk);color:var(--cream);padding:9px 16px;font-size:12px;font-weight:600;text-align:center;letter-spacing:.02em}
.hs-topbar strong{color:var(--red)}

/* ── HERO ─────────────────────────────────────────────── */
.hs-hero{background:linear-gradient(150deg,#1a0a06 0%,var(--red-dk) 45%,var(--red) 100%);padding:64px 24px 72px;text-align:center;position:relative;overflow:hidden;color:#fff}
.hs-hero::after{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");pointer-events:none}
.hs-hero-eyebrow{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);color:rgba(255,255,255,.9);padding:6px 18px;border-radius:999px;font-size:11px;font-family:var(--mono);letter-spacing:.18em;text-transform:uppercase;margin-bottom:24px;position:relative;z-index:1}
.hs-hero-dot{width:6px;height:6px;border-radius:999px;background:var(--red);animation:pulse 1.5s ease-in-out infinite;box-shadow:0 0 8px var(--red)}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(1.4)}}
.hs-hero-title{font-size:clamp(56px,11vw,110px);font-weight:900;line-height:.88;letter-spacing:-4px;font-family:var(--head);position:relative;z-index:1}
.hs-hero-title em{font-style:italic;font-family:var(--serif);font-weight:400;letter-spacing:-2px}
.hs-hero-dates{font-size:14px;color:rgba(255,255,255,.65);font-family:var(--mono);letter-spacing:.14em;text-transform:uppercase;margin-top:16px;position:relative;z-index:1}
.hs-hero-countdown{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:28px;flex-wrap:wrap;position:relative;z-index:1}
.hs-cd-unit{background:rgba(255,255,255,.1);backdrop-filter:blur(8px);border-radius:10px;padding:14px 18px;min-width:72px;text-align:center;border:1px solid rgba(255,255,255,.18)}
.hs-cd-num{font-size:30px;font-weight:900;font-family:var(--head);line-height:1;display:block}
.hs-cd-lbl{font-size:9px;font-family:var(--mono);letter-spacing:.14em;text-transform:uppercase;opacity:.7;display:block;margin-top:4px}
.hs-cd-sep{font-size:28px;font-weight:900;opacity:.4;line-height:1;align-self:flex-start;padding-top:14px}
.hs-hero-cta{display:inline-flex;align-items:center;gap:8px;background:#fff;color:var(--red);padding:14px 32px;border-radius:8px;font-size:14px;font-weight:900;margin-top:32px;letter-spacing:.02em;position:relative;z-index:1;transition:transform .2s,box-shadow .2s}
.hs-hero-cta:hover{transform:translateY(-2px);box-shadow:0 8px 32px rgba(0,0,0,.2)}
.hs-hero-cta svg{transition:transform .2s}
.hs-hero-cta:hover svg{transform:translateY(3px)}

/* ── STICKY NAV ───────────────────────────────────────── */
.hs-catnav{background:rgba(255,255,255,.96);border-bottom:1px solid var(--g200);padding:10px 16px;position:sticky;top:0;z-index:100;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 1px 8px rgba(0,0,0,.06)}
.hs-catnav-inner{max-width:1200px;margin:0 auto;display:flex;gap:6px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;align-items:center}
.hs-catnav-inner::-webkit-scrollbar{display:none}
.hs-chip{background:#fff;color:var(--g700);padding:6px 14px;border-radius:999px;font-size:12px;font-weight:700;white-space:nowrap;border:1.5px solid var(--g200);transition:all .15s;display:inline-flex;align-items:center;gap:4px}
.hs-chip:hover{border-color:var(--ink)}
.hs-chip.active{background:var(--red);color:#fff;border-color:var(--red)}
.hs-chip b{font-size:11px;opacity:.8}
.hs-chip.active b{opacity:.9}

/* ── PROMO BAR ────────────────────────────────────────── */
.hs-promobar{background:var(--red);padding:16px 24px}
.hs-promobar-inner{max-width:1200px;margin:0 auto;display:flex;flex-wrap:wrap;justify-content:center;gap:16px 40px}
.hs-pbitem{display:flex;align-items:center;gap:9px;color:#fff;font-size:13px;font-weight:700}
.hs-pbitem-icon{width:30px;height:30px;background:rgba(255,255,255,.18);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0}

/* ── SECTION BASE ─────────────────────────────────────── */
.cat-section{padding:64px 24px}
.cat-inner{max-width:1200px;margin:0 auto}
.cat-head{display:flex;align-items:flex-end;justify-content:space-between;flex-wrap:wrap;gap:16px;margin-bottom:32px}
.cat-head-left{flex:1;min-width:240px}
.cat-pill{display:inline-block;padding:5px 14px;border-radius:999px;font-size:11px;font-weight:900;letter-spacing:.8px;text-transform:uppercase;margin-bottom:12px}
.cat-pill.red{background:var(--red);color:#fff;box-shadow:0 4px 14px var(--red-glow)}
.cat-pill.yellow{background:var(--yellow);color:var(--ink);box-shadow:0 4px 14px rgba(255,184,0,.3)}
.cat-pill.light{background:rgba(255,255,255,.15);color:#fff;border:1px solid rgba(255,255,255,.25)}
.cat-title{font-size:clamp(28px,4vw,44px);font-weight:900;line-height:.96;letter-spacing:-1.5px;font-family:var(--head)}
.cat-desc{font-size:14px;opacity:.6;margin-top:8px;line-height:1.5;max-width:480px}
.cat-see-all{display:inline-flex;align-items:center;gap:6px;padding:10px 20px;border-radius:8px;font-size:13px;font-weight:700;white-space:nowrap;transition:all .15s;border:1.5px solid;flex-shrink:0}

/* Spacebars & Artisan – light bg */
#spacebars .cat-see-all,#artisan .cat-see-all{border-color:var(--g200);color:var(--ink)}
#spacebars .cat-see-all:hover,#artisan .cat-see-all:hover{border-color:var(--red);color:var(--red)}
/* Clickers & Pads – dark bg */
#clickers .cat-see-all,#pads .cat-see-all{border-color:rgba(255,255,255,.25);color:#fff}
#clickers .cat-see-all:hover,#pads .cat-see-all:hover{border-color:#fff;background:rgba(255,255,255,.1)}

/* ── SECTION COLORS ───────────────────────────────────── */
#spacebars{background:#fff}
#clickers{background:var(--dk);color:#fff}
#artisan{background:var(--cream)}
#pads{background:#0e0e0e;color:#fff}

/* ── PRODUCT GRID ─────────────────────────────────────── */
.cat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}
.cat-grid-wide{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}

/* ── PRODUCT CARD ─────────────────────────────────────── */
.pcard{border-radius:14px;overflow:hidden;display:flex;flex-direction:column;position:relative;transition:transform .3s var(--ease-out),box-shadow .3s var(--ease-out);cursor:pointer}
.pcard:hover{transform:translateY(-5px)}

/* Light card (white bg) */
.pcard-light{background:#fff;border:1.5px solid var(--g200)}
.pcard-light:hover{border-color:var(--red);box-shadow:0 16px 40px rgba(0,0,0,.1)}

/* Dark card */
.pcard-dark{background:rgba(255,255,255,.07);border:1.5px solid rgba(255,255,255,.1)}
.pcard-dark:hover{border-color:rgba(255,255,255,.35);box-shadow:0 16px 40px rgba(0,0,0,.4)}

/* Cream card */
.pcard-cream{background:#fff;border:1.5px solid rgba(61,42,31,.1)}
.pcard-cream:hover{border-color:var(--yellow);box-shadow:0 16px 40px rgba(255,184,0,.12)}

/* ── PRODUCT IMAGE AREA ───────────────────────────────── */
.pcard-img{aspect-ratio:1/1;position:relative;overflow:hidden}
.pcard-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease-out)}
.pcard:hover .pcard-img img{transform:scale(1.07)}

/* Placeholder styles per category */
.ph-spacebar{background:linear-gradient(135deg,#1a1a2e 0%,#16213e 50%,#0f3460 100%);display:flex;align-items:center;justify-content:center;width:100%;height:100%}
.ph-clicker{background:linear-gradient(135deg,#2d1b0e 0%,#4a2c15 100%);display:flex;align-items:center;justify-content:center;width:100%;height:100%}
.ph-artisan{background:linear-gradient(135deg,#2a1d15 0%,#6b3a2a 100%);display:flex;align-items:center;justify-content:center;width:100%;height:100%}
.ph-pad{background:linear-gradient(135deg,#1a1a1a 0%,#2d2d2d 100%);display:flex;align-items:center;justify-content:center;width:100%;height:100%}
.ph-name{font-size:11px;font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.5);text-align:center;padding:16px}

/* ── BADGE ────────────────────────────────────────────── */
.pcard-badge{position:absolute;top:10px;left:10px;padding:4px 10px;border-radius:6px;font-size:11px;font-weight:900;font-family:var(--mono);letter-spacing:.3px;z-index:2}
.badge-red{background:var(--red);color:#fff;box-shadow:0 2px 10px var(--red-glow)}
.badge-yellow{background:var(--yellow);color:var(--ink)}
.badge-hot{background:var(--ink);color:#fff}

/* ── PRODUCT INFO ─────────────────────────────────────── */
.pcard-body{padding:14px;flex:1;display:flex;flex-direction:column;gap:4px}
.pcard-name{font-size:13px;font-weight:700;line-height:1.3;letter-spacing:-.1px}
.pcard-tag{font-size:10px;font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;opacity:.5}
.pcard-prices{margin-top:auto;padding-top:10px;display:flex;align-items:baseline;gap:7px;flex-wrap:wrap}
.pcard-old{font-size:11px;text-decoration:line-through;opacity:.45;font-weight:500}
.pcard-new{font-size:17px;font-weight:900;letter-spacing:-.5px}
.pcard-new.red{color:var(--red)}
.pcard-new.white{color:#fff}
.pcard-new.yellow{color:var(--yellow-dk)}
.pcard-savings{font-size:10px;font-weight:700;color:var(--green);width:100%}
.pcard-savings.artisan{color:var(--yellow-dk)}
.pcard-cta{margin-top:12px;text-align:center;padding:9px;border-radius:7px;font-size:12px;font-weight:800;letter-spacing:.02em;transition:all .15s}
.cta-dark{background:var(--ink);color:#fff}
.pcard:hover .cta-dark{background:var(--red)}
.cta-light{background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.18)}
.pcard:hover .cta-light{background:rgba(255,255,255,.22)}
.cta-cream{background:var(--dk);color:#fff}
.pcard:hover .cta-cream{background:var(--red)}

/* ── ARTISAN FEATURED LAYOUT ──────────────────────────── */
.artisan-grid{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto;gap:16px}
.artisan-featured{grid-row:1/3}
.artisan-featured .pcard-img{aspect-ratio:3/4}

/* ── PADS WIDE LAYOUT ─────────────────────────────────── */
.pads-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
.pads-grid .pcard-img{aspect-ratio:16/7}

/* ── PERSONALIZADOS ───────────────────────────────────── */
.hs-pers{padding:72px 24px;background:var(--cream)}
.hs-pers-inner{max-width:1200px;margin:0 auto}
.hs-pers-hd{text-align:center;margin-bottom:52px}
.hs-pers-eyebrow{display:inline-flex;align-items:center;gap:8px;background:var(--red);color:#fff;padding:6px 18px;border-radius:999px;margin-bottom:16px;font-size:10px;font-family:var(--mono);letter-spacing:.16em;text-transform:uppercase;font-weight:700}
.hs-pers-dot{width:6px;height:6px;border-radius:999px;background:#fff;animation:pulse 1.5s ease-in-out infinite}
.hs-pers-h2{font-size:clamp(38px,6vw,62px);letter-spacing:-.04em;font-weight:900;line-height:.94;color:var(--dk);font-family:var(--head)}
.hs-pers-h2 em{font-style:italic;font-family:var(--serif);font-weight:400;color:var(--red)}
.hs-pers-p{font-size:15px;color:rgba(61,42,31,.6);margin-top:14px;max-width:480px;margin-inline:auto;line-height:1.6}
.hs-pers-grid{display:grid;grid-template-columns:1fr 1.3fr 1fr;gap:18px;align-items:center;perspective:1200px}
.hs-pc{border-radius:14px;overflow:hidden;display:flex;flex-direction:column;transition:transform .35s var(--ease-out),box-shadow .35s}
.hs-pc.side{background:#fff;border:1.5px solid rgba(230,57,70,.1);box-shadow:0 4px 20px rgba(0,0,0,.07)}
.hs-pc.feat{background:var(--red);color:#fff;box-shadow:0 20px 56px var(--red-glow)}
.hs-pc.side.left{transform:rotateY(7deg) scale(.97)}
.hs-pc.side.right{transform:rotateY(-7deg) scale(.97)}
.hs-pers-grid:hover .hs-pc.feat{transform:translateY(-8px) scale(1.02)}
.hs-pers-grid:hover .hs-pc.side.left{transform:rotateY(10deg) scale(.95) translateX(-6px)}
.hs-pers-grid:hover .hs-pc.side.right{transform:rotateY(-10deg) scale(.95) translateX(6px)}
.hs-pc.side:hover{transform:none!important;box-shadow:0 20px 48px rgba(0,0,0,.15)!important}
.hs-pc-img{position:relative;overflow:hidden}
.hs-ph{display:flex;align-items:center;justify-content:center;font-size:10px;font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase}
.hs-pc.side .hs-ph{background:var(--g100);color:var(--g400)}
.hs-pc.feat .hs-ph{background:rgba(255,255,255,.15);color:rgba(255,255,255,.7)}
.hs-pc-num{position:absolute;top:12px;left:12px;background:rgba(255,255,255,.9);border-radius:999px;padding:4px 10px;font-size:9px;font-family:var(--mono);font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink)}
.hs-pc-best{position:absolute;top:12px;right:12px;background:rgba(255,255,255,.2);color:#fff;border-radius:999px;padding:4px 10px;font-size:9px;font-family:var(--mono);font-weight:700;letter-spacing:.1em;text-transform:uppercase;border:1px solid rgba(255,255,255,.35)}
.hs-pc-body{padding:20px;flex:1;display:flex;flex-direction:column}
.hs-pc.feat .hs-pc-body{padding:24px}
.hs-pc-tag{font-size:10px;font-family:var(--mono);letter-spacing:.12em;text-transform:uppercase;margin-bottom:6px;opacity:.7}
.hs-pc.side .hs-pc-tag{color:var(--red)}
.hs-pc-name{font-weight:800;letter-spacing:-.02em;line-height:1.1}
.hs-pc.side .hs-pc-name{font-size:18px;color:var(--ink)}
.hs-pc.feat .hs-pc-name{font-size:22px}
.hs-pc-desc{font-size:13px;line-height:1.5;margin-top:8px;flex:1}
.hs-pc.side .hs-pc-desc{color:rgba(42,29,21,.55)}
.hs-pc.feat .hs-pc-desc{color:rgba(255,255,255,.82)}
.hs-pc-btn{margin-top:16px;padding:11px 14px;border-radius:7px;font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:space-between;border:none;cursor:pointer;width:100%;transition:all .2s}
.hs-pc.feat .hs-pc-btn{background:#fff;color:var(--red)}
.hs-pc.side .hs-pc-btn{background:transparent;color:var(--ink);border:1.5px solid rgba(230,57,70,.2)}
.hs-pc.side:hover .hs-pc-btn{background:var(--red);color:#fff;border-color:var(--red)}

/* ── FINAL CTA ────────────────────────────────────────── */
.hs-cta{background:var(--dk);text-align:center;padding:72px 24px;color:#fff}
.hs-cta h2{font-size:clamp(30px,5vw,52px);font-weight:900;line-height:.95;letter-spacing:-1.5px;margin-bottom:12px;font-family:var(--head)}
.hs-cta h2 em{font-style:italic;font-family:var(--serif);font-weight:400;color:var(--red)}
.hs-cta p{font-size:15px;color:rgba(247,241,232,.6);margin-bottom:28px;max-width:440px;margin-inline:auto;line-height:1.6}
.hs-cta-btn{display:inline-block;background:var(--red);color:#fff;padding:14px 36px;border-radius:8px;font-size:14px;font-weight:900;letter-spacing:.02em;transition:transform .2s,box-shadow .2s}
.hs-cta-btn:hover{transform:translateY(-2px);box-shadow:0 8px 28px var(--red-glow)}

/* ── RESPONSIVE ───────────────────────────────────────── */
@media(max-width:1024px){
  .hs-pers-grid{grid-template-columns:1fr;gap:14px;perspective:none}
  .hs-pc.side.left,.hs-pc.side.right{transform:none}
  .hs-pers-grid:hover .hs-pc.feat,.hs-pers-grid:hover .hs-pc.side.left,.hs-pers-grid:hover .hs-pc.side.right{transform:none}
  .artisan-grid{grid-template-columns:1fr 1fr;grid-template-rows:auto}
  .artisan-featured{grid-row:auto}
  .artisan-featured .pcard-img{aspect-ratio:1/1}
}
@media(max-width:768px){
  .hs-hero{padding:48px 16px 56px}
  .cat-section{padding:48px 16px}
  .hs-pers{padding:52px 16px}
  .cat-see-all{display:none}
}
@media(max-width:600px){
  .cat-grid,.artisan-grid,.pads-grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .artisan-featured{grid-column:auto;grid-row:auto}
  .artisan-featured .pcard-img{aspect-ratio:1/1}
  .pads-grid .pcard-img{aspect-ratio:4/3}
  .cat-grid-wide{grid-template-columns:repeat(2,1fr)}
  .pcard-name{font-size:12px}
  .pcard-new{font-size:15px}
  .pcard-cta{font-size:11px;padding:8px}
}