:root { --promo-height: calc(45px + env(safe-area-inset-top, 0px)); }
html { scroll-padding-top: calc(var(--promo-height) + 20px); }
body.builder-story { padding-top: var(--promo-height); }
.promo-bar {
  position: fixed;
  inset: 0 0 auto;
  z-index: 18;
  padding-top: env(safe-area-inset-top, 0px);
  background: #d4d4d4;
  color: var(--ink);
  border-bottom: 1px solid var(--ink);
  box-shadow: inset 0 -1px 0 var(--ink);
  transition: transform 260ms ease, opacity 260ms ease, visibility 0s;
}
.promo-bar.is-hidden {
  transform: translateY(-100%);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: transform 260ms ease, opacity 260ms ease, visibility 0s 260ms;
}
.promo-bar-link {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  min-height: 44px;
  max-width: 1200px;
  margin-inline: auto;
  padding: 5px 16px;
  font: 13px/1.4 var(--mono);
}
.promo-bar-label { display: flex; align-items: center; gap: 8px; font-weight: 700; white-space: nowrap; }
.promo-bar-tagline { font-weight: 700; }
.promo-bar-tagline::before { content: '· '; }
.promo-bar-offer {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-height: 30px;
  padding: 4px 10px;
  background: var(--ink);
  color: #d4d4d4;
  border: 1px solid var(--ink);
  white-space: nowrap;
}
.promo-bar-offer s { color: #c6c6c6; text-decoration-thickness: 1px; }
.promo-bar-offer strong { font-weight: 700; }
.promo-bar-payment { font-size: 12px; color: #e2e2e2; }
.promo-bar-cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 30px;
  padding: 3px 10px;
  background: var(--paper);
  color: var(--ink);
  border: 2px solid var(--ink);
  font-weight: 700;
  white-space: nowrap;
}
.promo-bar-link:hover .promo-bar-cta { text-decoration: underline; text-underline-offset: 3px; }
.promo-bar-link:focus-visible { outline: 2px solid var(--ink); outline-offset: -4px; }
.builder-story .enroll-price .price-original {
  margin-bottom: 8px;
  color: var(--muted);
  font: 18px/1.4 var(--mono);
}
.price-original s { text-decoration-thickness: 1px; }
@media (max-width: 1000px) {
  :root { --promo-height: calc(37px + env(safe-area-inset-top, 0px)); }
  .promo-bar-link { min-height: 36px; padding: 4px 10px; gap: 12px; font-size: 12px; }
  .promo-bar-offer, .promo-bar-tagline { display: none; }
  .promo-bar-cta { min-height: 26px; padding: 1px 8px; }
}
@media (max-width: 600px) {
  :root { --promo-height: calc(43px + env(safe-area-inset-top, 0px)); }
  .promo-bar-link { min-height: 42px; gap: 10px; font-size: 11px; }
  .promo-bar-label { flex: 0 1 auto; min-width: 0; white-space: normal; text-wrap: balance; }
  .promo-bar-cta { flex: none; }
}
@media (prefers-reduced-motion: reduce) {
  .promo-bar, .promo-bar.is-hidden { transition: none; }
}
@media print {
  .promo-bar { display: none; }
  body.builder-story { padding-top: 0; }
}