/* Pré-black (até 02/11). Tudo aqui só vale com a classe chypps-pre-black no body. */

/* ---------- topo, menu e rodapé: mesmo conteúdo, fundo preto ---------- */
body.chypps-pre-black .header-top,
body.chypps-pre-black .header-bg-color,
body.chypps-pre-black .header-bottom,
body.chypps-pre-black .footer-1,
body.chypps-pre-black .footer-widgets,
body.chypps-pre-black .absolute-footer {
    background-color: #000 !important;
}
/* o menu tinha texto cinza para fundo claro; no preto ele precisa ser claro para continuar legível */
body.chypps-pre-black .header:not(.transparent) .header-bottom-nav.nav > li > a {
    color: rgba(255, 255, 255, .82);
}
body.chypps-pre-black .header:not(.transparent) .header-bottom-nav.nav > li > a:hover,
body.chypps-pre-black .header:not(.transparent) .header-bottom-nav.nav > li.active > a,
body.chypps-pre-black .header:not(.transparent) .header-bottom-nav.nav > li.current > a,
body.chypps-pre-black .header:not(.transparent) .header-bottom-nav.nav > li.current-menu-item > a {
    color: #fff;
}

/* ---------- peças comuns ---------- */
.chypps-pb-band, .chypps-pb-slide { font-family: "Poppins", "Segoe UI", system-ui, sans-serif; color: #eef6f8; -webkit-font-smoothing: antialiased; }
.chypps-pb-band *, .chypps-pb-slide * { box-sizing: border-box; }
.chypps-pb-band img, .chypps-pb-slide img { display: block; max-width: none; margin: 0; }
.chypps-pb-band p, .chypps-pb-slide p { margin: 0; }

.chypps-pb-btn { position: relative; overflow: hidden; display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 12px 14px 12px 22px; border-radius: 99px;
    background: linear-gradient(180deg, #58dff6, #13a9cf); color: #fff !important; text-decoration: none !important; font-family: "Poppins", sans-serif; font-weight: 700; font-size: 14px; line-height: 1.2; white-space: nowrap;
    box-shadow: 0 8px 24px rgba(28, 200, 234, .35), inset 0 1px 0 rgba(255, 255, 255, .45); transition: transform .2s, box-shadow .2s; }
.chypps-pb-btn:hover { transform: translateY(-2px); box-shadow: 0 12px 32px rgba(28, 200, 234, .5); }
.chypps-pb-btn::after { content: ""; position: absolute; top: 0; bottom: 0; width: 40%; left: -60%; background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .55), transparent); transform: skewX(-20deg); animation: chypps-pb-sweep 3.6s 2s ease-in-out infinite; }
.chypps-pb-btn svg { width: 17px; height: 17px; flex: none; }
.chypps-pb-arrow { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: #fff; color: #0e9cc2; font-size: 13px; font-weight: 800; }

/* ---------- faixa da contagem (páginas internas) ---------- */
.chypps-pb-band { position: relative; overflow: hidden; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 28px; padding: 14px max(20px, calc(50% - 600px));
    background: radial-gradient(60% 160% at 62% 50%, rgba(28, 200, 234, .28), transparent 60%), linear-gradient(90deg, #000, #031218 55%, #000); border-bottom: 1px solid rgba(28, 200, 234, .25); }
.chypps-pb-band::before { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(90deg, rgba(28, 200, 234, .06) 0 1px, transparent 1px 44px); pointer-events: none; }
.chypps-pb-band > * { position: relative; }
.chypps-pb-band-logo { height: 48px; width: auto; filter: drop-shadow(0 0 14px rgba(28, 200, 234, .35)); }
.chypps-pb-band-mid { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.chypps-pb-band-label { font: 700 11px/1.3 "JetBrains Mono", Consolas, monospace; letter-spacing: .12em; text-transform: uppercase; color: #1cc8ea; }
.chypps-pb-band-label small { display: block; font: 500 12px/1.3 "Poppins", sans-serif; letter-spacing: 0; text-transform: none; color: #cfe3ea; }
.chypps-pb-boxes { display: flex; gap: 6px; font-variant-numeric: tabular-nums; }
.chypps-pb-boxes div { display: flex; flex-direction: column; align-items: center; min-width: 52px; padding: 6px 6px 5px; border: 1px solid rgba(28, 200, 234, .25); border-radius: 4px; background: rgba(0, 0, 0, .55); }
.chypps-pb-boxes strong { font: 700 20px/1 "JetBrains Mono", Consolas, monospace; color: #fff; }
.chypps-pb-boxes .chypps-pb-boxes-d strong { color: #8beefc; text-shadow: 0 0 10px rgba(28, 200, 234, .6); }
.chypps-pb-boxes small { margin-top: 3px; font-size: 9px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: #8a9da3; }

@media (max-width: 849px) {
    .chypps-pb-band { gap: 10px 12px; padding: 10px 16px 12px; }
    .chypps-pb-band-logo { height: 30px; }
    .chypps-pb-band-label { display: none; }
    .chypps-pb-boxes { gap: 4px; }
    .chypps-pb-boxes div { min-width: 40px; padding: 5px 4px 4px; }
    .chypps-pb-boxes strong { font-size: 15px; }
    .chypps-pb-boxes small { font-size: 8px; }
    .chypps-pb-band .chypps-pb-btn { width: 100%; padding-block: 10px; font-size: 13px; }
}

/* ---------- banner da contagem no carrossel da home ---------- */
/* segura o carrossel até o banner entrar como primeiro slide (ou 1,5 s, se o script falhar) */
body.chypps-pre-black.home .slider-wrapper .slider { opacity: 0; animation: chypps-pb-reveal .01s 1.5s forwards; }
body.chypps-pre-black.chypps-pb-ready .slider-wrapper .slider { opacity: 1; animation: none; }

.chypps-pb-slide { position: relative; width: 100%; height: 550px; overflow: hidden; background: #02080b; }
.chypps-pb-slide canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.chypps-pb-shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(2, 8, 11, .97) 0%, rgba(2, 8, 11, .85) 30%, rgba(2, 8, 11, .25) 52%, rgba(2, 8, 11, .1) 70%, rgba(2, 8, 11, .6) 100%); }
.chypps-pb-glow { position: absolute; left: 58%; top: 50%; width: 640px; height: 640px; transform: translate(-50%, -50%); background: radial-gradient(circle, rgba(60, 215, 245, .4) 0%, rgba(28, 200, 234, .1) 38%, transparent 66%); mix-blend-mode: screen; animation: chypps-pb-pulse 4.2s ease-in-out infinite; pointer-events: none; }
.chypps-pb-hud { position: absolute; top: 16px; font: 500 11px/1 "JetBrains Mono", Consolas, monospace; letter-spacing: .14em; color: #8beefc; opacity: .85; font-variant-numeric: tabular-nums; }
.chypps-pb-hud-l { left: 22px; } .chypps-pb-hud-r { right: 22px; }
.chypps-pb-copy { position: absolute; left: max(24px, calc(50% - 585px)); top: 50%; transform: translateY(-50%); width: 470px; display: flex; flex-direction: column; align-items: flex-start; }
.chypps-pb-eyebrow { margin-bottom: 10px !important; font: 700 13px/1 "JetBrains Mono", Consolas, monospace; letter-spacing: .12em; text-transform: uppercase; color: #1cc8ea; text-shadow: 0 0 12px rgba(28, 200, 234, .5); }
.chypps-pb-eyebrow i { display: inline-block; width: .6em; height: 1em; margin-left: 3px; vertical-align: -2px; background: #1cc8ea; animation: chypps-pb-blink .8s steps(1) infinite; }
.chypps-pb-logo { width: 280px !important; height: auto !important; filter: drop-shadow(0 0 20px rgba(28, 200, 234, .3)); }
.chypps-pb-counter { display: flex; align-items: center; gap: 22px; margin: 14px 0; }
.chypps-pb-ring { position: relative; flex: none; width: 140px; height: 140px; display: grid; place-items: center; }
.chypps-pb-ring svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.chypps-pb-spin { transform-origin: 50% 50%; animation: chypps-pb-spin 16s linear infinite; }
.chypps-pb-prog { filter: drop-shadow(0 0 4px #1cc8ea); }
.chypps-pb-ring .tick { fill: rgba(139, 238, 252, .18); }
.chypps-pb-ring .tick.done { fill: #1cc8ea; }
.chypps-pb-ring .tick.now { fill: #fff; animation: chypps-pb-blink 1.2s steps(1) infinite; }
.chypps-pb-num { position: relative; font-weight: 800; font-size: 68px; line-height: 1; letter-spacing: -.03em; font-variant-numeric: tabular-nums;
    background: linear-gradient(180deg, #fff 0%, #e2f3f7 46%, #6fe0f5 56%, #12a6cc 100%); -webkit-background-clip: text; background-clip: text; color: transparent; filter: drop-shadow(0 0 14px rgba(28, 200, 234, .45)); }
.chypps-pb-side { display: flex; flex-direction: column; align-items: flex-start; gap: 7px; }
.chypps-pb-pre { font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: #8a9da3; }
.chypps-pb-unit { padding: .14em .45em .1em; font-weight: 800; font-size: 30px; line-height: 1; color: #021016; text-transform: uppercase; background: linear-gradient(180deg, #6fe3f7, #1cc8ea); box-shadow: 0 8px 24px rgba(28, 200, 234, .35); }
.chypps-pb-clock { display: flex; gap: 6px; font-variant-numeric: tabular-nums; }
.chypps-pb-clock div { display: flex; flex-direction: column; align-items: center; min-width: 48px; padding: 6px 4px 5px; border: 1px solid rgba(28, 200, 234, .25); border-radius: 4px; background: rgba(2, 8, 11, .6); }
.chypps-pb-clock strong { font: 700 18px/1 "JetBrains Mono", Consolas, monospace; color: #fff; }
.chypps-pb-clock small { margin-top: 3px; font-size: 8.5px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: #8a9da3; }
.chypps-pb-days { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 4px; width: 430px; margin: 0 0 18px !important; padding: 0 !important; list-style: none !important; }
.chypps-pb-days li { display: flex; align-items: center; justify-content: center; height: 36px; margin: 0 !important; border: 1px solid rgba(139, 238, 252, .16); border-radius: 3px; background: rgba(2, 8, 11, .55); font-weight: 700; font-size: 12px; line-height: 1.05; color: #7f969d; text-align: center; }
.chypps-pb-days li.past { color: #4d6168; border-color: rgba(28, 200, 234, .25); box-shadow: inset 0 -3px 0 rgba(28, 200, 234, .7); }
.chypps-pb-days li.today { color: #021016; background: #1cc8ea; border-color: #1cc8ea; }
.chypps-pb-days li.goal { color: #8beefc; border-color: #1cc8ea; font-size: 9px; }
.chypps-pb-ninja { position: absolute; left: 58%; bottom: 26px; height: 480px !important; width: auto !important; transform: translateX(-50%); filter: drop-shadow(0 0 28px rgba(28, 200, 234, .35)); animation: chypps-pb-float 5s ease-in-out infinite; }
.chypps-pb-pad { position: absolute; left: 58%; bottom: 14px; width: 320px; height: 54px; transform: translateX(-50%); border-radius: 50%; border: 2px solid rgba(139, 238, 252, .85); box-shadow: 0 0 20px rgba(28, 200, 234, .9), inset 0 0 18px rgba(28, 200, 234, .7); }
.chypps-pb-offer { position: absolute; right: max(24px, calc(50% - 585px)); top: 50%; transform: translateY(-50%); display: flex; flex-direction: column; align-items: flex-end; line-height: .82; }
.chypps-pb-offer span { font-weight: 600; font-size: 36px; }
.chypps-pb-offer b { font-weight: 900; font-size: 128px; letter-spacing: -.04em; background: linear-gradient(180deg, #fff 0%, #e4f2f6 45%, #a9c3cb 52%, #fff 70%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.chypps-pb-offer em { font-style: normal; font-weight: 900; font-size: 86px; color: #1cc8ea; text-shadow: 0 0 34px rgba(28, 200, 234, .55); }

@media (max-width: 1180px) {
    .chypps-pb-offer { display: none; }
    .chypps-pb-ninja, .chypps-pb-pad, .chypps-pb-glow { left: 74%; }
}
@media (max-width: 849px) {
    .chypps-pb-ninja, .chypps-pb-pad { display: none; }
}
@media (max-width: 549px) {
    .chypps-pb-slide { height: 600px; }
    .chypps-pb-shade { background: linear-gradient(180deg, rgba(2, 8, 11, .1) 0%, rgba(2, 8, 11, .3) 28%, rgba(2, 8, 11, .92) 40%, rgba(2, 8, 11, .97) 100%); }
    .chypps-pb-glow { left: 40%; top: 18%; width: 420px; height: 420px; }
    .chypps-pb-hud { top: 14px; font-size: 9.5px; } .chypps-pb-hud-l { left: 16px; } .chypps-pb-hud-r { right: 16px; }
    .chypps-pb-ninja, .chypps-pb-pad { display: block; }
    .chypps-pb-ninja { left: 34%; top: 26px; bottom: auto; height: 190px !important; }
    .chypps-pb-pad { left: 34%; top: 196px; bottom: auto; width: 140px; height: 24px; }
    .chypps-pb-offer { display: flex; right: 18px; top: 60px; transform: none; }
    .chypps-pb-offer span { font-size: 20px; } .chypps-pb-offer b { font-size: 64px; } .chypps-pb-offer em { font-size: 44px; }
    .chypps-pb-copy { left: 16px; right: 16px; width: auto; top: 226px; transform: none; align-items: center; text-align: center; }
    .chypps-pb-eyebrow { font-size: 11px; margin-bottom: 8px !important; }
    .chypps-pb-logo { width: 220px !important; }
    .chypps-pb-counter { gap: 14px; margin: 12px 0; }
    .chypps-pb-ring { width: 108px; height: 108px; }
    .chypps-pb-num { font-size: 52px; }
    .chypps-pb-pre { font-size: 9.5px; }
    .chypps-pb-unit { font-size: 24px; }
    .chypps-pb-clock div { min-width: 40px; }
    .chypps-pb-clock strong { font-size: 15px; }
    .chypps-pb-days { width: 100%; gap: 3px; margin-bottom: 12px !important; }
    .chypps-pb-days li { height: 30px; font-size: 11px; }
    .chypps-pb-days li.goal { font-size: 7.5px; }
    .chypps-pb-copy .chypps-pb-btn { width: 100%; }
}

@keyframes chypps-pb-reveal { to { opacity: 1; } }
@keyframes chypps-pb-pulse { 0%, 100% { opacity: .65; transform: translate(-50%, -50%) scale(.94); } 50% { opacity: 1; transform: translate(-50%, -50%) scale(1.06); } }
@keyframes chypps-pb-blink { 50% { opacity: 0; } }
@keyframes chypps-pb-spin { to { transform: rotate(360deg); } }
@keyframes chypps-pb-float { 0%, 100% { translate: 0 0; } 50% { translate: 0 -6px; } }
@keyframes chypps-pb-sweep { 0%, 70% { left: -60%; } 100% { left: 130%; } }
@media (prefers-reduced-motion: reduce) {
    .chypps-pb-slide *, .chypps-pb-band * { animation: none !important; transition: none !important; }
}