.cc-promo[hidden], .cc-promo [hidden] { display: none !important; }
.cc-promo { position: fixed; inset: 0; z-index: 10000; display: grid; place-items: center; padding: 24px; color: #f0f0e8; font-family: 'Space Grotesk',Arial,sans-serif; }
.cc-promo *, .cc-promo *::before { box-sizing: border-box; }
.cc-promo-backdrop { position: absolute; inset: 0; background: #080909d9; }
.cc-promo-card { position: relative; width: min(100%,540px); max-height: calc(100dvh - 48px); overflow: auto; overscroll-behavior: contain; background: #151719; border: 1px solid #ffffff30; border-top: 3px solid #f5c300; border-radius: 4px; box-shadow: 0 30px 90px #0006; animation: cc-promo-enter .3s ease both; }
.cc-promo-close { position: sticky; top: 12px; float: right; z-index: 2; margin: 12px 12px -48px 0; width: 36px; height: 36px; border: 1px solid #ffffff40; border-radius: 50%; background: #0b0c0e; color: #f0f0e8; font-size: 25px; line-height: 1; cursor: pointer; }
.cc-promo-image { aspect-ratio: 16/9; background: #0b0c0e; }
.cc-promo-image img { display: block; width: 100%; height: 100%; object-fit: contain; }
.cc-promo-copy { padding: clamp(25px,5vw,42px); }
.cc-promo-eyebrow { padding-right: 24px; color: #f5c300; font: 9px/1.7 'JetBrains Mono',monospace; letter-spacing: .1em; }
.cc-promo-eyebrow > span { color: #a4a5a1; }
.cc-promo-mark { display: block; margin-top: 22px; color: #f5c300; font-size: 52px; line-height: 1; }
.cc-promo #promo-popup-title { color: #f0f0e8; font-size: clamp(30px,5vw,44px); line-height: 1.08; font-weight: 500; letter-spacing: -.045em; overflow-wrap: anywhere; margin: 20px 0 16px; }
.cc-promo #promo-popup-subtitle { color: #b8bab2; font-size: 14px; line-height: 1.8; margin: 0 0 26px; overflow-wrap: anywhere; white-space: pre-line; }
.cc-promo-cta { display: flex; align-items: center; justify-content: space-between; gap: 20px; background: #f5c300; color: #0b0c0e; padding: 17px 20px; border: 1px solid #f5c300; border-radius: 3px; font-size: 14px; font-weight: 700; text-decoration: none; overflow-wrap: anywhere; }
.cc-promo-cta:hover { color: #0b0c0e; background: #ffda47; border-color: #ffda47; }
.cc-promo-cta > span:last-child { font-size: 24px; }
.cc-promo-skip { display: block; margin: 16px auto 0; padding: 8px; color: #b8bab2; background: none; border: 0; font-size: 12px; cursor: pointer; }
.cc-promo-skip:hover { color: #f0f0e8; text-decoration: underline; }
.cc-promo :is(a,button):focus-visible { outline: 2px solid #f5c300; outline-offset: 3px; }
.cc-promo[data-mode="sidebar"] { justify-items: end; }
.cc-promo[data-mode="sidebar"] .cc-promo-card { width: min(100%,420px); }
.cc-promo[data-mode="fullscreen"] .cc-promo-card { width: min(100%,1000px); }
.cc-promo[data-mode="fullscreen"] .cc-promo-copy { max-width: 750px; margin: auto; }
.cc-promo[data-mode="fullscreen"] .cc-promo-image { aspect-ratio: auto; height: min(38dvh,360px); }
.cc-promo[data-mode="banner-bottom"] { align-items: end; pointer-events: none; padding: 18px; }
.cc-promo[data-mode="banner-bottom"] .cc-promo-backdrop { display: none; }
.cc-promo[data-mode="banner-bottom"] .cc-promo-card { width: min(100%,1160px); max-height: min(60dvh,420px); pointer-events: auto; }
.cc-promo[data-mode="banner-bottom"] .cc-promo-copy { display: grid; grid-template-columns: 1fr auto; gap: 8px 32px; padding: 24px 64px 24px 28px; }
.cc-promo[data-mode="banner-bottom"] .cc-promo-eyebrow { grid-column: 1; }
.cc-promo[data-mode="banner-bottom"] #promo-popup-title { font-size: 25px; margin: 0; grid-column: 1; }
.cc-promo[data-mode="banner-bottom"] #promo-popup-subtitle { margin: 0; grid-column: 1; font-size: 13px; }
.cc-promo[data-mode="banner-bottom"] .cc-promo-cta { grid-column: 2; grid-row: 1/4; align-self: center; max-width: 300px; }
.cc-promo[data-mode="banner-bottom"] :is(.cc-promo-mark,.cc-promo-skip,.cc-promo-image) { display: none; }
@keyframes cc-promo-enter { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
@media (max-width:600px) {
  .cc-promo { padding: 16px; } .cc-promo-card { max-height: calc(100dvh - 32px); }
  .cc-promo[data-mode="banner-bottom"] { padding: 10px; }
  .cc-promo[data-mode="banner-bottom"] .cc-promo-copy { display: block; padding: 22px; }
  .cc-promo[data-mode="banner-bottom"] .cc-promo-eyebrow { padding-right: 30px; }
  .cc-promo[data-mode="banner-bottom"] #promo-popup-title { margin: 12px 0; font-size: 24px; }
  .cc-promo[data-mode="banner-bottom"] .cc-promo-cta { margin-top: 16px; max-width: none; }
}
@media (prefers-reduced-motion:reduce) { .cc-promo-card { animation: none; } }