/* Open Intelligence — layout system reproduced from the reference (findings F5), Open Intelligence accent.
   DM Sans for UI/headlines, Crimson Pro for h3/quotes; square corners; 1px hairlines. */
:root {
  --ink: #020d23;
  --ink-90: #061336;
  --ink-80: #212b44;
  --ink-60: rgba(2, 13, 35, 0.6);
  --ink-40: rgba(2, 13, 35, 0.4);
  --line: rgba(2, 13, 35, 0.09);
  --line-2: #e5e6eb;
  --paper: #fff;
  --warm: #f7f4f3;
  --warm-2: #ede7e5;
  --accent: #4e59f1;
  --accent-2: #6b55f6;
  --accent-3: #ec5fb0;
  --sky: #bdecf6;
  --blue: #b4d7ff;
  --mint: #e8f5ce;
  --lilac: #e9cdff;
  --pink: #ffcce7;
  --sand: #fbeebb;
  --peach: #fce3c5;
  --sans: "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --serif: "Crimson Pro", Georgia, serif;
  --wrap: 1200px;
  --shadow: 0 24px 60px -30px rgba(2, 13, 35, 0.35);
}
* {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
}
body {
  margin: 0;
  font-family: var(--sans);
  color: var(--ink);
  background: var(--paper);
  font-size: 16px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
a {
  color: inherit;
  text-decoration: none;
}
h1,
h2,
h3,
h4,
p,
blockquote,
ul,
dl,
dd {
  margin: 0;
}
ul {
  padding: 0;
  list-style: none;
}
button {
  font: inherit;
  color: inherit;
  background: none;
  border: 0;
  cursor: pointer;
}
em {
  font-family: var(--serif);
  font-style: italic;
  font-weight: 400;
}
.wrap {
  max-width: var(--wrap);
  margin: 0 auto;
  padding-inline: clamp(20px, 4vw, 40px);
}
.narrow {
  max-width: 760px;
}
.center {
  text-align: center;
}
.serif {
  font-family: var(--serif);
  font-weight: 500;
}
.muted {
  color: var(--ink-60);
}
.sm {
  font-size: 0.8125rem;
}
.ico {
  width: 20px;
  height: 20px;
  flex: none;
}
.arr {
  width: 18px;
  height: 18px;
  flex: none;
  transition: transform 0.25s;
}

/* type */
.h1 {
  font-size: clamp(2.4rem, 5.2vw, 4rem);
  line-height: 1.04;
  font-weight: 400;
  letter-spacing: -0.02em;
  text-wrap: balance;
}
.h1.sm {
  font-size: clamp(2rem, 4vw, 3.25rem);
}
.h1.upper,
.h2.upper {
  text-transform: uppercase;
  font-weight: 500;
  letter-spacing: -0.02em;
}
.h2 {
  font-size: clamp(1.75rem, 3.4vw, 2.75rem);
  line-height: 1.08;
  font-weight: 400;
  letter-spacing: -0.015em;
  text-wrap: balance;
}
.h2.sm {
  font-size: clamp(1.5rem, 2.6vw, 2.125rem);
}
.h3 {
  font-size: 1.5rem;
  line-height: 1.15;
  font-weight: 400;
  letter-spacing: -0.01em;
}
.lead {
  color: var(--ink-60);
  font-size: 1.0625rem;
  max-width: 60ch;
  margin-top: 1rem;
}
.center .lead,
.center-head .lead,
.hero-center .lead {
  margin-inline: auto;
}
.eyebrow {
  font-size: 0.6875rem;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--ink-60);
  font-weight: 500;
  margin-bottom: 0.75rem;
}
.eyebrow.center {
  text-align: center;
}

/* tones */
.tone-sky {
  background: linear-gradient(160deg, #dff6fb, var(--sky));
}
.tone-blue {
  background: linear-gradient(160deg, #dcebff, var(--blue));
}
.tone-mint {
  background: linear-gradient(160deg, #f3fae3, var(--mint));
}
.tone-lilac {
  background: linear-gradient(160deg, #f5e8ff, var(--lilac));
}
.tone-pink {
  background: linear-gradient(160deg, var(--pink), #c9b5ff);
}
.tone-sand {
  background: linear-gradient(160deg, #fdf6da, var(--sand));
}
.tone-peach {
  background: linear-gradient(160deg, #fef0df, var(--peach));
}
.tone-night {
  background: linear-gradient(160deg, #0a1440, #1b2a7a);
  color: #fff;
}

/* sections */
.sec {
  padding-block: clamp(3.5rem, 7vw, 5.5rem);
}
.tint {
  background: var(--warm);
}
.tint.grad {
  background: linear-gradient(180deg, var(--warm) 40%, var(--sky));
}
.dark {
  background: var(--ink-90);
  color: #fff;
}
.dark .lead,
.dark .eyebrow,
.dark p {
  color: rgba(255, 255, 255, 0.7);
}
.two {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: start;
}
.split-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 2rem;
  flex-wrap: wrap;
}
.center-head {
  text-align: center;
  max-width: 760px;
  margin: 0 auto 3rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.center-head .btn {
  margin-top: 1.75rem;
}
.stack {
  display: grid;
  gap: 1.25rem;
}
.panel {
  display: grid;
  place-items: center;
  padding: clamp(1.25rem, 3vw, 2.5rem);
  min-height: 320px;
  overflow: hidden;
}
.panel.tall {
  min-height: 440px;
}