/* carbium.sh landing (src/views/landing.js). */

.cw-land2 { display: grid; grid-template-rows: auto 1fr auto; height: 100dvh; overflow: hidden; background: var(--c-bg); scroll-behavior: smooth; }
.cw-land2-main { display: flex; flex-direction: column; min-width: 0; min-height: 0; overflow-y: auto; scroll-behavior: smooth; }

.cw-lnav { position: relative; z-index: 60; overflow: visible; justify-content: space-between; }
.cw-lnav-right { display: flex; align-items: center; gap: var(--c-s-9); flex-shrink: 0; }
.cw-lnav-links { display: flex; align-items: center; gap: var(--c-s-10); }
.cw-lnav-links a { padding-block: var(--c-s-6); font-family: var(--c-font-body); font-size: 13px; color: var(--c-muted); transition: color var(--c-dur-1) var(--c-ease); }
.cw-lnav-links a:hover { color: var(--c-text); }
.cw-lnav-links a:focus-visible { outline: none; box-shadow: var(--c-focus); }
.cw-lnav-theme, .cw-lnav-cta { flex-shrink: 0; }

.cw-land2 .is-dim { color: var(--c-faint); }

.cw-sec-inner { width: 100%; max-width: 1180px; margin: 0 auto; padding-inline: var(--c-s-10); box-sizing: border-box; min-width: 0; }
.cw-proto-sec2, .cw-rates-sec { padding-block: var(--c-s-12); }
.cw-rates-sec .cw-sec-inner, .cw-proto-sec2 .cw-sec-inner { display: flex; flex-direction: column; gap: var(--c-s-8); }
.cw-hero-sec2 { padding-block: var(--c-s-12) var(--c-s-8); }
.cw-hero { max-width: 760px; margin: 0 auto; padding-inline: var(--c-s-10); text-align: center; display: flex; flex-direction: column; align-items: center; gap: var(--c-s-6); }
.cw-hero-kicker { display: inline-flex; }
.cw-hero-h1 { margin: var(--c-s-3) 0; font-family: var(--c-font-display); font-weight: 700; font-size: clamp(34px, 4.6vw, 52px); line-height: 1.06; letter-spacing: -.03em; color: var(--c-text); }
.cw-hl-p { color: var(--c-brand); }
.cw-hl-w { color: var(--c-ws); }
.cw-hl-r { color: var(--c-stream); }
.cw-hero-sub { margin: 0; color: var(--c-muted); font-size: 15px; line-height: 1.6; max-width: 560px; }
.cw-hero-cta { display: flex; gap: var(--c-s-6); justify-content: center; margin-top: var(--c-s-2); flex-wrap: wrap; }

.cw-race { display: flex; flex-direction: column; gap: var(--c-s-4); width: 100%; max-width: 520px; margin: var(--c-s-2) auto 0; text-align: left; }
.cw-race-line { display: grid; grid-template-columns: 100px 1fr 92px; gap: var(--c-s-6); align-items: center; }
.cw-race-lab { font-family: var(--c-font-mono); font-weight: 500; font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--c-muted); }
.cw-race-lab.is-p { color: var(--c-brand); }
.cw-race-track { position: relative; height: 4px; background: var(--c-surface-2); border: 1px solid var(--c-line); border-radius: 0; overflow: hidden; }
.cw-race-dash { position: absolute; top: 0; bottom: 0; width: 46px; }
.cw-race-dash.is-p { background: linear-gradient(90deg, transparent, var(--c-brand)); animation: cw-racesweep 1.5s linear infinite; }
.cw-race-dash.is-g { background: linear-gradient(90deg, transparent, var(--c-line-2)); animation: cw-racesweep 4.6s linear infinite; }
.cw-race-v { font-family: var(--c-font-mono); font-weight: 500; font-variant-numeric: tabular-nums; font-size: 12.5px; text-align: right; white-space: nowrap; color: var(--c-text); }
.cw-race-v.is-dim { color: var(--c-faint); }
@keyframes cw-racesweep { from { left: -46px; } to { left: 100%; } }
@media (prefers-reduced-motion: reduce) { .cw-race-dash { animation: none; left: 40%; } }

.cw-statband-wrap { width: 100%; max-width: 1180px; margin: 0 auto; padding: var(--c-s-6) var(--c-s-10) 0; box-sizing: border-box; }
.cw-statband-card { padding: 0; }
.cw-statband { display: grid; grid-template-columns: repeat(4, 1fr); }
.cw-sb-cell { padding: var(--c-s-8) var(--c-s-9); border-right: 1px solid var(--c-line); }
.cw-sb-cell:last-child { border-right: none; }
.cw-sb-lab { font-family: var(--c-font-mono); font-weight: 500; font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--c-muted); }
.cw-sb-val { margin-top: var(--c-s-5); display: flex; align-items: center; gap: var(--c-s-3); font-family: var(--c-font-mono); font-weight: 500; font-size: 20px; line-height: 1; font-variant-numeric: tabular-nums; color: var(--c-text); }
.cw-sb-val small { font-family: var(--c-font-mono); font-weight: 400; font-size: 11px; color: var(--c-faint); letter-spacing: 0; }
.cw-sb-num { font-variant-numeric: tabular-nums; }
.cw-sb-psq { width: 8px; height: 8px; background: var(--c-brand); flex: none; }
.cw-sol-under { display: flex; justify-content: flex-end; margin-top: var(--c-s-6); }

.cw-proto-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--c-s-8); margin-top: var(--c-s-2); align-items: stretch; }
.cw-proto-card { display: flex; flex-direction: column; gap: var(--c-s-5); padding: var(--c-s-8); min-width: 0; }
.cw-proto-head { display: flex; align-items: center; justify-content: space-between; gap: var(--c-s-4); flex-wrap: wrap; }
.cw-proto-name { flex: 0 1 auto; font-family: var(--c-font-display); font-weight: 600; font-size: 16px; letter-spacing: -.01em; color: var(--c-text); white-space: nowrap; }
/* raw --c-brand misses 4.5 on the card; the endpoint below already paints --c-brand-tint */
.cw-proto-card[data-proto="rpc"] .cw-proto-name { color: var(--c-brand-tint); }
.cw-proto-card[data-proto="ws"] .cw-proto-name { color: var(--c-ws); }
.cw-proto-card[data-proto="stream"] .cw-proto-name { color: var(--c-stream); }
.cw-proto-tagb { flex: none; color: var(--c-faint); background: var(--c-surface-2); border-color: var(--c-line); }
.cw-proto-ep { display: flex; align-items: center; justify-content: space-between; gap: var(--c-s-4); max-width: 100%; padding: var(--c-s-3) var(--c-s-5); border: 1px solid var(--c-line); border-radius: var(--c-r-ctl); background: var(--c-surface-2); }
.cw-proto-ep .cw-mono { font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--c-brand-tint); }
.cw-proto-card[data-proto="ws"] .cw-proto-ep .cw-mono { color: var(--c-ws); }
.cw-proto-card[data-proto="stream"] .cw-proto-ep .cw-mono { color: var(--c-stream); }
.cw-proto-term { overflow: hidden; border-radius: var(--c-r-ctl); }
.cw-proto-term .cw-term { box-shadow: none; max-width: 100%; }
.cw-proto-term .cw-term-body {
  height: calc(8lh + 2 * var(--c-s-6));
  /* overflow:hidden clips at the PADDING box, so a 9th line's descenders paint inside the top inset */
  clip-path: inset(var(--c-s-6) 0 0 0);
}
.cw-proto-ro { width: 100%; padding-top: 0; margin-top: auto; }
.cw-proto-card .cw-spark-line { width: 100%; height: 38px; display: block; margin-top: var(--c-s-3); opacity: 0; transition: opacity var(--c-dur-3) var(--c-ease); }
.cw-proto-card .cw-spark-line.is-live { opacity: .9; }
@media (prefers-reduced-motion: reduce) { .cw-proto-card .cw-spark-line { transition: none; } }

.cw-origin { display: flex; flex-direction: column; align-items: center; width: 100%; margin-top: var(--c-s-6); }
.cw-origin-sq { width: 12px; height: 12px; background: var(--c-brand); box-shadow: 0 0 16px var(--c-brand-glow); }
.cw-origin-lab { margin-top: var(--c-s-4); font-family: var(--c-font-mono); font-weight: 500; font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--c-muted); }
.cw-origin-fan { width: 100%; max-width: none; margin-top: var(--c-s-2); }
.cw-fan { width: 100%; height: 34px; display: block; }
/* ONE neutral hairline, never a plane colour: the connector is structure, colour is identity */
.cw-fan path { fill: none; stroke: var(--c-line-2); stroke-width: 1; vector-effect: non-scaling-stroke; }
.c-reg--w::before, .c-reg--w::after { border-color: var(--c-ws); }
.c-reg--q::before, .c-reg--q::after { border-color: rgb(from var(--c-quote) r g b / .5); }

.cw-rates-sec .cw-rl-head { display: none; }
.cw-tier-seg { align-self: flex-start; }
.cw-rl-card { background: var(--c-surface); }
.cw-rl-head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--c-s-6); margin-bottom: var(--c-s-6); flex-wrap: wrap; }
.cw-rl-head h2 { margin: 0; font-family: var(--c-font-display); font-weight: 600; font-size: 17px; letter-spacing: -.01em; color: var(--c-text); }
.cw-rl-unit { color: var(--c-faint); }
.cw-rl-foot { margin-top: var(--c-s-4); color: var(--c-faint); }
.cw-rl-scroll + .cw-rl-foot { margin-top: var(--c-s-5); }

.cw-rl-scroll > .c-table { min-width: 0; }
.cw-rl-table { font-size: 12.5px; line-height: 1.5; }
.cw-rl-table th, .cw-rl-table td { padding: var(--c-s-4) var(--c-s-6); border-bottom: 1px solid var(--c-line-soft); }
.cw-rl-table thead th { background: transparent; border-bottom: 1px solid var(--c-line-2); vertical-align: middle; }
.cw-rl-table .cw-rl-th { text-align: right; }
.cw-rl-class { display: flex; align-items: center; gap: var(--c-s-3); }
.cw-rl-table .cw-rl-name { font-family: var(--c-font-mono); font-weight: 500; font-size: 12px; letter-spacing: .04em; text-transform: uppercase; color: var(--c-text); }
.cw-rl-table .cw-rl-ex { margin-top: var(--c-s-1); font-size: 11px; color: var(--c-faint); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cw-rl-table td.cw-rl-n { font-size: 12.5px; color: var(--c-text); }
.cw-rl-table tbody tr:hover td { background: var(--c-row-hover); }
.cw-rl-card[data-cur-tier="free"] .c-table th:nth-child(2), .cw-rl-card[data-cur-tier="free"] .c-table td:nth-child(2),
.cw-rl-card[data-cur-tier="dev"] .c-table th:nth-child(3),  .cw-rl-card[data-cur-tier="dev"] .c-table td:nth-child(3),
.cw-rl-card[data-cur-tier="buss"] .c-table th:nth-child(4), .cw-rl-card[data-cur-tier="buss"] .c-table td:nth-child(4),
.cw-rl-card[data-cur-tier="pro"] .c-table th:nth-child(5),  .cw-rl-card[data-cur-tier="pro"] .c-table td:nth-child(5) {
  color: var(--c-brand-tint); background: var(--c-brand-wash);
}

.cw-mkt-grid { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); gap: var(--c-s-8); align-items: start; }
.cw-mkt-head { display: flex; align-items: baseline; gap: var(--c-s-5); flex-wrap: wrap; }
.cw-mkt-h { margin: 0; font-family: var(--c-font-display); font-weight: 600; font-size: 17px; letter-spacing: -.01em; color: var(--c-text); }
.cw-mkt-unit { margin-left: auto; }
.cw-mkt-cta { display: flex; justify-content: flex-end; }

.cw-tier-card { display: flex; flex-direction: column; gap: var(--c-s-8); }
/* ONE LINE, ALWAYS: Free carries no /v1/plans record, and a wrapping controls row jumps the panel */
.cw-tier-controls { display: flex; align-items: center; justify-content: space-between; gap: var(--c-s-6); flex-wrap: nowrap; }
.cw-tier-price { display: flex; align-items: baseline; gap: var(--c-s-4); min-width: 0; }
.cw-tier-price-sub { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cw-tier-live { display: grid; grid-template-columns: 1.3fr 1fr; gap: var(--c-s-8); align-items: start; }
.cw-tier-readouts { display: flex; flex-direction: column; }
.cw-tier-ro { padding: var(--c-s-3) 0; }
.cw-tier-ro .c-k { white-space: normal; }
/* One line per row whatever the tier: not served is two words and would wrap where 500 req/s does not */
.cw-tier-ro .c-v { white-space: nowrap; }
.cw-tier-ro.is-walk .c-v { color: var(--c-muted); }
.cw-tier-bignums { display: grid; grid-template-columns: 1fr; gap: var(--c-s-6); align-content: start; }
.cw-bignum { border: 1px solid var(--c-line); border-radius: var(--c-r-card); padding: var(--c-s-8) var(--c-s-9); background: var(--c-surface-2); }
.cw-bignum-l { font-family: var(--c-font-mono); font-weight: 500; font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--c-muted); }
.cw-bignum-v { margin-top: var(--c-s-6); font-family: var(--c-font-mono); font-weight: 500; font-size: 32px; line-height: 1; letter-spacing: -.01em; font-variant-numeric: tabular-nums; color: var(--c-text); }
.cw-bignum-v small { display: block; margin-top: var(--c-s-4); font-size: 11px; font-weight: 400; letter-spacing: 0; color: var(--c-faint); }
.cw-bignum--stream { border-color: var(--c-stream-line); background: var(--c-stream-wash); }
.cw-bignum--stream .cw-bignum-l, .cw-bignum--stream .cw-bignum-v { color: var(--c-stream-tint); }
/* SCOPED: dashboard.css declares a bare .cw-expander too and loads after this sheet */
.cw-rates-sec .cw-expander { display: inline-flex; align-self: flex-start; align-items: center; gap: var(--c-s-3); min-height: 44px; padding: 0; background: none; border: none; cursor: pointer; font-family: var(--c-font-mono); font-size: 11px; letter-spacing: .04em; color: var(--c-faint); transition: color var(--c-dur-1) var(--c-ease); }
.cw-expander:hover { color: var(--c-muted); }
.cw-expander:focus-visible { outline: none; box-shadow: var(--c-focus); }
.cw-tier-chev { display: inline-flex; color: currentColor; transition: transform var(--c-dur-2) var(--c-ease); }
.cw-tier-chev svg path { stroke: currentColor; }
.cw-expander.is-open .cw-tier-chev { transform: rotate(180deg); }
.cw-tier-full[hidden] { display: none; }
.cw-tier-full .cw-rl-card { border: none; box-shadow: none; padding: 0; background: transparent; }
.cw-tier-full .cw-rl-card.c-reg::before, .cw-tier-full .cw-rl-card.c-reg::after { display: none; }
.cw-caps-line { margin: 0; display: flex; align-items: center; gap: var(--c-s-4); font-family: var(--c-font-mono); font-size: 11px; line-height: 1.5; letter-spacing: .02em; color: var(--c-muted); }
.cw-caps-sq { width: 6px; height: 6px; background: var(--c-line-2); flex: none; }

.cw-mod-card { display: flex; flex-direction: column; gap: var(--c-s-6); border-color: rgb(from var(--c-quote) r g b / .35); }
.cw-mod-h { color: var(--c-quote-tint); }
.cw-mod-card .cw-caps-sq { background: var(--c-quote); }
/* A rung is a RULED row, never a dotted leader: the ladder must not read as a readout list */
.cw-mod-ro { justify-content: space-between; padding: var(--c-s-6) 0; border-bottom: 1px solid var(--c-line-soft); }
.cw-mod-ro::after { display: none; }
.cw-mod-ro:last-child { border-bottom: none; padding-bottom: 0; }
.cw-mod-ro .c-v { color: var(--c-quote-tint); white-space: nowrap; }
.cw-mod-ro .c-v small { margin-left: var(--c-s-6); font-size: 11px; color: var(--c-faint); }
.cw-mod-btn { border-color: rgb(from var(--c-quote) r g b / .5); }
.cw-mod-btn::after { border-top-color: var(--c-quote); border-right-color: var(--c-quote); }
.cw-mod-btn:hover:not(:disabled) { border-color: var(--c-quote); background: rgb(from var(--c-quote) r g b / .1); box-shadow: 0 0 14px rgb(from var(--c-quote) r g b / .28); }

.cw-authmodal, .cw-keyreveal-modal { display: flex; overflow-y: auto; }
.cw-authmodal-card, .cw-keyreveal { margin: auto; max-height: none; overflow: visible; }
.cw-authmodal-card { position: relative; }
.cw-auth-x {
  position: absolute; top: var(--c-s-6); right: var(--c-s-6);
  width: 26px; height: 26px; padding: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 18px; line-height: 1; color: var(--c-faint);
  border: 1px solid var(--c-line); background: var(--c-surface-2); border-radius: var(--c-r-ctl);
  transition: color var(--c-dur-1) var(--c-ease), border-color var(--c-dur-1) var(--c-ease);
}
.cw-auth-x:hover { color: var(--c-text); border-color: var(--c-line-2); }
.cw-admit { display: flex; align-items: center; gap: var(--c-s-4); margin: var(--c-s-5) 0 var(--c-s-6); font-family: var(--c-font-mono); font-size: 11px; }
.cw-admit-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--c-faint); flex: none; transition: background var(--c-dur-3) var(--c-ease); }
.cw-admit-txt { color: var(--c-faint); transition: color var(--c-dur-3) var(--c-ease); }
.cw-admit.done .cw-admit-dot { background: var(--c-ok); box-shadow: 0 0 8px var(--c-ok); }
.cw-admit.done .cw-admit-txt { color: var(--c-ok); }

.cw-keyreveal { max-width: 420px; }
.cw-keyreveal-warn { color: var(--c-danger) !important; }
.cw-keyreveal .c-field label { color: var(--c-danger-tint); }
.cw-keyreveal .cw-idcell { width: 100%; justify-content: space-between; padding: var(--c-s-4) var(--c-s-5); border: 1px solid var(--c-line); border-radius: var(--c-r-ctl); background: var(--c-surface-2); }

@media (max-width: 820px) {
  .cw-lnav-links { display: none; }
  /* The four bar controls measure 386px inside a 390px bar, so the floor is 391.98px */
  .cw-lnav .cw-sig { display: none; }
  .cw-lnav .cw-brand-link { flex-shrink: 1; min-width: 0; }
  .cw-lnav .cw-brand { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}
@media (max-width: 760px) {
  .cw-sec-inner { padding-inline: var(--c-s-8); }
  .cw-proto-sec2, .cw-rates-sec { padding-block: var(--c-s-10); }
  .cw-statband-wrap { padding-inline: var(--c-s-8); }
  .cw-hero { padding-inline: var(--c-s-8); }
  .cw-statband { grid-template-columns: repeat(2, 1fr); }
  .cw-sb-cell:nth-child(2) { border-right: none; }
  .cw-sb-cell:nth-child(1), .cw-sb-cell:nth-child(2) { border-bottom: 1px solid var(--c-line); }
  .cw-proto-grid { grid-template-columns: 1fr; gap: var(--c-s-6); }
  .cw-fan path.br { display: none; }   /* one column: the rail and its two drops have nothing to land on */
  .cw-tier-controls { flex-wrap: wrap; }
  .cw-tier-seg { flex: 1 0 100%; flex-wrap: nowrap; }
  .cw-tier-price { flex: 1 0 100%; }
  .cw-tier-live { grid-template-columns: 1fr; gap: var(--c-s-8); }
  .cw-race { max-width: none; }
  .cw-rl-table .cw-rl-ex { white-space: normal; }
}

@media (max-width: 900px) {
  .cw-land2 { height: auto; min-height: 100dvh; overflow: visible; display: flex; flex-direction: column; }
  .cw-land2-main { overflow-y: visible; min-height: 0; }
  .cw-mkt-grid { grid-template-columns: 1fr; }
  .cw-tier-bignums { grid-template-columns: 1fr 1fr; }
}

.cw-sys-main { padding: var(--c-s-10) var(--c-s-10) var(--c-s-12); max-width: 1180px; margin: 0 auto; width: 100%; }
.cw-sys-h1 { font-family: var(--c-font-display); font-weight: 600; font-size: clamp(28px, 4vw, 44px); letter-spacing: -.02em; margin: var(--c-s-4) 0 var(--c-s-4); }
.cw-sys-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--c-s-6); margin: var(--c-s-8) 0; }
.cw-sys-card { display: flex; flex-direction: column; gap: var(--c-s-3); padding: var(--c-s-7); }
/* Both nowrap: below ~360px their sum is the card's min-content */
.cw-sys-top { display: flex; align-items: center; justify-content: space-between; gap: var(--c-s-4); flex-wrap: wrap; }
.cw-sys-nm { font-family: var(--c-font-display); font-weight: 600; font-size: 17px; white-space: nowrap; }
.cw-proto-p { color: var(--c-brand-tint); }
.cw-proto-w { color: var(--c-ws); }
.cw-proto-r { color: var(--c-stream); }
.cw-sys-foot { display: flex; align-items: center; justify-content: space-between; gap: var(--c-s-4); margin-top: var(--c-s-4); padding-top: var(--c-s-4); border-top: 1px solid var(--c-line); }
.cw-sys-status { display: inline-flex; align-items: center; gap: var(--c-s-3); }
.cw-sys-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--c-faint); flex-shrink: 0; }
.cw-sys-dot.is-up { background: var(--c-ok); box-shadow: 0 0 7px var(--c-ok); }
.cw-sys-dot.is-down { background: var(--c-danger); box-shadow: 0 0 7px var(--c-danger); }
.cw-sys-rttrow { display: inline-flex; align-items: center; gap: var(--c-s-3); }
.cw-sys-rtt { font-family: var(--c-font-mono); font-variant-numeric: tabular-nums; font-size: 13px; color: var(--c-text); }
.cw-sys-band { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--c-line); border: 1px solid var(--c-line); margin: var(--c-s-8) 0; }
.cw-sys-stat { background: var(--c-surface); padding: var(--c-s-6) var(--c-s-7); }
.cw-sys-sol { display: inline-flex; align-items: center; gap: var(--c-s-4); color: var(--c-faint); margin-top: var(--c-s-6); }
.cw-sys-sol .cw-sol-mark { opacity: .7; }
@media (max-width: 900px) {
  .cw-sys-grid { grid-template-columns: 1fr; }
  .cw-sys-band { grid-template-columns: 1fr 1fr; }
}