/*
Theme Name: StoreFactory Child
Template: astra
Description: StoreFactory black & white storefront — custom header, hero and category grid. Values (logo, name, phone, hero text) are option-driven so each store can be personalized automatically.
Version: 1.0.0
*/

/* ============================================================
   TOKENS — black & white, mid-level (not too premium/cheap)
   ============================================================ */
:root{
  --sf-bg:#ffffff;
  --sf-ink:#111111;
  --sf-ink-2:#3a3a3a;
  --sf-muted:#6b6b6b;
  --sf-line:#e6e6e6;
  --sf-soft:#f5f5f5;
  --sf-wrap:1200px;
}

/* base */
.sf-wrap{max-width:var(--sf-wrap);margin:0 auto;padding:0 18px;}
.sf-h2{font-size:22px;font-weight:800;letter-spacing:.02em;color:var(--sf-ink);
  text-align:center;margin:0 0 22px;text-transform:uppercase;}
.sf-btn{display:inline-block;background:var(--sf-ink);color:#fff;text-decoration:none;
  padding:13px 26px;font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  border:1px solid var(--sf-ink);transition:background .2s,color .2s;}
.sf-btn:hover{background:#fff;color:var(--sf-ink);}

/* ============================================================
   HEADER
   ============================================================ */
.sf-hd{position:sticky;top:0;z-index:900;background:var(--sf-bg);border-bottom:1px solid var(--sf-line);}
.sf-hd-bar{display:flex;align-items:center;gap:12px;max-width:var(--sf-wrap);
  margin:0 auto;padding:12px 18px;}
.sf-hd-left,.sf-hd-right{flex:1 1 0;display:flex;align-items:center;gap:6px;}
.sf-hd-right{justify-content:flex-end;}
.sf-logo{flex:0 0 auto;text-align:center;text-decoration:none;display:flex;align-items:center;justify-content:center;}
.sf-logo img{max-height:42px;width:auto;display:block;}
.sf-logo-txt{font-size:20px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--sf-ink);white-space:nowrap;}
.sf-ico{background:none;border:0;cursor:pointer;padding:8px;display:flex;align-items:center;color:var(--sf-ink);text-decoration:none;position:relative;-webkit-tap-highlight-color:transparent;}
.sf-ico svg{width:22px;height:22px;fill:none;stroke:var(--sf-ink);stroke-width:1.7;stroke-linecap:round;}
.sf-ico:hover svg{stroke:var(--sf-muted);}
.sf-badge{position:absolute;top:2px;right:2px;background:var(--sf-ink);color:#fff;font-size:10px;
  font-weight:700;line-height:1;min-width:16px;height:16px;border-radius:9px;display:flex;
  align-items:center;justify-content:center;padding:0 4px;}
.sf-badge[data-count="0"]{display:none;}
.sf-burger{flex-direction:column;gap:5px;}
.sf-burger span{width:22px;height:2px;background:var(--sf-ink);display:block;border-radius:2px;}

/* category strip (desktop) */
.sf-strip{border-top:1px solid var(--sf-line);}
.sf-strip-track{display:flex;gap:26px;overflow-x:auto;max-width:var(--sf-wrap);margin:0 auto;
  padding:11px 18px;scrollbar-width:none;}
.sf-strip-track::-webkit-scrollbar{display:none;}
.sf-strip-track a{flex:0 0 auto;color:var(--sf-ink-2);text-decoration:none;font-size:12px;
  font-weight:600;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;padding-bottom:2px;
  border-bottom:2px solid transparent;transition:border-color .2s,color .2s;}
.sf-strip-track a:hover{color:var(--sf-ink);border-color:var(--sf-ink);}
@media(max-width:782px){.sf-strip{display:none;}}

/* slide menu (mobile) */
.sf-scrim{position:fixed;inset:0;background:rgba(0,0,0,.45);opacity:0;visibility:hidden;
  transition:opacity .25s;z-index:1000;}
.sf-scrim.on{opacity:1;visibility:visible;}
.sf-menu{position:fixed;top:0;left:0;height:100%;width:min(84vw,300px);background:#fff;
  transform:translateX(-102%);transition:transform .28s ease;z-index:1001;overflow-y:auto;
  border-right:1px solid var(--sf-line);}
.sf-menu.on{transform:none;}
.sf-menu-top{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--sf-line);}
.sf-menu-top b{letter-spacing:.14em;text-transform:uppercase;font-size:14px;}
.sf-menu-x{background:none;border:0;font-size:20px;cursor:pointer;line-height:1;}
.sf-menu a{display:block;padding:13px 18px;color:var(--sf-ink);text-decoration:none;font-size:14px;
  border-bottom:1px solid var(--sf-soft);}
.sf-menu a:hover{background:var(--sf-soft);}

/* search panel */
.sf-sr{position:fixed;inset:0;background:rgba(255,255,255,.98);z-index:1002;opacity:0;visibility:hidden;
  transition:opacity .2s;display:flex;flex-direction:column;}
.sf-sr.on{opacity:1;visibility:visible;}
.sf-sr-form{display:flex;align-items:center;gap:10px;max-width:720px;margin:0 auto;width:100%;
  padding:22px 18px;border-bottom:1px solid var(--sf-line);}
.sf-sr-form input{flex:1;border:0;outline:none;font-size:18px;background:transparent;color:var(--sf-ink);}
.sf-sr-x{background:none;border:0;font-size:20px;cursor:pointer;}

/* ============================================================
   HERO (simple, light, no products)
   ============================================================ */
.sf-hero{position:relative;background:#111 center/cover no-repeat;min-height:clamp(320px,52vh,520px);
  display:flex;align-items:center;}
.sf-hero.sf-hero-plain{background:linear-gradient(135deg,#f0f0f0,#dcdcdc);}
.sf-hero::after{content:'';position:absolute;inset:0;background:rgba(0,0,0,.30);}
.sf-hero.sf-hero-plain::after{background:none;}
.sf-hero-in{position:relative;z-index:1;max-width:var(--sf-wrap);margin:0 auto;padding:40px 24px;width:100%;}
.sf-hero-h{font-size:clamp(28px,5vw,52px);font-weight:800;line-height:1.08;margin:0 0 14px;
  color:#fff;max-width:16ch;letter-spacing:-.01em;}
.sf-hero.sf-hero-plain .sf-hero-h{color:var(--sf-ink);}
.sf-hero-s{font-size:clamp(14px,1.6vw,18px);color:#f0f0f0;margin:0 0 24px;max-width:42ch;}
.sf-hero.sf-hero-plain .sf-hero-s{color:var(--sf-ink-2);}
.sf-hero.sf-hero-plain .sf-btn{background:var(--sf-ink);color:#fff;}
.sf-hero .sf-btn{background:#fff;color:var(--sf-ink);border-color:#fff;}
.sf-hero .sf-btn:hover{background:transparent;color:#fff;border-color:#fff;}
.sf-hero-in>*{opacity:0;transform:translateY(14px);animation:sfUp .6s ease forwards;}
.sf-hero-h{animation-delay:.05s}.sf-hero-s{animation-delay:.18s}.sf-hero .sf-btn{animation-delay:.30s}
@keyframes sfUp{to{opacity:1;transform:none}}

/* ============================================================
   CATEGORY GRID (simple)
   ============================================================ */
.sf-cats{padding:46px 0;}
.sf-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.sf-cat{display:block;text-decoration:none;color:var(--sf-ink);border:1px solid var(--sf-line);
  background:#fff;overflow:hidden;transition:border-color .2s,transform .2s;}
.sf-cat:hover{border-color:var(--sf-ink);transform:translateY(-3px);}
.sf-cat-img{display:block;width:100%;aspect-ratio:1/1;background:var(--sf-soft) center/cover no-repeat;}
.sf-cat-name{display:block;padding:12px 12px 2px;font-size:13px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;}
.sf-cat-c{display:block;padding:0 12px 12px;font-size:11px;color:var(--sf-muted);}
@media(max-width:900px){.sf-grid{grid-template-columns:repeat(3,1fr);}}
@media(max-width:600px){.sf-grid{grid-template-columns:repeat(2,1fr);gap:12px;}}

/* ============================================================
   FEATURED (uses Woo [products])
   ============================================================ */
.sf-feat{padding:20px 0 54px;}
.sf-feat .sf-wrap{max-width:var(--sf-wrap);}

/* footer credit line (light) */
.sf-cred{text-align:center;color:var(--sf-muted);font-size:12px;padding:22px 12px;border-top:1px solid var(--sf-line);}

/* hide the page title ("Home") + its header area on the front page only */
.home .entry-header,
.home .ast-single-post-header,
.home h1.entry-title,
.home .entry-title,
.home .ast-archive-description{display:none!important;}
.home .site-content .ast-container{padding-top:0;}

@media (prefers-reduced-motion:reduce){
  .sf-hero-in>*{animation:none;opacity:1;transform:none;}
}