/* Black Friday 2026 (DECISIONS 2026-11-08-01): the offer banner and the countdown, ported from INKLINE
   (inkline.css .ik-offer, .ik-countdown; DESIGN §25) for the self-contained landing page. Only the parts
   the page uses: no offer line, no roll, no crowd. The --ik-* tokens are INKLINE's ink-theme values.
   Shown only while <html> carries .bf (set at render and by the head script from the clock). */

:root {
  --ik-ink: #090A0C; --ik-paper: #F6F3EC; --ik-faint: #8E897D;
  --ik-bg: var(--ik-ink); --ik-surface-2: #1B1B1B;
  --ik-text: var(--ik-paper); --ik-text-2: #A9A497; --ik-text-3: #6E6A60;
  --ik-solid: var(--ik-paper); --ik-on-solid: var(--ik-ink);
  --ik-outline: color-mix(in srgb, var(--ik-faint) 34%, transparent);
  --ik-hair: 1px; --ik-r-lg: 18px; --ik-r-xl: 26px; --ik-s-6: 24px; --ik-s-7: 32px; --ik-sink: 4px;
  --ik-track-label: 0.1em;
  --ik-font-display: "Bricolage Grotesque", system-ui, sans-serif;
  --ik-font-body: "Instrument Sans", system-ui, sans-serif;
  --ik-quick: 160ms cubic-bezier(0.2, 0.9, 0.25, 1);
}

/* the clock decides: campaign pieces only inside the window, today's pieces only outside it */
html:not(.bf) [data-bf] { display: none !important; }
html.bf [data-bf-off] { display: none !important; }
html.bf .plan--ic .plan__p:not([data-bf]) { display: none !important; }

/* placement on the page */
.bf-slim { max-width: 980px; margin: 0 auto 28px; }
.plan__p s { font: 700 clamp(24px, 2.4vw, 30px)/1 var(--display); letter-spacing: -.03em; color: var(--t3); text-decoration-thickness: .07em; }

/* ── .ik-offer: an ink slab, the one banner of a screen ─────────────────── */
.ik-offer { position: relative; isolation: isolate; container-type: inline-size; display: flex; flex-wrap: wrap; gap: var(--ik-s-6) var(--ik-s-7); padding: 28px 28px 28px 32px; border-radius: var(--ik-r-xl); overflow: hidden; background: var(--ik-bg); color: var(--ik-text); }
.ik-offer::after { content: ""; position: absolute; inset: 0; z-index: 2; border-radius: inherit; box-shadow: inset 0 0 0 var(--ik-hair) var(--ik-outline); pointer-events: none; }
.ik-offer__main { flex: 1 1 24rem; display: grid; align-content: start; gap: 12px; max-width: 35rem; min-width: 0; }
.ik-offer__kicker { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; color: var(--ik-text-2); font: 600 11px/1.2 var(--ik-font-body); letter-spacing: var(--ik-track-label); text-transform: uppercase; }
.ik-offer__kicker b { color: var(--ik-text); font-weight: 600; }
.ik-offer__pulse { position: relative; width: 8px; height: 8px; flex: none; border-radius: 50%; background: var(--ik-text); }
.ik-offer__pulse::after { content: ""; position: absolute; inset: -4px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px var(--ik-text); opacity: 0; animation: ik-offer-pulse 2.4s cubic-bezier(.2, .9, .25, 1) infinite; }
@media (prefers-reduced-motion: reduce) { .ik-offer__pulse::after { animation: none; } }
.ik-offer__title { margin: 0; font: 800 clamp(32px, 4.4vw, 54px)/0.98 var(--ik-font-display); letter-spacing: -0.038em; text-wrap: balance; }
.ik-offer__title s { color: var(--ik-text-3); font-weight: 700; text-decoration-thickness: .07em; font-size: .62em; margin-left: .12em; }
.ik-offer__text { margin: 0; color: var(--ik-text-2); font: 400 16px/1.5 var(--ik-font-body); max-width: 33rem; }
.ik-offer__text b { color: var(--ik-text); font-weight: 600; }
.ik-offer__side { flex: 1 0 auto; display: grid; align-content: space-between; justify-items: end; gap: 22px; min-width: 0; }
.ik-offer__clock { display: grid; justify-items: end; gap: 10px; }
.ik-offer__clocklabel { color: var(--ik-text-2); font: 600 11px/1.2 var(--ik-font-body); letter-spacing: var(--ik-track-label); text-transform: uppercase; text-align: right; }
.ik-offer__act { display: grid; justify-items: end; gap: 10px; padding-bottom: var(--ik-sink); }
.ik-offer__cta { white-space: nowrap; }
.ik-offer__note { color: var(--ik-text-2); font: 500 13px/1.3 var(--ik-font-body); text-align: right; }
@container (max-width: 760px) { .ik-offer__side { flex-basis: 100%; display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 18px 24px; } }
@container (max-width: 760px) { .ik-offer__clock, .ik-offer__act { justify-items: start; } }
@container (max-width: 760px) { .ik-offer__clocklabel, .ik-offer__note { text-align: left; } }
@container (max-width: 760px) { .ik-offer__main { max-width: none; } }
@container (max-width: 520px) { .ik-offer__act, .ik-offer__act .btn { width: 100%; } }
@container (max-width: 520px) { .ik-offer .ik-countdown__digit { font-size: 32px; } }
@container (max-width: 520px) { .ik-offer__text { display: none; } }
@container (max-width: 520px) { .ik-offer__title { font-size: 30px; } }
@media (max-width: 760px) { .ik-offer { padding: 22px 18px 20px; gap: 18px; } }
/* slim: the same offer on one line */
.ik-offer--slim { container-type: normal; align-items: center; gap: 8px 16px; padding: 12px 18px; border-radius: var(--ik-r-lg); }
.ik-offer--slim .ik-offer__text { flex: 1 1 260px; max-width: none; color: var(--ik-text); font: 500 15px/1.4 var(--ik-font-body); }
.ik-offer--slim .ik-offer__text .ik-countdown--inline { font-size: 1.05em; }
@media (max-width: 760px) { .ik-offer--slim { padding: 10px 14px; gap: 8px 12px; } }
@keyframes ik-offer-pulse { 0% { transform: scale(.5); opacity: .9; } 70%, 100% { transform: scale(1.7); opacity: 0; } }

/* ── .ik-countdown: to a real moment only ──────────────────────────────── */
.ik-countdown { display: inline-flex; align-items: flex-start; gap: 10px; font-variant-numeric: tabular-nums; }
.ik-countdown__unit { display: grid; justify-items: center; gap: 7px; }
.ik-countdown__num { display: flex; gap: 3px; }
.ik-countdown__digit { position: relative; display: grid; width: 0.74em; height: 1.18em; overflow: hidden; border-radius: 9px; background: var(--ik-surface-2); color: var(--ik-text); font: 800 44px/1 var(--ik-font-display); letter-spacing: -0.02em; box-shadow: inset 0 0 0 var(--ik-hair) var(--ik-outline); transition: background var(--ik-quick), color var(--ik-quick); }
.ik-countdown__digit > span { grid-area: 1 / 1; display: grid; place-items: center; }
.ik-countdown__digit::after { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: var(--ik-hair); background: var(--ik-bg); opacity: .85; }
.ik-countdown__label { color: var(--ik-text-2); font: 600 10px/1 var(--ik-font-body); letter-spacing: var(--ik-track-label); text-transform: uppercase; }
/* the last day: the tiles turn to chalk */
.ik-countdown:not(.ik-countdown--inline).is-last .ik-countdown__digit { background: var(--ik-solid); color: var(--ik-on-solid); box-shadow: none; }
.ik-countdown.is-last .ik-countdown__digit::after { background: var(--ik-on-solid); opacity: .25; }
.ik-countdown:empty { min-height: 69px; }
.ik-countdown--inline:empty { min-height: 0; }
.ik-countdown--inline { display: inline-flex; align-items: baseline; gap: 0; font: 700 1em/1 var(--ik-font-display); letter-spacing: -0.01em; }
.ik-countdown--inline .ik-countdown__unit { display: inline-flex; align-items: baseline; gap: 0; }
.ik-countdown--inline .ik-countdown__num { gap: 0; }
.ik-countdown--inline .ik-countdown__digit { width: 0.6em; height: 1.15em; border-radius: 0; background: none; box-shadow: none; color: inherit; font: inherit; }
.ik-countdown--inline .ik-countdown__digit::after { display: none; }
.ik-countdown--inline .ik-countdown__label { margin-right: .25em; color: inherit; font: inherit; letter-spacing: 0; text-transform: none; }
.ik-countdown--inline .ik-countdown__sep { opacity: .5; }
.ik-countdown--inline.is-last { color: var(--ik-text); text-decoration: underline 1.5px; text-underline-offset: 4px; }

/* ── myicor.com/black-friday (2026-11-10): the page around the offer banner ───────────────────────── */
.bfp-nav { gap: 6px; }
.bfp-hero { padding: clamp(120px, 14vh, 160px) 0 clamp(64px, 8vw, 110px); }
.bfp-hero__in { display: grid; gap: 22px; }
.bfp-h1 { font-size: clamp(40px, 6vw, 84px); max-width: 16ch; }
.bfp-hero .lede { max-width: 46ch; }
.bfp-hero .ik-offer { margin-top: 18px; }
.bfp-act { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 10px; }
.bfp-act .ik-offer__note { flex-basis: 100%; }
@container (max-width: 760px) { .bfp-act { justify-content: flex-start; } }
@container (max-width: 520px) { .bfp-act .btn { flex: 1 1 100%; } }
.bfp-voices__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 28px; }
.bfp-voices__list figure { display: grid; gap: 22px; align-content: space-between; height: 100%; padding: 26px 26px 24px; border-radius: 20px; background: var(--paper-1); box-shadow: inset 0 0 0 1px var(--paper-rule); }
.bfp-voices__list blockquote { font: 600 19px/1.45 var(--body); color: var(--ink); text-wrap: pretty; }
.bfp-voices__list figcaption { display: flex; align-items: center; gap: 12px; font-size: 14px; color: var(--t2p); }
.bfp-voices__list figcaption b { display: block; color: var(--ink); font-weight: 600; }
.bfp-face { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; flex: none; background: var(--paper-2); }
@media (max-width: 900px) { .bfp-voices__list { grid-template-columns: minmax(0, 1fr); } }
.bfp-inside .h2 { margin-top: 14px; }
.bfp-inside__list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 32px; max-width: 980px; margin-top: 28px; border-top: 0; padding-top: 0; font-size: 17px; }
@media (max-width: 760px) { .bfp-inside__list { grid-template-columns: minmax(0, 1fr); } }
.bfp-price .h2 { text-align: center; margin-bottom: 28px; }
.bfp-plans { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 860px; margin-inline: auto; }
@media (max-width: 760px) { .bfp-plans { grid-template-columns: minmax(0, 1fr); } }
.bfp-plans .plan__w .ik-countdown--inline { color: var(--paper); }
