/* Clopos · 1240×160 shared shell (banner-host scale + brand tokens). */
:root { --cl-bg:#0E1729; --cl-bg-alt:#1B2940; --cl-surface:#162238; --cl-surface-l:#1E2A44;
        --cl-accent:#1C6EEB; --cl-accent-soft:#4C8DFB; --cl-accent-deep:#1454C7; --cl-accent-bright:#2B7BF5;
        --cl-white:#FFFFFF; --cl-muted:rgba(255,255,255,0.55); --cl-dim:rgba(255,255,255,0.35);
        --cl-border:rgba(255,255,255,0.08); }
* { box-sizing:border-box; margin:0; padding:0; }
html,body { width:100%; height:100%; overflow:hidden; background:transparent; }
body { font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
       -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; letter-spacing:-0.01em; }
.banner-host { width:1240px; height:160px; flex-shrink:0; transform-origin:top left;
               transform: scale(calc(100vw / 1240)); }
.cb { width:1240px; height:160px; position:relative; overflow:hidden; padding:0 36px;
      display:flex; align-items:center; gap:28px; isolation:isolate; color:#fff; }
.cb-shimmer { position:absolute; top:0; left:0; width:30%; height:100%;
              background:linear-gradient(110deg, transparent 30%, rgba(255,255,255,0.15) 50%, transparent 70%);
              animation: cb-scanline 4s ease-in-out infinite; animation-delay:1.2s;
              pointer-events:none; z-index:5; }
.cb-grid { position:absolute; inset:0; opacity:0.6;
           background-image: linear-gradient(rgba(28,110,235,0.063) 1px, transparent 1px),
                             linear-gradient(90deg, rgba(28,110,235,0.063) 1px, transparent 1px);
           background-size: 36px 36px; }
.cb-pill { display:inline-flex; align-items:center; gap:6px; padding:4px 10px; border-radius:999px;
           font-size:10px; font-weight:800; letter-spacing:.12em; }
.cb-pill.blue { background:rgba(28,110,235,0.15); border:1px solid rgba(28,110,235,0.33); color:var(--cl-accent-soft); }
.cb-pill.white { background:rgba(255,255,255,0.18); border:1px solid rgba(255,255,255,0.3); color:#fff; }
.cb-dot { position:relative; width:6px; height:6px; display:inline-block; }
.cb-dot::before,.cb-dot::after { content:''; position:absolute; inset:0; background:var(--cl-accent); border-radius:50%; }
.cb-dot::before { animation: cb-pulseDot 1.6s ease-out infinite; }
.cb-dot.white::before,.cb-dot.white::after { background:#fff; }
.cb-h2 { font-size:26px; font-weight:800; line-height:1.05; letter-spacing:-0.025em; color:#fff; }
.cb-sub { font-size:11px; color:var(--cl-muted); }
.cb-sub.bright { color:rgba(255,255,255,0.75); }
.cb-cta { display:inline-flex; align-items:center; gap:8px; background:#fff; color:var(--cl-bg);
          font-weight:800; border-radius:14px; padding:14px 22px; font-size:15px; white-space:nowrap;
          text-decoration:none;
          box-shadow:0 12px 28px -8px rgba(0,0,0,0.4), inset 0 1px 0 rgba(255,255,255,0.6);
          animation: cb-glowpulse 2s infinite; }
@keyframes cb-scanline { 0% { transform:translateX(-100%) skewX(-20deg); } 100% { transform:translateX(400%) skewX(-20deg); } }
@keyframes cb-pulseDot { 0%,100% { transform:scale(1); opacity:1; } 50% { transform:scale(2.4); opacity:0; } }
@keyframes cb-glowpulse { 0%,100% { box-shadow:0 12px 28px -8px rgba(0,0,0,0.4), 0 0 0 0 rgba(28,110,235,0.45); }
                         50% { box-shadow:0 12px 28px -8px rgba(0,0,0,0.4), 0 0 0 14px rgba(28,110,235,0); } }
@keyframes cb-gradientShift { 0%,100% { background-position:0% 50%; } 50% { background-position:100% 50%; } }
@keyframes cb-statusFlash { 0% { transform:scale(0.9); opacity:0; } 60% { transform:scale(1.08); opacity:1; } 100% { transform:scale(1); opacity:1; } }
@keyframes cb-floatCard { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-5px); } }
@keyframes cb-dataFlow { 0% { transform:translateX(-100%); } 100% { transform:translateX(100%); } }
@keyframes cb-floatY { 0%,100% { transform:translateY(0) rotate(-2deg); } 50% { transform:translateY(-6px) rotate(2deg); } }
@keyframes cb-notif { 0% { transform:translateX(20px); opacity:0; } 10%,30% { transform:translateX(0); opacity:1; } 40%,100% { transform:translateX(-20px); opacity:0; } }
@keyframes cb-pinDrop { 0% { transform:translateY(-12px) scale(0.8); opacity:0; } 60% { transform:translateY(2px) scale(1.1); opacity:1; } 100% { transform:translateY(0) scale(1); opacity:1; } }
@keyframes cb-marqueeSlow { 0% { transform:translateX(0); } 100% { transform:translateX(-50%); } }
@keyframes cb-countUp { 0% { transform:translateY(10px); opacity:0; } 100% { transform:translateY(0); opacity:1; } }
@keyframes cb-starDraw { 0% { transform:scale(0); opacity:0; } 60% { transform:scale(1.3); opacity:1; } 100% { transform:scale(1); opacity:1; } }
@keyframes cb-logoFade { 0%,30% { opacity:0; transform:translateY(6px); } 40%,100% { opacity:0.85; transform:translateY(0); } }
@media (prefers-reduced-motion: reduce) {
  .cb-shimmer { animation:none; }
  .cb *, .cb *::before, .cb *::after { animation-duration:.001ms !important; animation-iteration-count:1 !important; }
}