/* Criticality Sciences — critsci.com
   Single sitewide stylesheet. No inline styles anywhere in the HTML: the site
   runs under a strict Content-Security-Policy (style-src 'self').
   Values transcribed 1:1 from the approved design (claude.ai/design project
   "Public Website", site/index.html). */

/* ---------- fonts (self-hosted, OFL-licensed; see fonts/OFL.txt) ---------- */

@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(../fonts/geist-latin-9b6f5ff4.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Geist Mono';
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url(../fonts/geist-mono-latin-5f3d6ad6.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 600 700;
  font-display: swap;
  src: url(../fonts/hanken-latin-1f21c6ea.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ---------- base ---------- */

* { box-sizing: border-box; }

html { background: #FFFFFF; }
@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}

body {
  margin: 0;
  padding: 0;
  background: #FFFFFF;
  color: #0F1B2D;
  font-family: 'Geist', 'Helvetica Neue', Arial, sans-serif;
}

a { color: #2E67B1; text-decoration: none; }
a:hover { color: #253D8F; }

::selection { background: #B6D2EE; }

:focus-visible { outline: 2px solid #2E67B1; outline-offset: 2px; }
.site-nav :focus-visible,
.hero :focus-visible,
.panel :focus-visible,
.sec--dark :focus-visible { outline-color: #6FA3E0; }

[id] { scroll-margin-top: 76px; }

img { border: 0; }

ul, ol { margin: 0; padding: 0; list-style: none; }
h1, h2, h3, p, dl, dt, dd, figure, blockquote { margin: 0; }

.skip-link {
  position: absolute;
  left: -9999px;
  z-index: 100;
  background: #FFFFFF;
  color: #0F1B2D;
  padding: 10px 16px;
  border-radius: 0 0 6px 0;
  font: 600 14px/20px 'Geist', sans-serif;
}
.skip-link:focus { left: 0; top: 0; }

/* ---------- shared type & buttons ---------- */

.eyebrow {
  font: 600 11px/14px 'Geist', sans-serif;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #6B7280;
}
.eyebrow--light { color: #6FA3E0; }

.h2 {
  font: 700 36px/42px 'Hanken Grotesk', sans-serif;
  letter-spacing: -0.02em;
  color: #0F1B2D;
}
.h2--light { color: #FFFFFF; }

.lede { font: 400 16px/26px 'Geist', sans-serif; color: #374151; }

.btn-solid {
  display: inline-block;
  font: 600 14px/20px 'Geist', sans-serif;
  color: #FFFFFF;
  background: #2E67B1;
  padding: 9px 18px;
  border-radius: 6px;
}
.btn-solid:hover { background: #275A9D; color: #FFFFFF; }

.btn-solid--lg { font: 600 15px/20px 'Geist', sans-serif; padding: 12px 24px; }

.btn-ghost {
  display: inline-block;
  font: 600 15px/20px 'Geist', sans-serif;
  color: #FFFFFF;
  border: 1px solid rgba(255, 255, 255, 0.28);
  padding: 11px 24px;
  border-radius: 6px;
}
.btn-ghost:hover { background: rgba(255, 255, 255, 0.08); color: #FFFFFF; }

.btn-invert {
  display: inline-block;
  font: 600 15px/20px 'Geist', sans-serif;
  color: #0F1B2D;
  background: #FFFFFF;
  padding: 13px 26px;
  border-radius: 6px;
  flex: none;
}
.btn-invert:hover { background: #E4EEF8; color: #0F1B2D; }

.btn-solid:active, .btn-ghost:active, .btn-invert:active { transform: translateY(1px); }

/* ---------- nav ---------- */

.site-nav {
  position: sticky;
  top: 0;
  z-index: 20;
  background: #0F1B2D;
  padding: 0 64px;
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.site-nav__logo { height: 44px; width: auto; display: block; }
.site-nav__menu { display: flex; align-items: center; gap: 32px; }
.nav-link { font: 500 14px/20px 'Geist', sans-serif; color: #D1D5DB; }
.nav-link:hover { color: #FFFFFF; }

/* ---------- hero ---------- */

.hero { background: #0F1B2D; position: relative; overflow: hidden; }
.hero__grid {
  position: relative;
  max-width: 1240px;
  margin: 0 auto;
  padding: 88px 64px 96px;
  display: grid;
  grid-template-columns: 560px 1fr;
  gap: 72px;
  align-items: center;
}
.hero__copy { display: flex; flex-direction: column; gap: 24px; }
.hero__title {
  font: 700 60px/64px 'Hanken Grotesk', sans-serif;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
.hero__sub { font: 400 18px/28px 'Geist', sans-serif; color: #B6D2EE; }
.hero__cta { display: flex; gap: 12px; margin-top: 8px; }
.hero__viz { display: flex; flex-direction: column; gap: 14px; }
.hero__svg { width: 100%; display: block; }
.hero__note {
  font: 400 13px/19px 'Geist', sans-serif;
  color: #6FA3E0;
  border-left: 2px solid #253D8F;
  padding-left: 12px;
}

.halo {
  transform-box: fill-box;
  transform-origin: center;
  animation: halo-pulse 2.4s ease-in-out infinite;
}
@keyframes halo-pulse {
  0%, 100% { transform: scale(0.67); opacity: 1; }
  50%      { transform: scale(1.6); opacity: 0.55; }
}
@media (prefers-reduced-motion: reduce) {
  .halo { animation: none; }
}

.proof-strip {
  position: relative;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  padding: 18px 64px;
  display: flex;
  justify-content: center;
  gap: 56px;
}
.proof-strip__item {
  font: 500 12px/18px 'Geist Mono', monospace;
  color: #9CA3AF;
  letter-spacing: .04em;
}

/* ---------- section shells ---------- */

.sec { padding: 96px 64px; }
.sec--white { background: #FFFFFF; }
.sec--gray { background: #F1F5F9; }
.sec--dark { background: #0F1B2D; }
.sec--line-t { border-top: 1px solid #E5E7EB; }
.sec--line-b { border-bottom: 1px solid #E5E7EB; }
.sec--recognition { padding: 72px 64px; }
.sec--footer { padding: 96px 64px 0; }

.sec__inner { max-width: 1140px; margin: 0 auto; }
.sec__inner--col { display: flex; flex-direction: column; gap: 48px; }

.sec-head { display: flex; flex-direction: column; gap: 14px; max-width: 640px; }
.sec-head--wide { max-width: 720px; }

/* ---------- the shift ---------- */

.shift__grid {
  max-width: 1140px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 440px 1fr;
  gap: 72px;
}
.shift__head { display: flex; flex-direction: column; gap: 16px; }
.shift__body { display: flex; flex-direction: column; gap: 24px; padding-top: 34px; }

.ask-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.ask {
  border-radius: 10px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ask--reliability { background: #EEF1F4; border: 1px dashed #C6CDD6; }
.ask--resilience {
  background: #253D8F;
  border: 1px solid #253D8F;
  box-shadow: 0 8px 24px rgba(37, 61, 143, 0.28);
}
.ask__label { font: 600 12px/16px 'Geist Mono', monospace; color: #8A94A1; }
.ask--resilience .ask__label { color: #9BC0EA; }
.ask__q { font: 500 17px/25px 'Geist', sans-serif; color: #6B7280; }
.ask--resilience .ask__q { color: #FFFFFF; }

/* ---------- method (platform) ---------- */

.method-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.method-card {
  background: #FFFFFF;
  border: 1px solid #E5E7EB;
  border-radius: 10px;
  padding: 28px 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  box-shadow: 0 1px 2px rgba(15, 27, 45, 0.06);
}
.method-card__num { font: 600 13px/18px 'Geist Mono', monospace; color: #2E67B1; }
.method-card__name { font: 600 17px/23px 'Geist', sans-serif; color: #0F1B2D; }
.method-card__desc { font: 400 14px/21px 'Geist', sans-serif; color: #4B5563; }

/* ---------- metrics ---------- */

.metrics__grid {
  max-width: 1140px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 520px;
  gap: 72px;
  align-items: center;
}
.metrics__copy { display: flex; flex-direction: column; gap: 20px; }
.metric-list { display: flex; flex-direction: column; gap: 10px; }
.metric-list__item { display: flex; gap: 12px; align-items: baseline; }
.metric-list__dot {
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: #2E67B1;
  flex: none;
  transform: translateY(-3px);
}
.metric-list__text { font: 400 15px/23px 'Geist', sans-serif; color: #374151; }
.metric-list__text strong { font-weight: 600; color: #0F1B2D; }

.panel {
  background: #0F1B2D;
  border-radius: 10px;
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 28px;
  box-shadow: 0 12px 32px rgba(15, 27, 45, 0.12);
}
.panel__head { display: flex; justify-content: space-between; align-items: center; }
.panel__chip {
  font: 600 11px/16px 'Geist Mono', monospace;
  color: #B6D2EE;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 4px;
  padding: 2px 8px;
}
.panel__stats { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.stat { display: flex; flex-direction: column; gap: 6px; }
.stat__name { font: 500 12px/16px 'Geist', sans-serif; color: #9CA3AF; }
.stat__value {
  font: 600 40px/40px 'Geist Mono', monospace;
  color: #FFFFFF;
  font-variant-numeric: tabular-nums;
}
.stat__unit { font-size: 18px; color: #6FA3E0; }
.panel__note {
  font: 400 12px/17px 'Geist', sans-serif;
  color: #6B7280;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  padding-top: 14px;
}

/* ---------- sectors ---------- */

.sector-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.sector-card {
  position: relative;
  border-radius: 10px;
  overflow: hidden;
  min-height: 380px;
  display: flex;
  align-items: flex-end;
}
.sector-card__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(0.6);
}
.sector-card__scrim {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(15, 27, 45, 0.1) 20%, rgba(15, 27, 45, 0.92) 100%);
}
.sector-card__body {
  position: relative;
  padding: 28px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.sector-card__name { font: 700 24px/30px 'Hanken Grotesk', sans-serif; color: #FFFFFF; }
.sector-card__desc { font: 400 14px/22px 'Geist', sans-serif; color: #D1D5DB; }

/* ---------- recognition ---------- */

.recog__grid {
  max-width: 1140px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 200px;
  gap: 72px;
  align-items: center;
}
.recog__copy { display: flex; flex-direction: column; gap: 16px; }
.recog__quote {
  font: 700 28px/36px 'Hanken Grotesk', sans-serif;
  letter-spacing: -0.015em;
  color: #0F1B2D;
}
.recog__credit { font: 500 14px/20px 'Geist', sans-serif; color: #4B5563; }
.recog__credit a { color: #2E67B1; }
.recog__badge { width: 200px; height: 200px; }

/* ---------- security ---------- */

.security__grid {
  max-width: 1140px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 420px 1fr;
  gap: 72px;
}
.security__copy { display: flex; flex-direction: column; gap: 16px; }
.security__pledge { font: 400 15px/24px 'Geist', sans-serif; color: #B6D2EE; }
.security__pledge a { color: #B6D2EE; text-decoration: underline; }
.security__pledge a:hover { color: #FFFFFF; }

.feat-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px 32px;
  padding-top: 8px;
}
.feat {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  padding-top: 20px;
}
.feat__icon { flex: none; margin-top: 2px; }
.feat__body { display: flex; flex-direction: column; gap: 4px; }
.feat__name { font: 600 15px/21px 'Geist', sans-serif; color: #FFFFFF; }
.feat__desc { font: 400 13px/20px 'Geist', sans-serif; color: #9CA3AF; }
.feat__desc a { color: #B6D2EE; }
.feat__desc a:hover { color: #FFFFFF; }

/* ---------- team ---------- */

.team-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 24px; }
.member { display: flex; flex-direction: column; gap: 12px; }
.member__photo {
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  border-radius: 10px;
  filter: saturate(0.85);
}
.member__id { display: flex; flex-direction: column; gap: 2px; }
.member__name { font: 600 16px/22px 'Geist', sans-serif; color: #0F1B2D; }
.member__role { font: 500 12px/16px 'Geist Mono', monospace; color: #2E67B1; }
.member__bio { font: 400 13px/20px 'Geist', sans-serif; color: #4B5563; }

/* ---------- contact / footer ---------- */

.footer__inner {
  max-width: 1140px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 64px;
}
.contact {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 48px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  padding-bottom: 64px;
}
.contact__copy { display: flex; flex-direction: column; gap: 14px; max-width: 720px; }
.contact__title {
  font: 700 34px/40px 'Hanken Grotesk', sans-serif;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
.contact__sub { font: 400 16px/25px 'Geist', sans-serif; color: #B6D2EE; }

.footer-cols {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 48px;
}
.footer-id { display: flex; flex-direction: column; gap: 16px; }
.footer-id__logo { height: 48px; width: auto; display: block; align-self: flex-start; margin-left: -6px; }
.footer-id__addr { font: 400 13px/21px 'Geist', sans-serif; color: #9CA3AF; }

.footer-nav { display: flex; gap: 64px; }
.footer-nav__group { display: flex; flex-direction: column; gap: 8px; }
.footer-nav__item, .footer-nav a { font: 400 14px/20px 'Geist', sans-serif; color: #B6D2EE; }
.footer-nav a:hover { color: #FFFFFF; }

.footer-legal {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  padding: 20px 0 28px;
  display: flex;
  justify-content: space-between;
  gap: 24px;
}
.footer-legal__copyright { font: 400 12px/18px 'Geist', sans-serif; color: #6B7280; }
.footer-legal__patents {
  font: 400 12px/18px 'Geist', sans-serif;
  color: #6B7280;
  text-align: right;
  max-width: 640px;
}

/* ---------- subpages (404, trust, privacy) ---------- */

.page { max-width: 760px; margin: 0 auto; padding: 96px 64px; display: flex; flex-direction: column; gap: 24px; }
.page--wide { max-width: 900px; }
.page__title {
  font: 700 40px/46px 'Hanken Grotesk', sans-serif;
  letter-spacing: -0.02em;
  color: #0F1B2D;
}
.page__lede { font: 400 16px/26px 'Geist', sans-serif; color: #374151; }
.page__meta { font: 500 12px/16px 'Geist Mono', monospace; color: #2E67B1; letter-spacing: .04em; text-transform: uppercase; }

/* Ported Termly notices (privacy, cookies): verbatim Termly markup, restyled.
   Termly wraps heading text in semantic h1–h3 inside data-custom-class spans;
   neutralize the tags' default sizing so the span classes control appearance. */
.policy { font: 400 15px/24px 'Geist', sans-serif; color: #374151; overflow-wrap: break-word; }
.policy div { margin: 0 0 6px; }
.policy h1, .policy h2, .policy h3 { font: inherit; margin: 0; display: inline; }
.policy [data-custom-class='title'] { font: 700 28px/34px 'Hanken Grotesk', sans-serif; color: #0F1B2D; }
.policy [data-custom-class='subtitle'] { font: 500 14px/20px 'Geist', sans-serif; color: #6B7280; }
.policy [data-custom-class='heading_1'] { display: block; margin-top: 28px; font: 700 20px/26px 'Hanken Grotesk', sans-serif; color: #0F1B2D; }
.policy [data-custom-class='heading_2'] { display: block; margin-top: 18px; font: 600 16px/22px 'Geist', sans-serif; color: #0F1B2D; }
.policy [data-custom-class='body_text'] { font: 400 15px/24px 'Geist', sans-serif; color: #374151; }
.policy a, .policy [data-custom-class='link'] { color: #2E67B1; word-break: break-word; }
.policy ul { margin: 8px 0 8px 24px; list-style: square; }
.policy ul li { margin-bottom: 6px; }
.policy table { border-collapse: collapse; margin: 16px 0; width: 100%; }
.policy td, .policy th {
  border: 1px solid #E5E7EB;
  padding: 8px 10px;
  vertical-align: top;
  font: 400 13px/20px 'Geist', sans-serif;
}
/* Cookie-policy per-cookie cards: the <section> is the card; its inner table is borderless. */
.policy section { display: block; border: 1px solid #E5E7EB; border-radius: 8px; padding: 6px 14px; margin: 0 0 12px; }
.policy section table { margin: 0; }
.policy section th, .policy section td { border: 0; padding: 3px 8px; text-align: left; }
.policy section th { color: #0F1B2D; white-space: nowrap; }

/* ---------- responsive ---------- */

@media (max-width: 1100px) {
  .site-nav { padding: 0 28px; }
  .sec { padding-left: 32px; padding-right: 32px; }
  .hero__grid { grid-template-columns: 1fr; padding: 64px 32px 72px; gap: 48px; }
  .shift__grid, .metrics__grid, .recog__grid, .security__grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .method-grid { grid-template-columns: 1fr 1fr; }
  .team-grid { grid-template-columns: repeat(3, 1fr); }
  .page { padding: 72px 32px; }
}

@media (max-width: 720px) {
  .site-nav { padding: 0 20px; }
  .nav-link { display: none; }
  .site-nav__menu { gap: 16px; }
  .hero__grid { padding: 48px 20px 56px; gap: 40px; }
  .hero__title { font-size: 40px; line-height: 46px; }
  .proof-strip {
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 14px 20px;
  }
  .sec { padding: 56px 20px; }
  .sec--footer { padding-bottom: 0; }
  .ask-grid, .panel__stats, .sector-grid, .feat-grid, .method-grid { grid-template-columns: 1fr; }
  .team-grid { grid-template-columns: 1fr 1fr; }
  .contact, .footer-cols { flex-direction: column; align-items: flex-start; }
  .hero__cta, .footer-nav { flex-wrap: wrap; }
  .footer-legal { flex-direction: column; align-items: center; gap: 12px; }
  .footer-legal__copyright, .footer-legal__patents { text-align: center; }
  .page { padding: 56px 20px; }
}