/* Promotions (assets/promo.js). Colours follow the site: override --promo-bg / --promo-fg / --promo-accent. */
:root { --promo-bg: #0b0b12; --promo-fg: #fff; --promo-accent: #ffd84d; --promo-accent-fg: #0b0b12; }

/* the countdown bar at the top of every page */
.promo-bar { position: fixed; top: 0; left: 0; right: 0; z-index: 100000; background: var(--promo-bg); color: var(--promo-fg); font: 500 13px/1.3 Inter, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; }
.promo-bar__in { max-width: 1280px; margin: 0 auto; padding: 9px 16px; display: flex; align-items: center; justify-content: center; gap: 12px; flex-wrap: wrap; }
.promo-bar__tag { padding: 3px 9px; border-radius: 999px; background: var(--promo-accent); color: var(--promo-accent-fg); font-size: 11px; font-weight: 700; letter-spacing: .02em; }
.promo-bar__text { font-weight: 600; }
.promo-bar__left { opacity: .85; white-space: nowrap; }
.promo-clock--bar { font-variant-numeric: tabular-nums; font-weight: 700; opacity: 1; }
.promo-bar__cta { color: var(--promo-fg) !important; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }
.promo-bar__cta:hover { color: var(--promo-accent) !important; }
@media (max-width: 640px) { .promo-bar__in { gap: 6px 10px; padding: 8px 12px; font-size: 12px; } .promo-bar__tag { display: none; } }

/* the band: any element with data-promo="band" */
[data-promo="band"]:empty { display: none; }
.promo-band { background: var(--promo-bg); color: var(--promo-fg); border-radius: 16px; padding: 36px 32px; font-family: Inter, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; }
.promo-band__shell { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 28px 48px; align-items: center; }
.promo-band__tag { margin: 0 0 10px; display: inline-block; padding: 3px 10px; border-radius: 999px; background: var(--promo-accent); color: var(--promo-accent-fg); font-size: 12px; font-weight: 700; }
.promo-band__title { margin: 0 0 10px; font-size: 32px; line-height: 1.12; font-weight: 700; letter-spacing: -.02em; color: var(--promo-fg); }
.promo-band__text { margin: 0; max-width: 520px; font-size: 16px; line-height: 1.55; opacity: .88; }
.promo-band__side { display: flex; flex-direction: column; gap: 16px; align-items: stretch; }
.promo-clock--big { display: grid; grid-template-columns: repeat(4, minmax(64px, 1fr)); gap: 8px; }
.promo-clock__cell { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 12px 8px; border-radius: 10px; background: rgba(255, 255, 255, .08); }
.promo-clock__n { font-size: 32px; font-weight: 700; font-variant-numeric: tabular-nums; line-height: 1; }
.promo-clock__u { font-size: 11px; opacity: .7; }
.promo-band__cta { display: block; text-align: center; padding: 14px 20px; border-radius: 10px; background: var(--promo-fg); color: var(--promo-bg) !important; font-weight: 700; text-decoration: none; }
.promo-band__cta:hover { background: var(--promo-accent); }
@media (max-width: 760px) { .promo-band__shell { grid-template-columns: 1fr; } .promo-band__title { font-size: 26px; } }

/* prices */
.promo-was { margin-left: 8px; font-size: .55em; font-weight: 500; opacity: .55; vertical-align: middle; }
.promo-badge { margin-left: 8px; display: inline-block; padding: 2px 8px; border-radius: 999px; background: var(--promo-accent); color: var(--promo-accent-fg); font-size: .42em; font-weight: 700; vertical-align: middle; letter-spacing: 0; }

/* places.pill: compact badge (label · text · time left · button) */
.promo-pill { display: inline-flex; align-items: center; gap: 10px; max-width: calc(100vw - 24px); padding: 6px 6px 6px 7px; border-radius: 999px; background: var(--promo-bg); color: var(--promo-fg); font: 500 13px/1.25 Inter, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; box-shadow: 0 10px 30px -14px rgba(0, 0, 0, .45); white-space: nowrap; }
.promo-pill__tag { padding: 3px 9px; border-radius: 999px; background: var(--promo-accent); color: var(--promo-accent-fg); font-size: 11px; font-weight: 700; letter-spacing: .02em; }
.promo-pill__text { overflow: hidden; text-overflow: ellipsis; }
.promo-clock--pill { font-variant-numeric: tabular-nums; font-weight: 700; }
.promo-pill__cta { padding: 6px 12px; border-radius: 999px; background: var(--promo-fg); color: var(--promo-bg) !important; font-weight: 700; text-decoration: none !important; }
.promo-pill__cta:hover { opacity: .9; }
@media (max-width: 640px) { .promo-pill__text { display: none; } }
