:root {
  color: #f1f5f1;
  background: #0f130f;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  --bg: #0f130f;
  --surface: #171d18;
  --surface-raised: #202721;
  --line: #344038;
  --text: #f1f5f1;
  --muted: #b2bcb4;
  --green: #72dfa0;
  --cyan: #69c8ca;
  --amber: #e4ba6b;
  letter-spacing: 0;
}

* { box-sizing: border-box; letter-spacing: 0; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; background: var(--bg); }
a { color: inherit; text-decoration: none; }
.site-header {
  position: absolute;
  inset: 0 0 auto;
  z-index: 10;
  height: 72px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 28px;
  padding: 0 clamp(20px, 5vw, 76px);
  border-bottom: 1px solid rgba(255, 255, 255, .16);
}
.wordmark { width: fit-content; display: inline-flex; align-items: center; gap: 10px; font-weight: 720; }
.wordmark__mark {
  width: 35px;
  height: 35px;
  display: grid;
  place-items: center;
  border-radius: 6px;
  color: #0e160f;
  background: var(--green);
  font-size: 11px;
  font-weight: 850;
}
.site-header nav { display: flex; align-items: center; gap: 30px; color: #d8dfd9; font-size: 13px; }
.site-header nav a:hover { color: var(--green); }
.header-cta {
  justify-self: end;
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  padding: 0 14px;
  border: 1px solid rgba(255, 255, 255, .4);
  border-radius: 5px;
  font-size: 12px;
  font-weight: 700;
}
.header-cta:hover { border-color: var(--green); }
.hero {
  position: relative;
  min-height: 650px;
  height: min(82vh, 780px);
  display: flex;
  align-items: center;
  overflow: hidden;
  border-bottom: 1px solid var(--line);
}
.hero > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.hero__veil { position: absolute; inset: 0; background: rgba(5, 8, 5, .5); }
.hero__content {
  position: relative;
  z-index: 1;
  width: min(720px, 80vw);
  margin-left: clamp(20px, 8vw, 128px);
  padding-top: 56px;
}
.kicker { margin: 0 0 12px; color: var(--green); font-size: 11px; font-weight: 800; text-transform: uppercase; }
h1, h2, h3 { overflow-wrap: normal; word-break: normal; }
p { overflow-wrap: break-word; }
h1 { max-width: 700px; margin: 0; font-size: 86px; line-height: .96; font-weight: 760; white-space: nowrap; }
.hero__lede { max-width: 620px; margin: 22px 0 0; color: #e4eae5; font-size: 27px; line-height: 1.35; }
.hero__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 30px; }
.button {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 18px;
  border: 1px solid transparent;
  border-radius: 5px;
  font-size: 13px;
  font-weight: 760;
}
.button--primary { color: #0d160f; background: var(--green); }
.button--primary:hover { background: #8aecaf; }
.button--ghost { border-color: rgba(255, 255, 255, .42); background: rgba(7, 10, 7, .55); }
.button--ghost:hover { border-color: #fff; }
.hero__proof {
  max-width: 650px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 42px 0 0;
  border-top: 1px solid rgba(255, 255, 255, .26);
}
.hero__proof div { min-width: 0; padding: 16px 12px 0 0; }
.hero__proof div + div { padding-left: 16px; border-left: 1px solid rgba(255, 255, 255, .2); }
.hero__proof dt { color: #aeb8b0; font-size: 10px; }
.hero__proof dd { margin: 5px 0 0; font-size: 12px; font-weight: 720; }
.band { padding: 86px clamp(20px, 8vw, 128px); border-bottom: 1px solid var(--line); }
.section-intro { max-width: 740px; }
.section-intro h2, .security h2, .closing h2 {
  margin: 0;
  font-size: 50px;
  line-height: 1.08;
  font-weight: 690;
}
.section-intro > p:last-child { max-width: 680px; margin: 22px 0 0; color: var(--muted); font-size: 17px; line-height: 1.7; }
.platform { background: #121713; }
.platform-flow { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 64px 0 0; padding: 0; border-top: 1px solid var(--line); list-style: none; }
.platform-flow li { min-width: 0; display: grid; grid-template-columns: 44px 1fr; gap: 12px; padding: 24px 24px 0 0; }
.platform-flow li + li { padding-left: 24px; border-left: 1px solid var(--line); }
.platform-flow > li > span { color: var(--cyan); font: 12px ui-monospace, SFMono-Regular, Menlo, monospace; }
.platform-flow strong { font-size: 17px; }
.platform-flow p { margin: 10px 0 0; color: var(--muted); font-size: 14px; line-height: 1.65; }
.integrations { background: #171d18; }
.integration-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 58px; border: 1px solid var(--line); }
.integration-list article { min-width: 0; min-height: 190px; padding: 24px; background: var(--surface-raised); }
.integration-list article + article { border-left: 1px solid var(--line); }
.integration-list span { color: var(--cyan); font-size: 10px; font-weight: 800; text-transform: uppercase; }
.integration-list h3 { margin: 30px 0 8px; font-size: 19px; }
.integration-list p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.55; }
.security { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr); gap: clamp(50px, 9vw, 140px); background: #101510; }
.security__details { align-self: end; }
.security__details > p { margin: 0; color: var(--muted); font-size: 16px; line-height: 1.7; }
.security__details ul { margin: 28px 0 0; padding: 0; border-top: 1px solid var(--line); list-style: none; }
.security__details li { padding: 12px 0; border-bottom: 1px solid var(--line); color: #dbe2dc; font-size: 13px; }
.closing { min-height: 420px; display: grid; align-content: center; justify-items: center; text-align: center; background: #1a211b; }
.closing h2 { max-width: 920px; }
.closing .button { margin-top: 30px; }
footer {
  min-height: 130px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 24px;
  padding: 24px clamp(20px, 5vw, 76px);
  color: var(--muted);
  font-size: 11px;
}
footer p:last-child { justify-self: end; }
.site-header--solid { position: relative; background: #111611; }
.account-body { background: #111611; }
.account-page { min-height: calc(100vh - 202px); }
.account-intro {
  padding: 92px clamp(20px, 8vw, 128px) 72px;
  border-bottom: 1px solid var(--line);
  background: #151b16;
}
.account-intro h1 { max-width: 980px; font-size: 68px; white-space: normal; }
.account-intro > p:not(.kicker) { max-width: 760px; margin: 24px 0 0; color: var(--muted); font-size: 18px; line-height: 1.7; }
.account-notice { max-width: 760px; display: grid; gap: 6px; margin-top: 36px; padding: 16px 0; border-top: 1px solid var(--amber); border-bottom: 1px solid var(--line); }
.account-notice strong { color: var(--amber); font-size: 13px; }
.account-notice span { color: var(--muted); font-size: 12px; }
.account-services { padding: 0 clamp(20px, 8vw, 128px); background: var(--bg); }
.account-services article {
  min-height: 180px;
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr) auto;
  align-items: center;
  gap: 24px;
  border-bottom: 1px solid var(--line);
}
.account-services article > span { color: var(--cyan); font: 12px ui-monospace, SFMono-Regular, Menlo, monospace; }
.account-services article > div { min-width: 0; }
.account-services h2 { margin: 0; font-size: 26px; }
.account-services article p:last-child { margin: 10px 0 0; color: var(--muted); font-size: 14px; line-height: 1.6; }
.account-services article > strong { padding: 6px 9px; border: 1px solid var(--line); border-radius: 4px; color: var(--muted); font-size: 10px; text-transform: uppercase; }
.account-boundary { padding: 86px clamp(20px, 8vw, 128px); background: #1a211b; }
.account-boundary h2 { max-width: 860px; margin: 0; font-size: 50px; line-height: 1.08; }
.account-boundary > p:not(.kicker) { max-width: 720px; margin: 20px 0 0; color: var(--muted); font-size: 16px; line-height: 1.7; }
.account-boundary .button { margin-top: 30px; }
.cloud-label { justify-self: center; color: var(--cyan); font-size: 11px; font-weight: 800; text-transform: uppercase; }
.cloud-hero { position: relative; min-height: 670px; height: min(82vh, 780px); display: flex; align-items: center; overflow: hidden; border-bottom: 1px solid var(--line); }
.cloud-hero > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.cloud-hero__content { position: relative; z-index: 1; width: min(920px, 80vw); margin-left: clamp(20px, 8vw, 128px); padding-top: 56px; }
.cloud-hero__content h1 { font-size: 74px; white-space: normal; }
.cloud-hero__content > p:not(.kicker) { max-width: 680px; margin: 24px 0 0; color: #e4eae5; font-size: 22px; line-height: 1.55; }
.cloud-status { width: fit-content; display: inline-flex; align-items: center; gap: 9px; margin-top: 28px; padding: 9px 11px; border: 1px solid rgba(255, 255, 255, .28); border-radius: 5px; background: rgba(7, 10, 7, .62); }
.cloud-status span { width: 7px; height: 7px; border-radius: 50%; background: var(--amber); }
.cloud-status strong { font-size: 11px; }
.cloud-boundary { background: #151b16; }
.cloud-principles { max-width: 900px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 54px 0 0; border-top: 1px solid var(--line); }
.cloud-principles div { min-width: 0; padding: 20px 20px 0 0; }
.cloud-principles div + div { padding-left: 20px; border-left: 1px solid var(--line); }
.cloud-principles dt { color: var(--cyan); font-size: 11px; font-weight: 800; }
.cloud-principles dd { margin: 8px 0 0; color: var(--muted); font-size: 13px; line-height: 1.55; }

@media (max-width: 900px) {
  .site-header { grid-template-columns: 1fr auto; }
  .site-header nav { display: none; }
  .hero { min-height: 620px; height: 78vh; }
  .hero > img { object-position: 56% center; }
  .hero__content { width: calc(100% - 40px); margin: 0 20px; }
  h1 { font-size: 68px; }
  .section-intro h2, .security h2, .closing h2 { font-size: 42px; }
  .platform-flow { grid-template-columns: 1fr; }
  .platform-flow li, .platform-flow li + li { padding: 20px 0; border-left: 0; border-bottom: 1px solid var(--line); }
  .integration-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .integration-list article:nth-child(3) { border-top: 1px solid var(--line); border-left: 0; }
  .integration-list article:nth-child(4) { border-top: 1px solid var(--line); }
  .security { grid-template-columns: 1fr; }
  .account-intro h1 { font-size: 56px; }
  .cloud-hero__content h1 { font-size: 60px; }
}

@media (max-width: 560px) {
  .site-header { height: 62px; padding: 0 14px; }
  .wordmark { font-size: 14px; }
  .wordmark__mark { width: 31px; height: 31px; }
  .header-cta { min-height: 34px; padding: 0 10px; font-size: 10px; }
  .hero { min-height: 650px; height: 86vh; max-height: 720px; }
  .hero > img { object-position: 61% center; }
  .hero__veil { background: rgba(5, 8, 5, .62); }
  .hero__content { padding-top: 42px; }
  h1 { font-size: 44px; }
  .hero__lede { font-size: 19px; }
  .section-intro h2, .security h2, .closing h2 { font-size: 34px; }
  .hero__actions { align-items: stretch; flex-direction: column; }
  .hero__proof { grid-template-columns: 1fr; margin-top: 28px; }
  .hero__proof div, .hero__proof div + div { display: grid; grid-template-columns: 1fr 1fr; padding: 8px 0; border-left: 0; border-bottom: 1px solid rgba(255, 255, 255, .16); }
  .hero__proof dd { margin: 0; text-align: right; }
  .band { padding: 64px 18px; }
  .section-intro > p:last-child { font-size: 15px; }
  .integration-list { grid-template-columns: 1fr; }
  .integration-list article, .integration-list article + article { min-height: 150px; border-top: 1px solid var(--line); border-left: 0; }
  .integration-list article:first-child { border-top: 0; }
  .integration-list h3 { margin-top: 20px; }
  .account-intro { padding: 70px 18px 56px; }
  .account-intro h1 { font-size: 40px; }
  .account-intro > p:not(.kicker) { font-size: 15px; }
  .account-services { padding: 0 18px; }
  .account-services article { grid-template-columns: 34px minmax(0, 1fr); gap: 12px; padding: 28px 0; }
  .account-services article > strong { grid-column: 2; width: fit-content; }
  .account-services h2 { font-size: 22px; }
  .account-boundary { padding: 64px 18px; }
  .account-boundary h2 { font-size: 34px; }
  .cloud-label { display: none; }
  .cloud-hero { min-height: 690px; height: 86vh; max-height: 740px; }
  .cloud-hero > img { object-position: 61% center; }
  .cloud-hero__content { width: calc(100% - 36px); margin: 0 18px; padding-top: 42px; }
  .cloud-hero__content h1 { font-size: 42px; white-space: normal; }
  .cloud-hero__content > p:not(.kicker) { font-size: 17px; }
  .cloud-principles { grid-template-columns: 1fr; }
  .cloud-principles div, .cloud-principles div + div { padding: 16px 0; border-left: 0; border-bottom: 1px solid var(--line); }
  footer { grid-template-columns: 1fr; justify-items: start; }
  footer p { margin: 0; }
  footer p:last-child { justify-self: start; }
}