/* primara.ai design system v2 (design_handoff_primara_ai, Jul 2026).
   Mint (#08F4BF) is reserved for validated states + the logo accent - never
   on unvalidated statistics. Urbane (licensed, self-hosted) for display;
   Geist for UI/body. NO monospace anywhere; sentence case everywhere. */

@font-face { font-family:'Urbane'; src:url('/fonts/Urbane-Medium.woff2') format('woff2'); font-weight:500; font-display:swap; }
@font-face { font-family:'Urbane'; src:url('/fonts/Urbane-Demi-Bold.woff2') format('woff2'); font-weight:600; font-display:swap; }
@font-face { font-family:'Urbane'; src:url('/fonts/Urbane-Bold.woff2') format('woff2'); font-weight:700; font-display:swap; }

:root {
  --blue: #002FF8;
  --navy: #00044C;
  --mint: #08F4BF;
  --green: #06C298;
  --blue2: #4059FF;
  --tx2: #6A7196;
  --tx3: #8A90AD;
  --dis: #B9C0D6;
  --bd: #DFE3EC;
  --bd2: #E5E8F0;
  --div: #EDEFF7;
  --surf: #F1F3F8;
  --chart: #F7F8FC;
  --acc-housing: #7A5CFF;
  --acc-trade: #E4572E;
  --deep: #000330;
  --oncap: #C9D5FF;
  --onsec: #A9AFC9;
}
* { box-sizing: border-box; margin: 0; }
html, body { height: 100%; }
body { background: var(--surf); color: var(--navy);
       font: 14px/1.5 'Geist', -apple-system, sans-serif; }
::selection { background: var(--mint); color: var(--navy); }
.mono { font-family: 'Geist', sans-serif; font-weight: 600; }

/* ---- keyframes (mark 3b "Signal" + gradient border) ---- */
@keyframes seg-pulse { 0%,100% { opacity:1; } 50% { opacity:0.35; } }
@keyframes ping { 0% { transform:scale(1); opacity:0.6; } 100% { transform:scale(2.1); opacity:0; } }
@keyframes borderflow { 0% { background-position:0% 50%; } 100% { background-position:300% 50%; } }
.pai-mark .seg-a, .pai-mark .seg-b { opacity: 1; }
.pai-scanning .pai-mark .seg-a { animation: seg-pulse 1.8s ease-in-out infinite; }
.pai-scanning .pai-mark .seg-b { animation: seg-pulse 1.8s ease-in-out infinite 0.4s; }
.pai-mark .ping-c { transform-box: fill-box; transform-origin: center;
                    animation: ping 1.8s ease-out infinite; }
@media (prefers-reduced-motion: reduce) {
  .pai-mark .seg-a, .pai-mark .seg-b, .pai-mark .ping-c, .gradwrap { animation: none !important; }
}

/* ---- lockup ---- */
.lockup { display: flex; align-items: baseline; text-decoration: none; }
.lockup .word { font: 500 19px 'Urbane', 'Geist', sans-serif; color: var(--navy); letter-spacing: -0.035em; }
.lockup .word .ai { color: var(--blue); }
.lockup.on-dark .word { color: #fff; }
.lockup.on-dark .word .ai { color: var(--mint); }

/* ---- topbar ---- */
.pai-top { display: flex; align-items: center; gap: 22px; padding: 18px 28px;
           background: #fff; border-bottom: 1px solid var(--bd2);
           position: sticky; top: 0; z-index: 90; }
.pai-top nav { display: flex; gap: 4px; }
.pai-top nav a { font: 500 14px 'Geist', sans-serif; color: var(--tx2); text-decoration: none;
                 padding: 8px 16px; border-radius: 999px; }
.pai-top nav a:hover { background: #F4F6FB; color: var(--navy); }
.pai-top nav a.on { background: var(--div); color: var(--navy); font-weight: 600; }
.pai-status { margin-left: auto; display: flex; align-items: center; gap: 8px;
              font: 500 12px 'Geist', sans-serif;
              color: var(--tx2); background: var(--surf); border: 1px solid var(--bd);
              border-radius: 999px; padding: 7px 14px; white-space: nowrap; }
.pai-status .dot { width: 7px; height: 7px; border-radius: 50%; background: var(--green); flex-shrink: 0; }
.pai-user { display: flex; align-items: center; gap: 10px; }
.pai-user .av { width: 34px; height: 34px; border-radius: 50%; background: var(--navy);
                color: var(--mint); font: 600 12px 'Geist', sans-serif;
                display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.pai-user .nm { font: 600 13px 'Geist', sans-serif; color: var(--navy); line-height: 1.25; }
.pai-user .rl { font: 400 11.5px 'Geist', sans-serif; color: var(--tx3); }
.pai-user .rl a { color: var(--tx3); text-decoration: none; }
.pai-user .rl a:hover { color: var(--blue); }

/* ---- shared atoms ---- */
.btn { border: none; border-radius: 10px; padding: 10px 18px;
       font: 600 14px 'Geist', sans-serif; cursor: pointer;
       background: var(--blue); color: #fff; }
.btn:hover { background: var(--navy); }
.btn.secondary { background: #fff; border: 1px solid var(--bd); color: var(--navy); font-weight: 500; }
.btn.secondary:hover { border-color: var(--blue); color: var(--blue); background: #fff; }
.srcchip { display: inline-block; font: 600 10.5px 'Geist', sans-serif;
           color: #fff; border-radius: 5px; padding: 2px 7px; line-height: 1.5; }
.srcchip.ABS { background: var(--navy); } .srcchip.RBA { background: var(--blue); }
.srcchip.PBS { background: #C2408A; }   .srcchip.DGA { background: var(--green); }
.srcchip.APRA { background: #6B4FA0; }  .srcchip.ASIC { background: var(--acc-trade); }
.srcchip.EXT { background: var(--tx2); }
.chip-validated { display: inline-block; font: 600 11px 'Geist', sans-serif;
                  background: var(--mint); color: var(--navy);
                  border-radius: 5px; padding: 3px 9px; }
.chip-exploratory { display: inline-block; font: 600 11px 'Geist', sans-serif;
                    background: var(--div); color: var(--tx2);
                    border-radius: 5px; padding: 3px 9px; }
.chip-new { display: inline-block; font: 600 10px 'Geist', sans-serif;
            background: var(--mint); color: var(--navy); border-radius: 5px; padding: 2px 6px; }
.eyebrow { font: 600 12px 'Geist', sans-serif; color: var(--blue); }

.gradwrap { padding: 2px; border-radius: 16px;
            background: linear-gradient(90deg,#002FF8,#08F4BF,#002FF8,#06C298,#002FF8);
            background-size: 300% 100%; animation: borderflow 5s linear infinite; }
.gradwrap > .inner { background: #fff; border-radius: 14px; }

/* ---- cards ---- */
.card { background: #fff; border: 1px solid var(--bd); border-radius: 14px; }