:root {
  --ink: #0a2136;
  --paper: #ecf0f1;
  --gold: #e67e22;
  --gold2: #ffad55;
  --brand-navy: #0a2136;
  --brand-blue: #3498db;
  --brand-orange: #e67e22;
  --brand-coral: #ff5045;
  --brand-green: #2ecc71;
}
body { background: #edf1f2; color: var(--brand-navy); }
.nav { border-bottom-color: rgba(255, 255, 255, .16); }
.brand {
  display: inline-flex;
  align-items: center;
  font-size: 1.42rem;
  letter-spacing: -.045em;
}
.brand-symbol {
  width: 38px;
  height: 38px;
  object-fit: cover;
  border-radius: 9px;
  margin-right: 11px;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .14);
}
.brand span:last-child { color: var(--brand-orange); }
.nav-cta {
  color: #ffb367;
  border-color: rgba(230, 126, 34, .65);
  background: rgba(230, 126, 34, .07);
}
.hero { background: #071b2c; }
.hero::after {
  content: '';
  position: absolute;
  inset: auto 0 0;
  height: 5px;
  background: linear-gradient(90deg, var(--brand-coral) 0 27%, var(--brand-green) 27% 49%, var(--brand-orange) 49% 76%, var(--brand-blue) 76%);
  z-index: 3;
}
.hero-art {
  background:
    linear-gradient(90deg, #071b2c 0%, rgba(7, 27, 44, .95) 28%, rgba(7, 27, 44, .25) 69%),
    linear-gradient(180deg, rgba(52, 152, 219, .08), rgba(230, 126, 34, .14)),
    url('caissa-hero.png') center/cover no-repeat;
  background-blend-mode: normal, color, normal;
}
.eyebrow, .nav-cta, .tag { color: #ffad55; }
.eyebrow span, .scroll-note span { background: var(--brand-orange); }
h1 em, h2 em { color: #ffad55; }
.primary {
  position: relative;
  overflow: hidden;
  background: var(--brand-orange);
  color: #0a2136;
}
.primary::after {
  content: '';
  position: absolute;
  inset: auto 0 0;
  height: 3px;
  background: linear-gradient(90deg, var(--brand-coral), var(--brand-green), var(--brand-blue));
}
.primary:hover { background: #f4943e; }
.avatars span:nth-child(1) { color: var(--brand-coral); }
.avatars span:nth-child(2) { color: var(--brand-green); }
.avatars span:nth-child(3) { color: var(--brand-blue); }
.section-index { color: #ba6016; }
.manifesto h2 em, .features h2 em, .final-cta h2 em { color: #cf6818; }
.flow-section, .pricing { background: #092238; }
.flow-section {
  position: relative;
  overflow: hidden;
}
.flow-section::before {
  content: '';
  position: absolute;
  width: 460px;
  height: 460px;
  right: -230px;
  top: -230px;
  border-radius: 50%;
  border: 70px solid rgba(52, 152, 219, .05);
  box-shadow: 0 0 0 70px rgba(46, 204, 113, .025), 0 0 0 140px rgba(230, 126, 34, .02);
}
.flow-grid article:nth-child(1) .icon { color: var(--brand-coral); }
.flow-grid article:nth-child(2) .icon { color: var(--brand-blue); }
.flow-grid article:nth-child(3) .icon { color: var(--brand-orange); }
.flow-grid article:nth-child(4) .icon { color: var(--brand-green); }
.analysis-demo {
  border-color: rgba(52, 152, 219, .18);
  box-shadow: 0 30px 80px rgba(10, 33, 54, .2);
}
.position-panel { background: #0d2a42; }
.caissa-note {
  background:
    radial-gradient(circle at 90% 10%, rgba(52, 152, 219, .09), transparent 34%),
    #091f32;
}
.live-dot { background: var(--brand-green); box-shadow: 0 0 0 4px rgba(46, 204, 113, .13); }
.mistake-label {
  color: #ff8a82;
  background: rgba(255, 80, 69, .1);
  border-color: rgba(255, 80, 69, .3);
}
.square.target { box-shadow: inset 0 0 0 4px var(--brand-coral); }
.square.origin::after { background: rgba(52, 152, 219, .72); }
.eval-track span { background: #e25a4f; }
.position-foot strong, .pattern-row > b, .train-link { color: #ffad55; }
.caissa-note blockquote { border-left-color: var(--brand-blue); }
.pattern-row { border-bottom-color: rgba(46, 204, 113, .2); }
.feature-list article:nth-child(1) > span { color: var(--brand-blue); }
.feature-list article:nth-child(2) > span { color: var(--brand-orange); }
.feature-list article:nth-child(3) > span { color: var(--brand-green); }
.plans .featured {
  border-top: 5px solid transparent;
  border-image: linear-gradient(90deg, var(--brand-coral), var(--brand-orange), var(--brand-green), var(--brand-blue)) 1;
}
.recommended { background: var(--brand-orange); color: var(--brand-navy); }
.plans li::before { color: var(--brand-green); }
.featured a { background: var(--brand-orange); color: var(--brand-navy); }
.final-cta { position: relative; }
.final-cta::before {
  content: '';
  position: absolute;
  width: 120px;
  height: 4px;
  left: 50%;
  top: 85px;
  transform: translateX(-50%);
  background: linear-gradient(90deg, var(--brand-coral) 25%, var(--brand-green) 25% 50%, var(--brand-orange) 50% 75%, var(--brand-blue) 75%);
}
footer .brand-symbol { box-shadow: 0 0 0 1px rgba(10, 33, 54, .12); }
@media (max-width: 800px) {
  .hero-art {
    background:
      linear-gradient(180deg, rgba(7, 27, 44, .18), #071b2c 72%),
      linear-gradient(180deg, rgba(52, 152, 219, .05), rgba(230, 126, 34, .1)),
      url('caissa-hero.png') 65% center/cover no-repeat;
  }
}