/* TeamProKit — Black Friday & Cyber Monday homepage banner (store purple palette)
   Scoped, !important-hardened against SLINE theme overrides.
   Store palette: ink #24142d | brand #6a0dad | soft #f3e8ff | deep #5a0b9d | line #d9c4f0 | gold accent #f5c542 */
html{overflow-x:clip !important;}

.bfh-root{
  position:relative !important;
  margin:0 calc(50% - 50vw) !important;
  width:100vw !important;
  max-width:100vw !important;
  box-sizing:border-box !important;
  overflow:hidden !important;
  cursor:pointer !important;
  background:linear-gradient(150deg,#24142d 0%,#3d1466 46%,#6a0dad 100%) !important;
  color:#fff !important;
  font-family:inherit !important;
}
.bfh-root::after{
  content:"" !important;position:absolute !important;inset:0 !important;pointer-events:none !important;
  background:radial-gradient(760px 360px at 80% 10%,rgba(245,197,66,.20),transparent 62%),
             radial-gradient(620px 340px at 6% 92%,rgba(201,168,240,.22),transparent 60%) !important;
}
.bfh-in{
  position:relative !important;z-index:2 !important;
  max-width:1240px !important;margin:0 auto !important;
  padding:clamp(38px,5.4vw,64px) clamp(20px,4vw,48px) !important;
  display:flex !important;align-items:center !important;justify-content:space-between !important;gap:clamp(24px,4vw,56px) !important;
  box-sizing:border-box !important;
}
.bfh-l{flex:1 1 auto !important;min-width:0 !important;}
.bfh-r{flex:0 0 auto !important;text-align:right !important;}

.bfh-kicker{
  display:inline-flex !important;align-items:center !important;gap:8px !important;
  font-size:11px !important;font-weight:900 !important;letter-spacing:.18em !important;text-transform:uppercase !important;
  color:#24142d !important;background:#f5c542 !important;padding:7px 14px !important;border-radius:999px !important;
  line-height:1 !important;
}
.bfh-root h2{
  margin:16px 0 0 !important;padding:0 !important;
  font-size:clamp(28px,4.2vw,46px) !important;line-height:1.06 !important;font-weight:900 !important;
  letter-spacing:-.02em !important;color:#fff !important;
}
.bfh-root h2 em{font-style:normal !important;color:#f5c542 !important;}
.bfh-sub{
  margin:15px 0 0 !important;padding:0 !important;max-width:520px !important;
  font-size:clamp(14.5px,1.7vw,17px) !important;line-height:1.66 !important;color:#e6dcf5 !important;font-weight:600 !important;
}

/* countdown */
.bfh-cd{display:flex !important;gap:clamp(7px,1.2vw,12px) !important;margin-top:22px !important;flex-wrap:wrap !important;}
.bfh-cd-c{
  min-width:clamp(58px,8vw,74px) !important;padding:9px 8px 8px !important;border-radius:12px !important;
  background:rgba(255,255,255,.10) !important;border:1px solid rgba(245,197,66,.42) !important;text-align:center !important;
  transition:transform .3s cubic-bezier(.22,.61,.36,1) !important;
}
.bfh-cd-c.is-tick{transform:translateY(-3px) !important;}
.bfh-cd-n{
  display:block !important;font-size:clamp(20px,2.8vw,28px) !important;font-weight:900 !important;line-height:1 !important;
  color:#f5c542 !important;font-variant-numeric:tabular-nums !important;
}
.bfh-cd-l{
  display:block !important;margin-top:5px !important;font-size:9.5px !important;font-weight:900 !important;
  letter-spacing:.14em !important;text-transform:uppercase !important;color:#cbb8ea !important;
}

/* actions */
.bfh-acts{display:flex !important;flex-wrap:wrap !important;align-items:center !important;gap:14px !important;margin-top:26px !important;}
.bfh-codegroup{
  display:inline-flex !important;align-items:stretch !important;background:#fff !important;border-radius:12px !important;
  overflow:hidden !important;box-shadow:0 8px 20px rgba(0,0,0,.18) !important;
}
.bfh-code{display:flex !important;flex-direction:column !important;justify-content:center !important;padding:9px 16px !important;background:#fff !important;}
.bfh-code b{display:block !important;font-size:18px !important;font-weight:900 !important;letter-spacing:.10em !important;line-height:1.1 !important;color:#24142d !important;}
.bfh-code span{display:block !important;margin-top:2px !important;font-size:11px !important;font-weight:700 !important;color:#6b5377 !important;}
.bfh-root button.bfh-copy{
  cursor:pointer !important;border:0 !important;font-family:inherit !important;font-size:13px !important;font-weight:900 !important;
  letter-spacing:.04em !important;padding:0 20px !important;background:#f5c542 !important;color:#24142d !important;
  transition:background .24s ease,color .24s ease,transform .18s cubic-bezier(.22,.61,.36,1) !important;
}
.bfh-root button.bfh-copy:hover{background:#ffd45e !important;}
.bfh-root button.bfh-copy:active{transform:scale(.97) !important;}
.bfh-root button.bfh-copy.is-done{background:#2fbf71 !important;color:#fff !important;}
.bfh-root a.bfh-cta{
  display:inline-flex !important;align-items:center !important;padding:14px 28px !important;border-radius:12px !important;
  background:#fff !important;color:#4a0785 !important;font-weight:900 !important;font-size:14.5px !important;
  text-decoration:none !important;box-shadow:0 8px 20px rgba(0,0,0,.18) !important;
  transition:transform .18s cubic-bezier(.22,.61,.36,1),box-shadow .18s ease !important;
}
.bfh-root a.bfh-cta:hover{transform:translateY(-2px) !important;box-shadow:0 14px 30px rgba(0,0,0,.28) !important;}

/* big mark */
.bfh-mark{line-height:1 !important;}
.bfh-mark .bfh-big{
  display:block !important;font-size:clamp(46px,7vw,92px) !important;font-weight:900 !important;line-height:.92 !important;
  letter-spacing:-.03em !important;color:#fff !important;
}
.bfh-mark .bfh-big em{font-style:normal !important;color:#f5c542 !important;}
.bfh-mark .bfh-note{
  display:block !important;margin-top:12px !important;font-size:clamp(11.5px,1.35vw,13.5px) !important;font-weight:800 !important;
  letter-spacing:.14em !important;text-transform:uppercase !important;color:#dccff2 !important;
}

@media (max-width:899px){
  .bfh-in{flex-direction:column !important;align-items:flex-start !important;gap:22px !important;}
  .bfh-r{text-align:left !important;align-self:flex-start !important;}
  .bfh-mark .bfh-big{font-size:clamp(40px,13vw,64px) !important;}
  .bfh-cd{gap:7px !important;}
  .bfh-acts{width:100% !important;gap:10px !important;flex-wrap:nowrap !important;}
  /* keep code pill + CTA on one row: drop the small caption on phones */
  .bfh-code span{display:none !important;}
  .bfh-code{padding:12px 12px !important;}
  .bfh-codegroup{flex:1 1 0 !important;min-width:0 !important;justify-content:space-between !important;}
  .bfh-root button.bfh-copy{padding:13px 12px !important;font-size:12.5px !important;white-space:nowrap !important;}
  .bfh-root a.bfh-cta{flex:1 1 0 !important;min-width:0 !important;justify-content:center !important;padding:14px 10px !important;font-size:13px !important;white-space:nowrap !important;}
}
/* ---------- three-state phase visibility (pre-heat / active / ended) ---------- */
.bfh-status{
  display:none !important;align-items:center !important;gap:7px !important;
  font-size:11px !important;font-weight:900 !important;letter-spacing:.16em !important;text-transform:uppercase !important;
  color:#fff !important;background:rgba(47,191,113,.20) !important;border:1px solid rgba(47,191,113,.65) !important;
  padding:7px 14px !important;border-radius:999px !important;line-height:1 !important;width:fit-content !important;margin-bottom:14px !important;
}
.bfh-status::before{content:"" !important;width:7px !important;height:7px !important;border-radius:50% !important;background:#2fbf71 !important;box-shadow:0 0 0 0 rgba(47,191,113,.6) !important;animation:bfhPulse 1.6s ease-out infinite !important;}
@keyframes bfhPulse{0%{box-shadow:0 0 0 0 rgba(47,191,113,.55);}70%{box-shadow:0 0 0 7px rgba(47,191,113,0);}100%{box-shadow:0 0 0 0 rgba(47,191,113,0);}}
.bfh-root[data-phase="active"] .bfh-status{display:inline-flex !important;}
.bfh-root[data-phase="active"] .bfh-cd{display:none !important;}
.bfh-root[data-phase="ended"]{display:none !important;}

@media (max-width:899px){
  .bfh-status{font-size:10.5px !important;padding:6px 12px !important;margin-bottom:12px !important;}
}

@media (prefers-reduced-motion:reduce){
  .bfh-root *{animation:none !important;transition:none !important;}
  .bfh-status::before{animation:none !important;}
}