
:root{
  --cp-navy:#062D4D; --cp-navy-900:#041F36;
  --cp-blue:#35B7F4; --cp-electric:#2E65F3;
  --cp-green:#B9FF1D; --cp-green-deep:#A6E60D; --cp-crimson:#CE1B4E;
  --cp-pale:#F2F9FC; --cp-white:#fff; --cp-charcoal:#2B2B2B;
  --cp-g100:#EEF1F3; --cp-g200:#D2D6D8; --cp-g400:#8A9298; --cp-g600:#5A6168;

  /* canonical radii — live site */
  --cp-r-sm:8px; --cp-r-md:12px; --cp-r-lg:16px; --cp-r-xl:24px; --cp-r-pill:999px;

  --cp-font:"Proxima Nova","Figtree",-apple-system,"Segoe UI",Arial,sans-serif;
  --cp-mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;

  /* ring shadows — signed off */
  --cp-sh-light:0.12; --cp-sh-dark:0.20; --cp-sh-b:34px; --cp-sh-y:11px;

  --cp-wrap:1160px; --cp-gut:clamp(20px,4vw,44px); --cp-sec:clamp(52px,5.8vw,92px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
#top .cp-page{margin:0;font-family:var(--cp-font);font-size:17.5px;line-height:1.62;color:var(--cp-charcoal);
  background:#fff;overflow-x:hidden;-webkit-font-smoothing:antialiased}
#top .cp-page img{max-width:100%;display:block}
#top .cp-page a{color:var(--cp-electric);text-decoration:none}
#top .cp-page :focus-visible{outline:3px solid var(--cp-electric);outline-offset:3px;border-radius:4px}
#top .cp-page h1, #top .cp-page h2, #top .cp-page h3, #top .cp-page h4{margin:0;color:var(--cp-navy);font-weight:700;letter-spacing:-.025em;line-height:1.08}
#top .cp-page h1{font-size:clamp(38px,5vw,60px)}
#top .cp-page h2{font-size:clamp(29px,3.5vw,44px);line-height:1.1}
#top .cp-page h3{font-size:clamp(21px,2.2vw,28px);line-height:1.18;letter-spacing:-.02em}
#top .cp-page h4{font-size:18.5px;font-weight:700;letter-spacing:-.01em;line-height:1.3}
#top .cp-page p{margin:0}
#top .cp-page .cp-wrap{max-width:var(--cp-wrap);margin:0 auto;padding:0 var(--cp-gut)}
#top .cp-page .cp-section{padding:var(--cp-sec) 0;position:relative;overflow:hidden}
#top .cp-page .cp-section > .cp-wrap{position:relative;z-index:2}
#top .cp-page .cp-lede{font-size:clamp(18px,1.8vw,20.5px);line-height:1.55;color:var(--cp-g600);max-width:56ch;margin-bottom:44px;}
#top .cp-page .cp-eyebrow{font-family:var(--cp-mono);font-size:11.5px;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;color:var(--cp-electric);display:block;margin-bottom:16px}

/* ---------- grounds ---------- */
#top .cp-page .cp-g-white{background:#fff} #top .cp-page .cp-g-pale{background:var(--cp-pale)}
#top .cp-page .cp-g-navy{background:var(--cp-navy);color:rgba(255,255,255,.76)}
#top .cp-page .cp-g-deep{background:var(--cp-navy-900);color:rgba(255,255,255,.76)}
#top .cp-page .cp-g-navy h2, #top .cp-page .cp-g-navy h3, #top .cp-page .cp-g-navy h4, #top .cp-page .cp-g-deep h2, #top .cp-page .cp-g-deep h3, #top .cp-page .cp-g-deep h4{color:#fff}
#top .cp-page .cp-g-navy .cp-lede, #top .cp-page .cp-g-deep .cp-lede{color:rgba(255,255,255,.72)}
#top .cp-page .cp-g-navy .cp-eyebrow, #top .cp-page .cp-g-deep .cp-eyebrow{color:var(--cp-green)}

/* ---------- stacked disc rings ---------- */
#top .cp-page .cp-rings{position:absolute;width:var(--cp-w,1500px);aspect-ratio:1;left:var(--cp-x,50%);top:var(--cp-y,50%);
  transform:translate(-50%,-50%);pointer-events:none;user-select:none;z-index:0}
#top .cp-page .cp-ring{position:absolute;left:50%;top:50%;border-radius:50%;width:calc(var(--cp-d)*1%);aspect-ratio:1;
  transform:translate(-50%,-50%);background:var(--cp-disc);
  box-shadow:0 var(--cp-sh-y) var(--cp-sh-b) rgba(var(--cp-sh-rgb),var(--cp-sh-a))}
#top .cp-page .cp-on-white{--cp-disc:#fff;--cp-sh-rgb:6,45,77;--cp-sh-a:var(--cp-sh-light)}
#top .cp-page .cp-on-pale{--cp-disc:#F2F9FC;--cp-sh-rgb:6,45,77;--cp-sh-a:var(--cp-sh-light)}
#top .cp-page .cp-on-navy{--cp-disc:#062D4D;--cp-sh-rgb:0,0,0;--cp-sh-a:var(--cp-sh-dark)}
#top .cp-page .cp-on-deep{--cp-disc:#041F36;--cp-sh-rgb:0,0,0;--cp-sh-a:var(--cp-sh-dark)}

/* ---------- buttons: ONE primary, ONE secondary ---------- */
#top .cp-page .cp-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-family:inherit;
  font-size:16px;font-weight:700;letter-spacing:-.01em;padding:16px 32px;border-radius:var(--cp-r-pill);
  border:2px solid transparent;cursor:pointer;transition:transform .16s,background .16s,border-color .16s}
#top .cp-page .cp-btn:hover{transform:translateY(-2px)}
#top .cp-page .cp-btn-primary{background:var(--cp-green);color:var(--cp-navy-900)}
#top .cp-page .cp-btn-primary:hover{background:var(--cp-green-deep)}
#top .cp-page .cp-btn-secondary{background:transparent;color:var(--cp-navy);border-color:var(--cp-g200)}
#top .cp-page .cp-btn-secondary:hover{border-color:var(--cp-navy)}
#top .cp-page .cp-g-navy .cp-btn-secondary, #top .cp-page .cp-g-deep .cp-btn-secondary{color:#fff;border-color:rgba(255,255,255,.4)}
#top .cp-page .cp-g-navy .cp-btn-secondary:hover, #top .cp-page .cp-g-deep .cp-btn-secondary:hover{border-color:#fff;background:rgba(255,255,255,.08)}
#top .cp-page .cp-btn-row{display:flex;flex-wrap:wrap;gap:14px}
#top .cp-page .cp-arrow{font-weight:700;display:inline-flex;align-items:center;gap:8px}
#top .cp-page .cp-arrow svg{transition:transform .16s}#top .cp-page .cp-arrow:hover svg{transform:translateX(4px)}

/* ---------- ONE media treatment, everywhere ---------- */
#top .cp-page .cp-media{border-radius:var(--cp-r-lg);overflow:hidden;border:1px solid var(--cp-g200);background:#fff}
#top .cp-page .cp-g-navy .cp-media, #top .cp-page .cp-g-deep .cp-media{border-color:rgba(255,255,255,.18)}
#top .cp-page .cp-mediacap{font-family:var(--cp-mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--cp-g400);margin-top:12px}

/* ---------- ONE card system ---------- */
#top .cp-page .cp-icard{background:#fff;border:1px solid var(--cp-g200);border-radius:var(--cp-r-lg);padding:28px;
  display:block;color:inherit;transition:border-color .18s,transform .18s}
#top .cp-page a.cp-icard:hover{border-color:var(--cp-navy);transform:translateY(-3px)}
#top .cp-page .cp-g-navy .cp-icard, #top .cp-page .cp-g-deep .cp-icard{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.16)}
#top .cp-page .cp-g-navy .cp-icard:hover, 
#top .cp-page .cp-icard h4{margin:16px 0 8px}
#top .cp-page .cp-icard h3{font-size:18.5px;font-weight:700;letter-spacing:-.01em;line-height:1.3;margin:16px 0 8px}
#top .cp-page .cp-icard > h3:first-child{margin-top:0}
/* optional card row under a section intro */
#top .cp-page .cp-cards-row{margin-top:44px}
#top .cp-page .cp-cards-row .cp-icard p{font-size:16px}
#top .cp-page .cp-icard p{font-size:15px;color:var(--cp-g600);line-height:1.5}
#top .cp-page .cp-g-navy .cp-icard p, #top .cp-page .cp-g-deep .cp-icard p{color:rgba(255,255,255,.64)}
#top .cp-page .cp-chip{flex:0 0 42px;width:42px;height:42px;min-width:42px;border-radius:var(--cp-r-md);background:rgba(46,101,243,.10);display:grid;place-items:center;color:var(--cp-electric)}
#top .cp-page .cp-g-navy .cp-chip, #top .cp-page .cp-g-deep .cp-chip{background:rgba(185,255,29,.13);color:var(--cp-green)}
#top .cp-page .cp-chip svg{flex:0 0 22px;width:22px;height:22px}
#top .cp-page .cp-grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
#top .cp-page .cp-grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
#top .cp-page .cp-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}

/* gradient word treatment — shared by the hero and the final CTA */
#top .cp-page .cp-grad{background:linear-gradient(96deg,var(--cp-blue) 0%,var(--cp-green) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent}


