/* ==========================================================================
   NOVE Funding design system · v3 additions
   Parity components: ticker, tabs, chips, pricing, stats, timeline,
   conditions, help centre, blog, social, cookie banner, calendar, score.
   Same tokens as nove.css (white ground, red brand, yellow CTA).
   ========================================================================== */

/* ---------- promo ticker ---------- */
.site-ticker { background: var(--yellow); color: var(--ink); overflow: hidden; font-size: .8rem; font-weight: 600; letter-spacing: .04em; }
.site-ticker-track { display: flex; width: max-content; animation: ticker 28s linear infinite; }
.site-ticker-track span { padding: .5rem 3rem; white-space: nowrap; }
.site-ticker:hover .site-ticker-track { animation-play-state: paused; }

/* ---------- tabs and chips ---------- */
.tabs { display: flex; gap: .4rem; flex-wrap: wrap; border-bottom: 1px solid var(--border); margin-bottom: 1.4rem; }
.tab { padding: .7rem 1.1rem; border: 0; background: transparent; font: inherit; font-weight: 500; font-size: .92rem; color: var(--muted); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.tab:hover { color: var(--ink); }
.tab.active { color: var(--brand); border-bottom-color: var(--brand); }
.tab-panel { display: none; }
.tab-panel.active { display: block; }
.chips { display: flex; gap: .5rem; flex-wrap: wrap; }
.chip { padding: .5rem .95rem; border-radius: var(--pill); border: 1px solid var(--border-bright); background: #fff; font: inherit; font-size: .85rem; font-weight: 500; cursor: pointer; transition: all .15s; color: var(--ink); }
.chip:hover { border-color: var(--ink); }
.chip.active { background: var(--ink); color: #fff; border-color: var(--ink); }
.chip.chip-yellow.active { background: var(--yellow); color: var(--ink); border-color: var(--yellow); }
.chip small { display: block; font-size: .68rem; color: inherit; opacity: .7; font-weight: 400; }

/* ---------- pricing configurator ---------- */
.pricing { display: grid; grid-template-columns: 1.1fr .9fr; gap: 1.5rem; align-items: start; }
.pricing-hero { display: flex; align-items: baseline; gap: .6rem; margin: .4rem 0; }
.pricing-hero .price { font-size: 2.6rem; }
.pricing-hero .was { color: var(--muted); text-decoration: line-through; font-size: 1.1rem; }
.stage-table th:first-child, .stage-table td:first-child { font-weight: 600; color: var(--ink); }
.stage-badge { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--brand); color: #fff; font-family: var(--font-head); font-size: .75rem; font-weight: 700; margin-right: .5rem; }

/* ---------- stats strip ---------- */
.stats-strip { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.stats-strip .stat { border-left-color: var(--yellow); }

/* ---------- trader journey / timeline ---------- */
.timeline { position: relative; padding-left: 1.6rem; }
.timeline::before { content: ""; position: absolute; left: 7px; top: 6px; bottom: 6px; width: 2px; background: var(--border-bright); }
.timeline-item { position: relative; padding: 0 0 1.4rem; }
.timeline-item::before { content: ""; position: absolute; left: -1.6rem; top: 4px; width: 16px; height: 16px; border-radius: 50%; background: #fff; border: 3px solid var(--brand); }
.timeline-item.done::before { background: var(--brand); }
.timeline-item .when { font-family: var(--font-head); font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.timeline-item strong { display: block; font-family: var(--font-head); font-size: 1rem; }

/* ---------- conditions grid ---------- */
.cond-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.cond { background: #fff; border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 1.4rem; }
.cond .big { font-family: var(--font-head); font-size: 1.7rem; font-weight: 700; letter-spacing: -.02em; line-height: 1.1; }
.cond .lbl { font-size: .78rem; color: var(--muted); margin-top: .2rem; }
.asset-pills { display: flex; gap: .4rem; flex-wrap: wrap; margin-top: .6rem; }
.asset-pills span { padding: .3rem .7rem; border-radius: var(--pill); background: var(--surface-2); font-size: .78rem; font-weight: 500; }

/* ---------- help centre ---------- */
.help-hero { background: var(--ink); color: #fff; padding: 4rem 0 3rem; }
.help-hero h1 { color: #fff; font-size: clamp(2rem, 4vw, 3rem); }
.help-hero .lede { color: rgba(255,255,255,.7); }
.help-search { display: flex; gap: .6rem; max-width: 640px; position: relative; }
.help-search .input { padding: 1rem 1.2rem; border-radius: var(--pill); font-size: 1rem; }
.help-results { position: absolute; top: 110%; left: 0; right: 0; background: #fff; color: var(--ink); border-radius: var(--radius); box-shadow: var(--shadow-lg); z-index: 5; overflow: hidden; }
.help-results a { display: block; padding: .7rem 1rem; border-bottom: 1px solid var(--border); font-size: .9rem; }
.help-results a:hover { background: var(--surface-2); }
.help-results a small { display: block; color: var(--muted); font-size: .72rem; }
.help-popular { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: 1rem; align-items: center; }
.help-popular a { padding: .35rem .8rem; border-radius: var(--pill); border: 1px solid rgba(255,255,255,.25); font-size: .78rem; color: #fff; }
.help-popular a:hover { background: rgba(255,255,255,.12); }
.help-cat { background: #fff; border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 1.4rem; }
.help-cat h3 { font-size: 1rem; margin-bottom: .6rem; }
.help-cat a { display: block; padding: .38rem 0; color: var(--ink); font-size: .9rem; border-bottom: 1px dashed var(--border); }
.help-cat a:last-child { border-bottom: 0; }
.help-cat a:hover { color: var(--brand); }
.article { max-width: 780px; }
.article h2 { font-size: 1.35rem; margin-top: 2rem; }
.article p, .article li { color: #333; line-height: 1.8; }
.article ul { padding-left: 1.2rem; }

/* ---------- blog ---------- */
.post-card { display: flex; flex-direction: column; gap: .5rem; height: 100%; }
.post-card .cover { aspect-ratio: 16/9; border-radius: var(--radius); background: linear-gradient(135deg, var(--yellow), #fff 60%, var(--brand-soft)); display: grid; place-items: center; font-family: var(--font-head); font-weight: 700; color: var(--ink); overflow: hidden; }
.post-card .cover img { width: 100%; height: 100%; object-fit: cover; }
.post-card .meta { font-size: .74rem; color: var(--muted); letter-spacing: .06em; text-transform: uppercase; font-family: var(--font-head); font-weight: 600; }
.post-card h3 { font-size: 1.1rem; }
.post-body { max-width: 760px; }
.post-body h2 { font-size: 1.3rem; margin-top: 1.8rem; }
.post-body p { line-height: 1.85; }

/* ---------- social + cookie + newsletter ---------- */
.social-links { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: 1rem; }
.social-links a { padding: .3rem .75rem; border-radius: var(--pill); border: 1px solid var(--border-bright); font-size: .76rem; font-weight: 500; color: var(--ink); background: #fff; display: inline-block !important; }
.social-links a:hover { border-color: var(--brand); color: var(--brand); }
.review-badge { display: inline-block !important; margin-top: .8rem; padding: .35rem .8rem; border-radius: var(--pill); background: var(--yellow); color: var(--ink) !important; font-size: .76rem; font-weight: 600; }
.newsletter { display: flex; justify-content: space-between; align-items: center; gap: 1.5rem; flex-wrap: wrap; margin-top: 2.5rem; padding: 1.2rem 1.4rem; background: #fff; border: 1px solid var(--border); border-radius: var(--radius-lg); }
.newsletter .input { min-width: 260px; }
.cookie-banner { position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 90; background: #fff; border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); padding: 1rem 1.2rem; display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; font-size: .85rem; max-width: 900px; margin: 0 auto; }
.cookie-banner a { color: var(--brand); }

/* ---------- calendar ---------- */
.cal { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; }
.cal-head { font-family: var(--font-head); font-size: .66rem; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); text-align: center; padding-bottom: .3rem; }
.cal-day { min-height: 76px; border-radius: 12px; background: #fff; border: 1px solid var(--border); padding: .45rem .55rem; font-size: .78rem; display: flex; flex-direction: column; justify-content: space-between; color: inherit; }
.cal-day.out { opacity: .35; }
.cal-day.pos { background: var(--success-bg); border-color: transparent; }
.cal-day.neg { background: var(--danger-bg); border-color: transparent; }
.cal-day.sel { outline: 2px solid var(--ink); }
.cal-day .d { font-weight: 600; }
.cal-day .p { font-weight: 600; font-variant-numeric: tabular-nums; }
.cal-day.pos .p { color: var(--success); }
.cal-day.neg .p { color: var(--danger); }
.cal-day .t { color: var(--muted); font-size: .68rem; }
a.cal-day:hover { border-color: var(--ink); }

/* ---------- score ---------- */
.score-ring { --pct: 0; width: 148px; height: 148px; border-radius: 50%; background: conic-gradient(var(--brand) calc(var(--pct) * 1%), var(--surface-3) 0); display: grid; place-items: center; }
.score-ring > div { width: 118px; height: 118px; border-radius: 50%; background: #fff; display: grid; place-items: center; text-align: center; }
.score-ring .n { font-family: var(--font-head); font-size: 2.2rem; font-weight: 800; letter-spacing: -.03em; line-height: 1; }
.score-ring .b { font-size: .72rem; color: var(--muted); }
.score-comp { display: grid; grid-template-columns: 1fr 2fr auto; gap: 1rem; align-items: center; padding: .85rem 0; border-bottom: 1px solid var(--border); }
.score-comp:last-child { border-bottom: 0; }
.score-comp .lbl { font-weight: 600; font-size: .9rem; }
.score-comp .lbl small { display: block; color: var(--muted); font-weight: 400; font-size: .76rem; }
.score-comp .val { font-family: var(--font-head); font-weight: 700; font-variant-numeric: tabular-nums; }
.range-list { display: grid; gap: .4rem; }
.range-list div { display: flex; justify-content: space-between; padding: .5rem .8rem; border-radius: 10px; background: var(--surface-2); font-size: .85rem; }

/* ---------- countdown + misc ---------- */
.countdown { font-family: var(--font-head); font-variant-numeric: tabular-nums; font-weight: 700; }
.kv { display: grid; grid-template-columns: auto 1fr; gap: .3rem 1rem; font-size: .88rem; }
.kv dt { color: var(--muted); }
.kv dd { margin: 0; font-weight: 600; }
.notice { border-left: 4px solid var(--yellow); background: #fffef0; padding: .9rem 1.1rem; border-radius: 0 12px 12px 0; font-size: .88rem; }
.notice.red { border-left-color: var(--brand); background: var(--brand-soft); }
.notice.green { border-left-color: var(--teal-deep); background: var(--success-bg); }
.copy-field { display: flex; gap: .5rem; }
.copy-field .input { font-family: var(--mono); }
.level-table td:first-child { font-family: var(--font-head); font-weight: 700; color: var(--brand); }
.tier-card { border-top: 4px solid var(--border-bright); }
.tier-card.current { border-top-color: var(--brand); }
.tier-card .ico { font-family: var(--font-head); font-size: .66rem; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.big-num { font-family: var(--font-head); font-size: 2rem; font-weight: 800; letter-spacing: -.03em; line-height: 1; }
.lab-card { border: 2px dashed var(--border-bright); }
.lab-card.live { border: 2px solid var(--brand); }
.progress-thin { height: 5px; background: var(--surface-3); border-radius: 99px; overflow: hidden; margin-top: .4rem; }
.progress-thin > div { height: 100%; background: var(--brand); }
.qr { width: 200px; height: 200px; border: 1px solid var(--border); border-radius: 12px; padding: 6px; background: #fff; }
.table-wrap.tight table.data { min-width: 0; }
.feed-item { display: flex; justify-content: space-between; gap: 1rem; align-items: center; padding: .7rem 0; border-bottom: 1px solid var(--border); font-size: .88rem; }
.feed-item:last-child { border-bottom: 0; }
.flag { font-size: 1.1rem; }
.mini-board td { padding: .55rem .8rem; }

@media (max-width: 1080px) {
  .stats-strip { grid-template-columns: repeat(2, 1fr); }
  .cond-grid { grid-template-columns: 1fr 1fr; }
  .pricing { grid-template-columns: 1fr; }
}
@media (max-width: 780px) {
  .stats-strip, .cond-grid { grid-template-columns: 1fr; }
  .score-comp { grid-template-columns: 1fr; gap: .4rem; }
  .cal-day { min-height: 56px; font-size: .68rem; padding: .3rem; }
  .newsletter { flex-direction: column; align-items: stretch; }
  .newsletter .input { min-width: 0; }
}

.cookie-banner[hidden]{display:none !important}
