.a-hero { padding: clamp(80px, 16vh, 180px) 0 clamp(60px, 10vh, 120px); }
.a-hero h1 { font-size: clamp(44px, 7.6vw, 104px); margin-bottom: 32px; }
.a-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
.badge { font: 500 11px/1 var(--mono); letter-spacing: .06em; text-transform: uppercase; color: var(--muted); border: 1px dashed var(--line-strong); padding: 7px 10px; border-radius: 999px; white-space: nowrap; }
.badge.live { color: var(--ok); border-style: solid; border-color: currentColor; }
.badge.live::before { content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: currentColor; margin-right: 8px; vertical-align: 1px; animation: blink 1.6s steps(1) infinite; }
.a-h2 { margin-bottom: 56px; }

.kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--text); margin-bottom: 40px; }
.kpi { padding: 22px 20px 26px 0; display: flex; flex-direction: column; gap: 18px; }
.kpi + .kpi { padding-left: 20px; border-left: 1px solid var(--line); }
.k-label { color: var(--muted); font-size: 14px; }
.k-val { font: 400 clamp(36px, 5vw, 64px)/1 var(--sans); letter-spacing: -0.05em; font-variant-numeric: tabular-nums; }

.panels { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 16px; }
.panel { margin: 0; background: var(--surface); border: 1px solid var(--line); border-radius: 18px; padding: 20px; position: relative; }
.panel figcaption { display: flex; justify-content: space-between; gap: 12px; font-weight: 600; margin-bottom: 18px; flex-wrap: wrap; }
.panel figcaption .muted { font: 500 11px/1.8 var(--mono); letter-spacing: .05em; text-transform: uppercase; font-weight: 500; }

/* Daily bars: single series, accent hue, rounded data-ends, hover tooltip. */
.chart { height: 220px; position: relative; }
.chart svg { width: 100%; height: 100%; overflow: visible; }
.chart .grid line { stroke: var(--line); stroke-width: 1; }
.chart .grid text, .chart .axis text { font: 500 10.5px var(--mono); fill: var(--faint); }
.chart .bar { fill: var(--accent); transform-box: fill-box; transform-origin: bottom; transform: scaleY(0); transition: transform .9s var(--ease), opacity .2s; }
.chart.in .bar { transform: scaleY(1); }
.chart .hit { fill: transparent; cursor: crosshair; }
.chart.hovering .bar { opacity: .35; }
.chart.hovering .bar.on { opacity: 1; }
.tip { position: absolute; pointer-events: none; background: var(--text); color: var(--bg); font: 500 12px/1.4 var(--mono); padding: 7px 10px; border-radius: 8px; transform: translate(-50%, -100%); white-space: nowrap; z-index: 3; }

/* Assistant split: one stacked bar, direct-labelled. */
.split { display: flex; gap: 2px; height: 56px; margin: 6px 0 22px; }
.split i { display: block; height: 100%; border-radius: 4px; flex-basis: 0; transition: flex-grow 1.2s var(--ease); flex-grow: 0; min-width: 4px; }
.split-legend { list-style: none; padding: 0; margin: 0; }
.split-legend li { display: grid; grid-template-columns: 14px 1fr auto; gap: 10px; align-items: center; padding: 10px 0; border-top: 1px solid var(--line); }
.split-legend li i { width: 10px; height: 10px; border-radius: 3px; }
.split-legend b { font: 500 15px var(--mono); }

.dash { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.dash .funnel { padding-right: 12px; }
.terms { list-style: none; margin: 0; padding: 0; }
.terms li { position: relative; display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; font-size: 15px; border-top: 1px solid var(--line); }
.terms li::after { content: ""; position: absolute; left: 0; bottom: -1px; height: 2px; width: calc(var(--w) * 100%); background: var(--accent); border-radius: 0 4px 4px 0; transform: scaleX(0); transform-origin: left; transition: transform 1s var(--ease); transition-delay: var(--d, 0s); }
.panel.in .terms li::after { transform: scaleX(1); }
.terms b { font: 500 13px var(--mono); color: var(--muted); }
.lat { margin: 0 0 14px; }
.lat div { display: flex; justify-content: space-between; gap: 12px; padding: 11px 0; border-top: 1px solid var(--line); }
.lat dt { font: 500 13px var(--mono); color: var(--muted); }
.lat dd { margin: 0; font: 400 14px var(--mono); color: var(--muted); }
.lat dd b { color: var(--text); font-weight: 500; font-size: 16px; }

.cta-inner { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; flex-wrap: wrap; }
.cta h2 { font-size: clamp(48px, 9vw, 128px); }

@media (max-width: 900px) {
  .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kpi:nth-child(3) { padding-left: 0; border-left: 0; }
  .kpi:nth-child(n+3) { border-top: 1px solid var(--line); }
  .panels, .dash { grid-template-columns: 1fr; }
}
