/* Black Friday / Cyber Monday 2026 (bf2026.js adds these elements only during the sale). Delete after the sale. */
.bf-tag { position: relative; display: inline-grid; place-items: center start; width: 176px; height: 70px; transform: rotate(6deg); flex-shrink: 0; }
.bf-tag-shape { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.bf-tag-shape path:first-child { fill: #0B1214; stroke: var(--gold); stroke-width: 2; }
.bf-tag-shape circle { fill: none; stroke: var(--gold); stroke-width: 2; }
.bf-tag-shape .bf-star { fill: var(--cream); }
.bf-tag-text { position: relative; padding: 0 30px 0 34px; font: 800 .8rem/1.15 var(--font, sans-serif); letter-spacing: .05em; text-transform: uppercase; color: var(--gold); }
.bf-cm .bf-tag-shape path:first-child { fill: var(--violet-ink); stroke: var(--lavender); }
.bf-cm .bf-tag-shape circle { stroke: var(--lavender); }
.bf-cm .bf-tag-shape .bf-star { fill: var(--lavender); }
.bf-cm .bf-tag-text { color: #fff; }

/* Floating corner tag with the countdown, under the top bar. */
.bf-corner { position: fixed; top: 86px; right: 18px; z-index: 45; display: flex; flex-direction: column; align-items: center; gap: 2px; text-decoration: none; filter: drop-shadow(0 8px 18px rgba(0, 0, 0, .35)); animation: bf-in .8s cubic-bezier(.2, .8, .2, 1) both .6s; }
.bf-corner-time { font: 600 .82rem/1 var(--font, sans-serif); color: var(--cream); background: rgba(15, 25, 27, .85); padding: 5px 10px; border-radius: 999px; font-variant-numeric: tabular-nums; }
.bf-corner-time small { font-weight: 400; opacity: .7; }
.bf-corner:hover .bf-tag { transform: rotate(3deg) scale(1.04); transition: transform .3s; }
@keyframes bf-in { from { opacity: 0; transform: translateY(-14px) rotate(-4deg); } }
.no-motion .bf-corner { animation: none; }
@media (max-width: 720px) { .bf-corner { top: auto; bottom: 14px; right: 10px; transform: scale(.82); transform-origin: bottom right; } }

/* Deal panel in Pricing. */
.bf-panel { display: flex; align-items: center; gap: 22px; max-width: 760px; margin: 0 auto 28px; padding: 18px 22px; border-radius: 22px; background: var(--night); color: var(--cream); box-shadow: 0 18px 40px rgba(22, 34, 36, .18); }
.bf-panel-title { margin: 0; font-size: 1.3rem; font-weight: 600; }
.bf-panel-time { margin: 4px 0 6px; color: var(--gold); font-variant-numeric: tabular-nums; }
.bf-cm .bf-panel-time { color: var(--lavender); }
.bf-panel-note { margin: 0; font-size: .82rem; opacity: .75; }
@media (max-width: 640px) { .bf-panel { flex-direction: column; text-align: center; } }
.bf-was { font-size: 1.2rem; font-weight: 400; letter-spacing: 0; opacity: .5; vertical-align: middle; }
#pricing[data-period="monthly"] .bf-was { display: none; }
