/* Hommix Homepage v2.1.3 - extracted from inline <style> for reliability.
 * (Some hosting-level CSS minify/combine tools mangle large inline <style>
 * blocks; an enqueued file avoids that class of bug entirely.) */

/* === Free shipping bar === */
#hmx-shipBar{display:flex;align-items:center;gap:12px;background:linear-gradient(90deg,var(--hmx-navy),#1a2480);color:#fff;padding:8px 20px;font-size:.8rem;position:relative;z-index:50}
#hmx-shipTrack{background:rgba(255,255,255,.2);border-radius:30px;height:6px;flex:1}
#hmx-shipFill{height:100%;width:0%;background:var(--hmx-amber,#F6B500);border-radius:30px;transition:width .6s}
#hmx-shipMsg{white-space:nowrap}
/* === Hero extras === */
.hmx-hero-ghost{background:rgba(255,255,255,.15)!important;color:#fff!important;border:2px solid rgba(255,255,255,.55)!important;backdrop-filter:blur(4px)}
.hmx-hero-ghost:hover{background:rgba(255,255,255,.28)!important;border-color:#fff!important}
.hero-fade{opacity:0;transform:translateY(-8px);transition:.3s}
.hmx-reveal{opacity:0;transform:translateY(22px);transition:.55s cubic-bezier(.4,0,.2,1)}
.hmx-reveal.hmx-in{opacity:1;transform:none}
/* === Category tabs === */

/* === Product cards (enhanced) === */
.hmx-prod-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.hmx-pcard{background:#fff;border-radius:20px;overflow:hidden;box-shadow:0 14px 40px -16px rgba(40,30,10,.3);transition:.35s;cursor:pointer;display:block;text-decoration:none;color:inherit}
.hmx-pcard:hover{transform:translateY(-6px);box-shadow:0 26px 56px -20px rgba(40,30,10,.45)}
.hmx-imgbox{position:relative;overflow:hidden;aspect-ratio:4/3}
.hmx-imgbox img{width:100%;height:100%;object-fit:cover;transition:.55s}
.hmx-pcard:hover .hmx-imgbox img{transform:scale(1.07)}
.hmx-tag-sale{position:absolute;top:12px;left:12px;background:var(--hmx-orange);color:#fff;font-size:.64rem;font-weight:800;padding:4px 9px;border-radius:6px;letter-spacing:.06em}
.hmx-wish{position:absolute;top:10px;right:10px;background:#fff;border:none;border-radius:50%;width:32px;height:32px;display:grid;place-items:center;font-size:1rem;cursor:pointer;color:#ccc;transition:.2s;box-shadow:0 2px 8px rgba(0,0,0,.1)}
.hmx-wish:hover,.hmx-wish.on{color:#e34948}
.hmx-pcard-body{padding:14px 16px 16px}
.hmx-pcat{font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.1em;color:var(--hmx-orange);display:block;margin-bottom:4px}
.hmx-pcard h3{font-family:var(--hmx-display);font-size:1.02rem;font-weight:800;color:var(--hmx-navy);margin:0 0 5px;line-height:1.25}
.p-badge{display:inline-block;font-size:.68rem;font-weight:800;padding:3px 9px;border-radius:20px;margin-bottom:7px}
.p-badge--fire{background:#fff3e0;color:#e65100}
.p-badge--tradition{background:#e8f5e9;color:#2e7d32}
.p-badge--lunch{background:#e3f2fd;color:#1565c0}
.hmx-pc-rate{display:flex;gap:8px;align-items:center;font-size:.78rem;margin-bottom:8px;color:var(--hmx-soft)}
.hmx-pc-rate .pill{background:var(--hmx-cream,#FCEFC7);color:var(--hmx-navy);font-weight:800;padding:2px 8px;border-radius:20px;font-size:.72rem}
.hmx-price{display:flex;align-items:baseline;gap:8px;margin-bottom:12px}
.hmx-price .old{text-decoration:line-through;color:#b3a98f;font-size:.82rem}
.hmx-price .now{font-family:var(--hmx-display);font-size:1.35rem;font-weight:900;color:var(--hmx-navy)}
.hmx-pc-foot{display:flex;gap:8px}
.hmx-pc-foot .hmx-btn{flex:1;padding:11px 10px;font-size:.83rem;border-radius:10px;text-align:center;justify-content:center}
.hmx-more{width:40px;height:40px;border-radius:10px;border:2px solid #e0dbd2;background:#fff;display:grid;place-items:center;font-size:1.1rem;font-weight:700;color:var(--hmx-navy);transition:.2s;cursor:pointer;font-family:var(--hmx-body)}
.hmx-more:hover{border-color:var(--hmx-orange);color:var(--hmx-orange)}
/* === Blog grid === */
.hmx-blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-bottom:48px}
.hmx-bcard{display:block;background:#fff;border-radius:20px;overflow:hidden;box-shadow:0 14px 40px -16px rgba(40,30,10,.3);text-decoration:none;color:inherit;transition:.35s}
.hmx-bcard:hover{transform:translateY(-5px);box-shadow:0 26px 56px -20px rgba(40,30,10,.45)}
.hmx-bimg{aspect-ratio:4/3;overflow:hidden;position:relative}
.hmx-bimg img{width:100%;height:100%;object-fit:cover;transition:.5s}
.hmx-bcard:hover .hmx-bimg img{transform:scale(1.06)}
.hmx-bcat{position:absolute;top:12px;left:12px;background:var(--hmx-orange);color:#fff;font-size:.65rem;font-weight:800;padding:4px 10px;border-radius:6px;text-transform:uppercase;letter-spacing:.06em}
.hmx-bbody{padding:16px 18px 18px}
.hmx-bbody h4{font-family:var(--hmx-display);font-size:1rem;font-weight:800;color:var(--hmx-navy);margin:0 0 8px;line-height:1.3}
.hmx-bmeta{display:flex;gap:8px;font-size:.74rem;color:var(--hmx-soft);margin-bottom:8px}
.hmx-bread{font-size:.78rem;font-weight:700;color:var(--hmx-orange)}
/* === Instagram Reels strip === */
.hmx-reel-strip{display:flex;gap:10px;overflow-x:auto;padding:4px 0 16px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}

/* Smash Balloon Instagram Feed plugin output, once connected — targets
   their stable, documented class names. Smash Balloon already inherits
   theme fonts automatically, so this only tidies spacing/rounding to
   match the rest of this section rather than overriding their layout. */
.hmx-ig-plugin-feed{margin-top:4px}
.hmx-ig-plugin-feed #sb_instagram{padding:0!important}
.hmx-ig-plugin-feed .sbi_photo{border-radius:14px;overflow:hidden}
.hmx-ig-plugin-feed #sbi_load{margin-top:20px!important}
.hmx-ig-plugin-feed #sbi_load a{border-radius:30px!important;font-family:var(--hmx-body)!important;font-weight:700!important;background:var(--hmx-orange)!important;border-color:var(--hmx-orange)!important}
.hmx-reel-strip::-webkit-scrollbar{height:3px}
.hmx-reel-strip::-webkit-scrollbar-thumb{background:var(--hmx-orange);border-radius:4px}
.hmx-reel-card{flex-shrink:0;width:200px;border-radius:18px;overflow:hidden;position:relative;scroll-snap-align:start;cursor:pointer;background:#1a1a2e;aspect-ratio:9/16;transition:.25s;border:none;padding:0}
.hmx-reel-card:hover{transform:scale(1.03)}
.hmx-reel-card img{width:100%;height:100%;object-fit:cover;display:block}
.hmx-reel-overlay{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(0,0,0,.18) 0%,transparent 38%,transparent 48%,rgba(0,0,0,.85) 100%)}
.hmx-reel-top{position:absolute;top:10px;left:10px;display:flex;align-items:center;gap:6px}
.hmx-reel-ig-dot{width:22px;height:22px;border-radius:50%;background:linear-gradient(45deg,#f9ce34,#ee2a7b,#6228d7);display:grid;place-items:center;flex-shrink:0}
.hmx-reel-handle{font-size:.66rem;font-weight:700;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.5)}
.hmx-reel-play-icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.18);backdrop-filter:blur(6px);display:grid;place-items:center;transition:.2s;border:none;cursor:pointer}
.hmx-reel-card:hover .hmx-reel-play-icon{background:rgba(255,255,255,.3)}
.hmx-reel-actions{position:absolute;right:10px;bottom:72px;display:flex;flex-direction:column;align-items:center;gap:18px}
.hmx-reel-act-btn{display:flex;flex-direction:column;align-items:center;gap:3px;background:none;border:none;color:#fff;cursor:pointer;font-size:.6rem;font-weight:800;letter-spacing:.04em;text-shadow:0 1px 2px rgba(0,0,0,.5);line-height:1;padding:0;transition:.2s;text-decoration:none}
.hmx-reel-act-btn:hover{transform:scale(1.15)}
.hmx-reel-act-btn.liked .hmx-reel-heart-ico{fill:#ff3b5c!important;stroke:#ff3b5c!important}
.hmx-reel-act-btn.liked{color:#ff3b5c}
.hmx-reel-act-btn.heart-pop{animation:hmxHeartPop .4s ease}
@keyframes hmxHeartPop{0%{transform:scale(1)}40%{transform:scale(1.35)}100%{transform:scale(1)}}
.hmx-reel-foot{position:absolute;bottom:0;left:0;right:52px;padding:10px 12px 12px}
.hmx-reel-title-txt{color:#fff;font-weight:700;font-size:.76rem;line-height:1.35;text-shadow:0 1px 4px rgba(0,0,0,.6)}
.hmx-reel-modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:400;opacity:0;pointer-events:none;transition:.3s}
.hmx-reel-modal-overlay.open{opacity:1;pointer-events:auto}
.hmx-reel-modal{position:fixed;bottom:0;left:0;right:0;max-width:480px;margin:0 auto;background:#fff;border-radius:24px 24px 0 0;z-index:401;transform:translateY(100%);transition:.38s cubic-bezier(.2,.8,.3,1);display:flex;flex-direction:column;max-height:70vh}
.hmx-reel-modal.open{transform:translateY(0)}
.hmx-reel-modal-header{display:flex;align-items:center;padding:16px 18px 12px;border-bottom:1.5px solid #f0ece4}
.hmx-reel-modal-title{flex:1;font-weight:800;font-size:.95rem;color:var(--hmx-navy)}
.hmx-reel-modal-close{background:none;border:none;font-size:1.1rem;cursor:pointer;color:var(--hmx-soft);padding:0;width:30px;height:30px;border-radius:50%;display:grid;place-items:center}
.hmx-reel-comments-list{flex:1;overflow-y:auto;padding:10px 16px}
.hmx-reel-comment{display:flex;gap:10px;padding:10px 0;border-bottom:1px solid #f5f2ee;align-items:flex-start}
.hmx-rc-avatar{width:34px;height:34px;border-radius:50%;color:#fff;display:grid;place-items:center;font-weight:800;font-size:.8rem;flex-shrink:0}
.hmx-rc-body{flex:1}
.hmx-rc-user{font-weight:700;font-size:.8rem;color:var(--hmx-navy);margin-right:6px}
.hmx-rc-text{font-size:.84rem;color:var(--hmx-ink,#1C1B1A);line-height:1.45}
.hmx-reel-add-comment{display:flex;gap:10px;padding:14px 16px;border-top:1.5px solid #f0ece4}
.hmx-reel-comment-input{flex:1;border:1.5px solid #e0dbd2;border-radius:30px;padding:10px 16px;font-size:.85rem;outline:none;font-family:var(--hmx-body);background:#faf8f4}
.hmx-reel-comment-input:focus{border-color:var(--hmx-orange)}
.hmx-reel-post-btn{background:var(--hmx-orange);color:#fff;border:none;border-radius:30px;padding:10px 18px;font-weight:800;font-size:.82rem;cursor:pointer}
@media(max-width:600px){
  .hmx-reel-card{width:175px}
  .hmx-reel-actions{right:8px;bottom:60px;gap:14px}
  .hmx-reel-act-btn{font-size:.56rem}
  .hmx-reel-foot{right:44px;padding:8px 10px 10px}
}
@media(max-width:480px){
  .hmx-reel-card{width:140px}
  .hmx-reel-actions{right:6px;bottom:48px;gap:10px}
  .hmx-reel-act-btn svg{width:20px;height:20px}
  .hmx-reel-act-btn{font-size:.52rem}
  .hmx-reel-foot{right:36px;padding:6px 8px 8px}
  .hmx-reel-title-txt{font-size:.68rem}
}
/* === Quick-view modal === */
.hmx-pm-overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:300;opacity:0;pointer-events:none;transition:.3s}
.hmx-pm-overlay.open{opacity:1;pointer-events:auto}
.hmx-pm-modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-45%);width:min(640px,94vw);background:#fff;border-radius:22px;padding:28px;z-index:301;opacity:0;pointer-events:none;transition:.3s;max-height:90vh;overflow-y:auto}
.hmx-pm-modal.open{opacity:1;pointer-events:auto;transform:translate(-50%,-50%)}
.hmx-pm-inner{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.hmx-pm-img{border-radius:14px;overflow:hidden;aspect-ratio:4/3}
.hmx-pm-img img{width:100%;height:100%;object-fit:cover}
.hmx-pm-close{position:absolute;top:14px;right:16px;background:none;border:none;font-size:1.3rem;cursor:pointer;color:var(--hmx-soft)}
/* === Sticky mobile cart bar === */
#hmx-stickyCart{display:none;position:fixed;bottom:0;left:0;right:0;z-index:90;background:#fff;border-top:2px solid var(--hmx-orange);padding:11px 16px;box-shadow:0 -4px 20px rgba(0,0,0,.12)}
#hmx-stickyCart .sc-inner{display:flex;align-items:center;gap:10px}
#hmx-stickyCart .sc-name{font-weight:700;font-size:.86rem;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--hmx-navy)}
#hmx-stickyCart .sc-price{font-family:var(--hmx-display);font-weight:900;color:var(--hmx-navy);font-size:1rem;white-space:nowrap}
/* === Responsive === */
@media(max-width:900px){.hmx-prod-grid{grid-template-columns:repeat(2,1fr)}.hmx-blog-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){
  .hmx-prod-grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .hmx-blog-grid{grid-template-columns:1fr}
  .hmx-pcard-body{padding:10px 12px}
  .hmx-pcard h3{font-size:.88rem}
  .hmx-pm-inner{grid-template-columns:1fr}
  .hmx-pm-modal{padding:20px}
  #hmx-stickyCart{display:block}
  body{padding-bottom:72px}
}

/* =========================================================
   v2.1.3 COMPAT — templates renamed these selectors; the
   rules below mirror the old ones so markup + CSS agree.
   (Old names kept above for safety; no rules removed.)
   ========================================================= */

/* Section rhythm (templates use .hmx-section, not .hmx-sec) */
.hmx-section{padding:84px 0}

/* Hero layout */
.hmx-hero-main{position:relative;z-index:2;display:grid;grid-template-columns:1.05fr 1fr;gap:36px;align-items:center;width:100%;padding-top:60px;padding-bottom:60px}
.hmx-hero-overlay{position:absolute;inset:0;z-index:1;pointer-events:none}
.hmx-hero-cta{display:flex;gap:12px;flex-wrap:wrap}
.hmx-hero-meta{display:flex;align-items:center;gap:14px;margin-top:24px;flex-wrap:wrap;font-size:.88rem;color:#cfcabf}
.hmx-hero-meta .hmx-dots{position:static;transform:none;display:flex;gap:8px}

/* Hero product slider cards */
.hmx-hpcard img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.hmx-hpcard-info{padding:14px 16px 16px}
.hmx-hpcard-info strong{display:block;font-family:var(--hmx-display);font-size:1rem;font-weight:700;color:var(--hmx-navy);margin-bottom:6px;line-height:1.25}
.hmx-hpcard-info span{font-family:var(--hmx-display);font-weight:700;color:var(--hmx-navy);font-size:1.02rem}
.hmx-hpcard-info del{color:#a89f8d;font-weight:400;font-size:.82rem;margin-right:5px}
.hmx-hpcard-info ins{text-decoration:none}

/* Trust bar */
.hmx-trust-inner{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 38px;padding:16px 0}
.hmx-trust-item{font-weight:600;font-size:.9rem;color:#fff;white-space:nowrap}

/* Testimonials grid */
.hmx-testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.hmx-testi-card{background:#fff;border:1px solid #f0e6cf;border-radius:16px;padding:26px 24px;box-shadow:0 14px 30px -26px rgba(40,30,10,.4);display:flex;flex-direction:column}
.hmx-tstar{color:#F6B500;letter-spacing:2px;margin-bottom:12px;font-size:.95rem;line-height:1}
.hmx-tquote{font-size:.95rem;color:var(--hmx-ink);line-height:1.65;margin:0 0 18px;flex:1}
.hmx-tauthor{display:flex;align-items:center;gap:12px;border-top:1px solid #f5f0e6;padding-top:14px}
.hmx-tavatar{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;flex-shrink:0;color:#fff;font-family:var(--hmx-display);font-weight:800;font-size:.9rem}
.hmx-tauthor-info{display:flex;flex-direction:column;gap:2px}
.hmx-tauthor strong{font-family:var(--hmx-display);font-size:.92rem;color:var(--hmx-navy);font-weight:700}
.hmx-tauthor span{font-size:.78rem;color:var(--hmx-soft)}

/* FAQ toggle icon */
.hmx-faq-icon{flex:none;width:28px;height:28px;border-radius:50%;background:var(--hmx-cream,#FCEFC7);display:grid;place-items:center;color:var(--hmx-orange);font-size:1.2rem;font-weight:700;transition:.3s}
.hmx-faq-item.open .hmx-faq-icon{background:var(--hmx-orange);color:#fff;transform:rotate(45deg)}

/* Offer / countdown */
.hmx-offer-inner{display:grid;grid-template-columns:1.3fr 1fr;gap:38px;align-items:center}
.hmx-offer-copy h2{font-size:clamp(2rem,4vw,3rem);margin:10px 0 12px;color:#fff}
.hmx-offer-copy p{color:#cfd2f0;max-width:420px;margin-bottom:18px}
.hmx-offer-code{display:inline-block;border:2px dashed var(--hmx-gold,#F6B500);border-radius:12px;padding:11px 26px;margin-top:4px}
.hmx-offer-code strong{font-family:var(--hmx-display);font-weight:900;letter-spacing:.18em;color:#FFD15C;font-size:1.15rem}
.hmx-offer-timer{text-align:center}
.hmx-cd-label{font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;opacity:.85;margin-bottom:10px;color:#fff}
.hmx-cd-row{display:flex;gap:10px;justify-content:center;align-items:center}
.hmx-cd-block{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:14px;padding:13px 6px;width:70px;text-align:center;color:#fff}
.hmx-cd-block span{font-family:var(--hmx-display);font-size:1.8rem;font-weight:900;display:block;line-height:1}
.hmx-cd-block small{font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;opacity:.85}
.hmx-cd-sep{font-weight:900;font-size:1.4rem;opacity:.6;color:#fff}

/* Compat responsive */
@media (max-width:1000px){
  .hmx-hero-main{grid-template-columns:1fr}
  .hmx-hero-main .hmx-hero-slider{order:-1;min-height:380px;margin-bottom:10px}
  .hmx-testi-grid{grid-template-columns:1fr 1fr}
  .hmx-offer-inner{grid-template-columns:1fr}
}
@media (max-width:640px){
  .hmx-section{padding:58px 0}
  .hmx-testi-grid{grid-template-columns:1fr}
  .hmx-cd-block{width:60px;padding:10px 4px}
}