@font-face {
  font-family:Archivo;
  src:url('fonts/archivo-latin-wdth-normal.woff2') format('woff2');
  font-weight:100 900;
  font-display:swap
}

@font-face {
  font-family:Plex;
  src:url('fonts/ibm-plex-sans-latin-wdth-normal.woff2') format('woff2');
  font-weight:100 900;
  font-display:swap
}

:root {
  --ink:#182638;
  --muted:#566478;
  --blue:#315bdf;
  --mist:#edf3ff;
  --green:#dcebd4;
  --line:#dce2eb;
  --paper:#fff;
  --radius:12px;
  font-family:Plex,Arial,sans-serif;
  color:var(--ink);
  background:var(--paper);
  font-synthesis:none;
  scroll-behavior:smooth
}

* {
  box-sizing:border-box
}

body {
  margin:0;
  font-size:17px;
  line-height:1.65
}

h1,h2,h3,p,figure {
  margin:0
}

h1,h2,h3 {
  font-family:Archivo,Arial,sans-serif;
  font-weight:600;
  letter-spacing:-.045em;
  line-height:1.09
}

a {
  color:inherit;
  text-underline-offset:4px
}

button,input,select,textarea {
  font:inherit
}

button,a,input,select,textarea,summary {
  -webkit-tap-highlight-color:transparent
}

:focus-visible {
  outline:3px solid var(--blue);
  outline-offset:5px
}

section[id] {
  scroll-margin-top:100px
}

.container {
  width:min(1200px,calc(100% - 96px));
  margin-inline:auto
}

.section {
  padding-block:112px
}

.skip-link {
  position:fixed;
  top:12px;
  left:16px;
  z-index:100;
  transform:translateY(-180%);
  background:var(--ink);
  color:white;
  padding:10px 20px
}

.skip-link:focus {
  transform:none
}

.site-header {
  height:96px;
  border-bottom:1px solid #e9edf2;
  background:white
}

.nav-row {
  height:100%;
  display:flex;
  align-items:center;
  gap:36px
}

.wordmark {
  display:inline-flex;
  gap:10px;
  align-items:center;
  font-family:Archivo,Arial,sans-serif;
  font-weight:650;
  font-size:21px;
  letter-spacing:-.7px;
  text-decoration:none;
  white-space:nowrap
}

.wordmark img {
  object-fit:contain
}

.brand-period {
  color:var(--blue)
}

nav {
  display:flex;
  gap:30px
}

nav a,.sign-in {
  font-size:14px;
  text-decoration:none;
  font-weight:500
}

nav a:hover,.sign-in:hover {
  color:var(--blue)
}

.nav-row nav {
  margin-left:auto
}

.nav-actions {
  display:flex;
  gap:26px;
  align-items:center
}

.button {
  display:inline-flex;
  justify-content:center;
  align-items:center;
  gap:26px;
  min-height:52px;
  padding:13px 23px;
  background:var(--blue);
  border:1px solid var(--blue);
  border-radius:6px;
  color:white;
  text-decoration:none;
  font-weight:500;
  font-size:15px;
  cursor:pointer;
  line-height:1.4;
  transition:background .15s
}

.button:hover {
  background:#2447b5
}

.button span {
  font-size:20px;
  font-weight:400
}

.button-small {
  min-height:42px;
  padding:9px 18px;
  gap:15px;
  font-size:14px
}

.button-outline {
  background:transparent;
  color:var(--ink);
  border-color:#a4b3c5
}

.button-outline:hover {
  background:white
}

.hero {
  display:grid;
  grid-template-columns:1.05fr 1fr;
  gap:50px;
  padding-block:82px 90px;
  align-items:center
}

.intro-label,.section-kicker {
  font-size:14px;
  font-weight:500;
  color:var(--blue);
  margin-bottom:22px
}

.intro-label {
  display:flex;
  align-items:center;
  gap:9px
}

.status-dot {
  display:inline-block;
  width:7px;
  height:7px;
  background:#518968;
  border-radius:50%;
  flex-shrink:0
}

h1 {
  font-size:clamp(44px,4.6vw,65px);
  letter-spacing:-.055em;
  line-height:1.04
}

.hero-description {
  font-size:18px;
  color:var(--muted);
  max-width:460px;
  margin-top:26px;
  line-height:1.7
}

.hero-actions {
  display:flex;
  gap:22px;
  align-items:center;
  margin-top:30px;
  flex-wrap:wrap
}

.text-link {
  font-size:14px;
  font-weight:500;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  gap:10px
}

.text-link:hover {
  text-decoration:underline
}

.play-icon {
  border:1px solid var(--line);
  width:27px;
  height:27px;
  border-radius:50%;
  display:inline-grid;
  place-items:center;
  font-size:15px
}

.micro-copy {
  font-size:12px;
  color:var(--muted);
  margin-top:19px
}

.hero-visual {
  height:550px;
  background:#eaf0fc;
  border-radius:18px;
  position:relative;
  isolation:isolate;
  background-image:radial-gradient(#bac9e4 .7px,transparent .7px);
  background-size:18px 18px;
  border:1px solid #dfe7f6
}

.scene-top {
  height:55px;
  display:flex;
  gap:14px;
  align-items:center;
  font-size:11px;
  color:#63728a;
  padding:0 24px;
  background:#edf3ffd9;
  border-radius:18px 18px 0 0
}

.mini-mark {
  font-family:Archivo;
  font-weight:650;
  font-size:19px;
  letter-spacing:-2px;
  color:var(--ink)
}

.mini-mark span {
  color:#7290cf
}

.scene-dots {
  margin-left:auto;
  letter-spacing:3px
}

.topic-note {
  position:absolute;
  top:74px;
  left:25px;
  right:40px;
  display:flex;
  align-items:center;
  gap:13px;
  background:#fff;
  padding:13px 17px;
  border:1px solid #dce4f3;
  border-radius:9px;
  box-shadow:0 5px 15px #1f407007;
  transform:rotate(-3deg);
  z-index:3
}

.note-icon {
  font-size:26px;
  color:var(--blue)
}

.small-label {
  display:block;
  color:var(--muted);
  font-size:10px
}

.topic-note strong {
  display:block;
  font-size:13px;
  font-weight:500
}

.article-preview {
  position:absolute;
  top:160px;
  left:47px;
  right:33px;
  background:white;
  border:1px solid #d9e1ee;
  border-radius:9px;
  box-shadow:0 16px 28px #1e3d6c0b;
  transform:rotate(2deg);
  overflow:hidden
}

.preview-toolbar {
  display:flex;
  justify-content:space-between;
  padding:10px 17px;
  border-bottom:1px solid #e7ecf5;
  font-size:9px;
  color:var(--muted)
}

.preview-toolbar>span:first-child {
  display:flex;
  align-items:center;
  gap:6px
}

.preview-toolbar>span:last-child {
  background:#f0f3fa;
  border-radius:4px;
  padding:0 6px
}

.article-preview-body {
  padding:21px 27px
}

.article-category {
  font-size:9px;
  color:var(--blue);
  margin-bottom:9px
}

.article-preview h2 {
  font-size:27px;
  letter-spacing:-1px
}

.article-preview-body>p:not(.article-category) {
  font-size:10px;
  color:var(--muted);
  margin-top:12px
}

.document-lines {
  display:grid;
  gap:6px;
  margin-top:16px
}

.document-lines i {
  display:block;
  height:4px;
  background:#e9edf3;
  border-radius:2px
}

.document-lines i:nth-child(2) {
  width:95%
}

.document-lines i:last-child {
  width:71%
}

.source-note {
  margin-top:14px;
  display:flex;
  gap:12px;
  align-items:center;
  background:#f0f5ed;
  border-left:2px solid #8eaf7c;
  padding:9px 12px;
  font-size:9px;
  color:#4e6451
}

.source-note>span:first-child {
  font-size:22px
}

.source-note strong {
  font-weight:500
}

.shorter {
  margin-top:13px
}

.preview-footer {
  display:flex;
  gap:10px;
  align-items:center;
  padding:10px 20px;
  border-top:1px solid #e8edf5;
  font-size:8px;
  color:var(--muted)
}

.avatar-stack {
  display:flex;
  padding-left:5px
}

.avatar-stack i {
  font-style:normal;
  display:grid;
  place-items:center;
  width:21px;
  height:21px;
  border:2px solid white;
  border-radius:50%;
  background:#dce7fc;
  margin-left:-5px;
  color:#475985;
  font-size:8px
}

.avatar-stack i:nth-child(2) {
  background:#f4dfcf
}

.avatar-stack i:nth-child(3) {
  background:#e0ebd7
}

.review-note {
  position:absolute;
  right:-18px;
  top:319px;
  background:#fff;
  border:1px solid #dce2eb;
  border-radius:8px;
  padding:12px 16px;
  display:flex;
  gap:10px;
  align-items:center;
  transform:rotate(-3deg);
  box-shadow:0 8px 20px #223e5b0d;
  z-index:5
}

.review-note strong {
  display:block;
  font-size:11px
}

.review-note div>span {
  display:block;
  font-size:9px;
  color:var(--muted)
}

.check-circle {
  background:#dcebd4;
  color:#416537;
  border-radius:50%;
  width:25px;
  height:25px;
  display:grid;
  place-items:center;
  font-size:14px
}

.approval-note {
  position:absolute;
  bottom:32px;
  right:38px;
  background:#f4d5bc;
  padding:6px 10px;
  border-radius:4px;
  font-size:10px;
  transform:rotate(-3deg)
}

.cursor {
  position:absolute;
  left:-20px;
  top:-18px;
  transform:rotate(-115deg);
  font-size:25px;
  color:#ba7440
}

.scene-caption {
  position:absolute;
  bottom:9px;
  left:0;
  right:0;
  text-align:center;
  font-size:8px;
  color:#6a7890
}

.workflow-strip {
  border-block:1px solid var(--line);
  background:#fafbfd
}

.workflow-strip>.container {
  display:flex;
  gap:40px;
  align-items:center;
  justify-content:space-between;
  padding-block:27px
}

.workflow-strip p {
  font-size:12px;
  color:var(--muted);
  line-height:1.7
}

.workflow-strip p strong {
  font-weight:500;
  color:var(--ink)
}

.workflow-strip ul {
  list-style:none;
  display:flex;
  gap:36px;
  padding:0;
  margin:0
}

.workflow-strip li {
  font-family:Archivo;
  font-size:18px;
  font-weight:500;
  letter-spacing:-.5px;
  white-space:nowrap
}

.workflow-strip li span {
  color:#90a2b9;
  font-size:17px;
  margin-left:14px
}

.section-heading {
  max-width:660px
}

.section-kicker {
  margin-bottom:17px
}

.section-heading h2,h2 {
  font-size:45px
}

.section-heading>p:last-child {
  color:var(--muted);
  max-width:550px;
  margin-top:22px;
  font-size:17px
}

.capabilities {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:55px;
  margin-top:57px
}

.feature-symbol {
  width:45px;
  height:45px;
  display:grid;
  place-items:center;
  font-size:30px;
  border-radius:11px;
  margin-bottom:24px;
  line-height:1
}

.symbol-blue {
  background:#e9f0ff;
  color:#315bdf
}

.symbol-peach {
  background:#f7e7db;
  color:#9b623b
}

.symbol-green {
  background:#e7efdf;
  color:#49643b
}

.capabilities h3 {
  font-size:23px;
  letter-spacing:-.8px
}

.capabilities p {
  font-size:15px;
  color:var(--muted);
  margin-top:15px
}

.feature-detail {
  font-size:11px;
  color:var(--ink);
  display:block;
  margin-top:21px
}

.process-section {
  padding-block:90px;
  background:var(--mist)
}

.process-layout {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:90px;
  align-items:center
}

.process-copy h2 {
  font-size:42px;
  max-width:440px
}

.process-copy>p:not(.section-kicker) {
  color:var(--muted);
  font-size:16px;
  margin-top:22px
}

.process-tabs {
  margin-top:32px;
  display:grid;
  gap:8px
}

.process-tabs button {
  text-align:left;
  display:flex;
  align-items:center;
  gap:18px;
  background:transparent;
  color:var(--ink);
  border:1px solid transparent;
  border-radius:7px;
  padding:16px;
  cursor:pointer;
  width:100%
}

.process-tabs button[aria-selected=true] {
  background:white;
  border-color:#dce5f5;
  box-shadow:0 4px 12px #28457505
}

.process-tabs button>span:first-child {
  font-size:12px;
  color:var(--blue)
}

.process-tabs strong {
  display:block;
  font-size:15px;
  font-weight:500
}

.process-tabs small {
  display:block;
  font-size:12px;
  color:var(--muted);
  margin-top:4px
}

.tab-arrow {
  margin-left:auto;
  color:var(--blue)
}

.process-preview {
  background:white;
  border:1px solid #d4dff2;
  border-radius:12px;
  box-shadow:0 12px 32px #315bdf07;
  overflow:hidden
}

.workspace-bar {
  display:flex;
  justify-content:space-between;
  align-items:center;
  border-bottom:1px solid var(--line);
  padding:18px 24px;
  font-size:10px;
  color:var(--muted)
}

.workspace-brand {
  font-family:Archivo;
  font-weight:600;
  font-size:12px;
  color:var(--ink)
}

.step-panel {
  padding:27px 32px;
  min-height:451px
}

.panel-breadcrumb {
  font-size:10px;
  color:var(--muted);
  margin-bottom:26px
}

.step-panel h3 {
  font-size:29px;
  margin-bottom:26px
}

.brief-field {
  padding:12px 0;
  border-bottom:1px solid #edf0f5
}

.brief-field span {
  display:block;
  font-size:10px;
  color:var(--muted)
}

.brief-field strong {
  display:block;
  font-size:13px;
  font-weight:500;
  margin-top:3px
}

.panel-message {
  background:#f1f5fc;
  padding:15px;
  display:flex;
  align-items:center;
  gap:14px;
  margin-top:25px;
  border-radius:5px;
  font-size:11px;
  color:var(--muted)
}

.panel-message>span {
  font-size:25px;
  color:var(--blue)
}

.panel-message strong {
  font-weight:500;
  color:var(--ink)
}

.panel-bottom {
  font-size:10px;
  margin-top:23px;
  display:flex;
  gap:8px;
  align-items:center;
  color:var(--muted)
}

.review-item {
  display:flex;
  gap:10px;
  padding:10px 0
}

.review-item>span {
  color:#518968
}

.review-item strong {
  font-size:13px;
  font-weight:500
}

.review-item p {
  font-size:11px;
  color:var(--muted)
}

.library-row {
  display:flex;
  justify-content:space-between;
  gap:15px;
  align-items:center;
  border-bottom:1px solid var(--line);
  padding:17px 0;
  font-size:12px
}

.library-row b {
  font-size:9px;
  background:var(--mist);
  color:var(--blue);
  padding:2px 6px;
  border-radius:3px;
  font-weight:500
}

.quality-section {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:110px;
  align-items:center
}

.quality-section>div:first-child>p:not(.section-kicker) {
  color:var(--muted);
  font-size:16px;
  max-width:380px;
  margin-block:24px
}

.quality-list article {
  display:flex;
  gap:24px;
  padding:27px 0;
  border-bottom:1px solid var(--line)
}

.quality-list article:first-child {
  padding-top:0
}

.quality-list article:last-child {
  border:0;
  padding-bottom:0
}

.quality-list article>span {
  font-size:27px;
  color:var(--blue);
  width:30px;
  flex-shrink:0
}

.quality-list h3 {
  font-size:21px;
  letter-spacing:-.6px
}

.quality-list p {
  font-size:15px;
  color:var(--muted);
  margin-top:10px
}

.services-section {
  background:#f7f9fc;
  padding-block:90px
}

.centered {
  text-align:center;
  margin-inline:auto
}

.centered>p:last-child {
  margin-inline:auto
}

.offer-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:25px;
  margin-top:47px;
  max-width:1000px;
  margin-inline:auto
}

.offer {
  padding:36px 42px;
  border:1px solid #dbe2ed;
  border-radius:12px;
  background:white
}

.offer-service {
  background:#eaf0ff;
  border-color:#cfdcf7
}

.offer-top {
  display:flex;
  align-items:center;
  gap:12px;
  font-size:12px;
  color:var(--muted);
  margin-bottom:27px
}

.offer-icon {
  font-size:24px;
  color:var(--blue)
}

.offer h3 {
  font-size:34px
}

.offer>p {
  color:var(--muted);
  font-size:15px;
  margin-top:20px
}

.offer ul {
  list-style:none;
  padding:0;
  margin:28px 0 32px;
  display:grid;
  gap:12px
}

.offer li {
  font-size:14px;
  display:flex;
  gap:11px
}

.offer li:before {
  content:'✓';
  color:#4f7560
}

.offer .button {
  width:100%
}

.offer p.offer-note {
  font-size:11px;
  text-align:center;
  margin-top:14px
}

.proof-header {
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:30px
}

.example-label {
  font-size:12px;
  color:var(--blue);
  line-height:1.7;
  padding-left:13px;
  border-left:2px solid #b0c1f2;
  flex-shrink:0
}

.example-label span {
  font-size:11px;
  color:var(--muted)
}

.metrics {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:30px;
  margin-top:48px;
  padding-block:28px 37px;
  border-bottom:1px solid var(--line)
}

.metrics strong {
  font-family:Archivo;
  font-size:64px;
  line-height:1.15;
  font-weight:500;
  letter-spacing:-3px
}

.metrics p {
  font-size:13px;
  color:var(--muted);
  margin-top:10px
}

.quote-layout {
  display:flex;
  gap:45px;
  align-items:start;
  max-width:880px;
  margin:56px auto 0
}

.quote-art {
  font-family:Georgia,serif;
  font-size:130px;
  line-height:.9;
  color:#9db4f1
}

.quote-layout blockquote {
  font-family:Archivo;
  font-size:31px;
  font-weight:400;
  line-height:1.4;
  letter-spacing:-.8px;
  margin:0
}

.quote-layout figcaption {
  display:flex;
  align-items:center;
  gap:13px;
  margin-top:25px;
  font-size:12px
}

.quote-avatar {
  width:37px;
  height:37px;
  border-radius:50%;
  background:#e9eefa;
  display:grid;
  place-items:center;
  font-size:16px
}

.quote-layout figcaption strong {
  display:block;
  font-weight:500
}

.quote-layout figcaption div>span {
  display:block;
  color:var(--muted);
  font-size:10px;
  margin-top:3px
}

.faq-section {
  border-top:1px solid var(--line);
  display:grid;
  grid-template-columns:1fr 1.65fr;
  gap:80px
}

.faq-section>div>p:not(.section-kicker) {
  font-size:15px;
  margin-top:23px;
  color:var(--muted)
}

.faq-list details {
  border-bottom:1px solid var(--line);
  padding:21px 0
}

.faq-list details:first-child {
  padding-top:0
}

.faq-list summary {
  font-size:16px;
  font-weight:500;
  cursor:pointer;
  list-style:none;
  display:flex;
  gap:24px;
  justify-content:space-between
}

.faq-list summary::-webkit-details-marker {
  display:none
}

.faq-list summary:after {
  content:'+';
  color:var(--blue);
  font-size:22px;
  line-height:1.2;
  font-weight:400
}

.faq-list details[open] summary:after {
  content:'−'
}

.faq-list details p {
  font-size:14px;
  color:var(--muted);
  padding-top:14px;
  max-width:550px
}

.contact-section {
  background:#e7efff;
  padding-block:90px
}

.contact-layout {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:100px;
  align-items:center
}

.contact-layout h2 {
  font-size:53px
}

.contact-layout>div>p:not(.section-kicker) {
  color:var(--muted);
  font-size:16px;
  margin-top:25px
}

.contact-signature {
  display:flex;
  gap:12px;
  align-items:center;
  margin-top:34px;
  font-size:13px
}

.founder-monogram {
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  border-radius:50%;
  background:#d0dff9;
  font-size:20px
}

.contact-signature strong,.contact-signature div>span {
  display:block
}

.contact-signature strong {
  font-weight:500
}

.contact-signature div>span {
  font-size:11px;
  color:var(--muted)
}

.contact-card {
  background:white;
  border:1px solid #d5e0f3;
  border-radius:12px;
  padding:32px
}

.contact-card h3 {
  font-size:25px
}

.contact-layout .contact-card>p {
  font-size:13px;
  margin-top:9px
}

.contact-card form {
  margin-top:22px
}

.contact-card label {
  display:block;
  font-size:12px;
  font-weight:500;
  margin:16px 0 6px
}

.contact-card label span {
  font-weight:400;
  color:var(--muted)
}

.contact-card input,.contact-card select,.contact-card textarea {
  display:block;
  width:100%;
  border:1px solid #cdd6e4;
  background:#fff;
  color:var(--ink);
  border-radius:5px;
  padding:10px 12px;
  font-size:13px;
  line-height:1.5
}

.contact-card textarea {
  resize:vertical;
  min-height:90px
}

.contact-card input::placeholder,.contact-card textarea::placeholder {
  color:#768296
}

.contact-submit {
  width:100%;
  margin-top:18px
}

.contact-help {
  font-size:11px;
  line-height:1.5;
  color:var(--muted);
  margin-top:12px
}

.form-status {
  font-size:12px;
  margin-top:9px;
  color:#37572c
}

.form-status:empty {
  display:none
}

.contact-direct {
  display:block;
  font-size:12px;
  font-weight:500;
  text-align:center;
  margin-top:17px
}

.site-footer {
  display:flex;
  align-items:center;
  gap:50px;
  padding-block:43px
}

.site-footer .wordmark {
  font-size:18px
}

.site-footer>div>p {
  font-size:11px;
  color:var(--muted);
  margin-top:8px
}

.site-footer nav {
  margin-left:auto;
  gap:25px
}

.site-footer nav a {
  font-size:12px
}

.copyright {
  font-size:10px;
  color:var(--muted)
}

[hidden] {
  display:none!important
}

@media(min-width:1500px) {
  .hero {
    gap:70px
  }
  h1 {
    font-size:67px
  }
}

@media(max-width:1100px) {
  .container {
    width:calc(100% - 64px)
  }
  .nav-row {
    gap:23px
  }
  .nav-row nav {
    gap:20px
  }
  .nav-actions {
    gap:18px
  }
  .wordmark {
    font-size:18px
  }
  .hero {
    gap:35px;
    padding-block:65px
  }
  .hero-visual {
    height:530px
  }
  .article-preview {
    left:26px;
    right:24px
  }
  .article-preview-body {
    padding:23px
  }
  .review-note {
    right:-10px
  }
  .workflow-strip ul {
    gap:18px
  }
  .workflow-strip li {
    font-size:16px
  }
  .workflow-strip li span {
    margin-left:4px
  }
  .process-layout,.quality-section,.contact-layout {
    gap:55px
  }
  .section {
    padding-block:85px
  }
  .capabilities {
    gap:30px
  }
  .offer {
    padding:30px
  }
  .site-footer {
    gap:30px
  }
  .site-footer nav {
    gap:15px
  }
  .proof-header {
    align-items:center
  }
  .process-tabs button {
    padding:13px 10px;
    gap:12px
  }
  .contact-layout h2 {
    font-size:46px
  }
}

@media(max-width:820px) {
  .nav-row nav {
    display:none
  }
  .nav-actions {
    margin-left:auto
  }
  .hero {
    gap:25px;
    grid-template-columns:1fr 1fr
  }
  h1 {
    font-size:43px
  }
  .hero-description {
    font-size:16px
  }
  .hero-actions {
    gap:15px
  }
  .hero-visual {
    height:500px
  }
  .topic-note {
    left:10px;
    right:10px;
    padding:10px
  }
  .topic-note strong {
    font-size:11px
  }
  .article-preview {
    left:15px;
    right:15px;
    top:155px
  }
  .article-preview-body {
    padding:18px
  }
  .article-preview h2 {
    font-size:23px
  }
  .review-note {
    top:326px;
    padding:9px 10px;
    right:-7px
  }
  .review-note strong {
    font-size:10px
  }
  .review-note div>span {
    font-size:8px
  }
  .preview-footer {
    padding:10px
  }
  .workflow-strip>.container {
    flex-direction:column;
    gap:18px;
    align-items:start
  }
  .workflow-strip p br {
    display:none
  }
  .workflow-strip p strong {
    margin-left:5px
  }
  .workflow-strip ul {
    justify-content:space-between;
    width:100%
  }
  .section-heading h2,h2 {
    font-size:38px
  }
  .capabilities {
    gap:24px
  }
  .capabilities h3 {
    font-size:20px
  }
  .capabilities p {
    font-size:14px
  }
  .process-layout {
    gap:35px
  }
  .process-copy h2 {
    font-size:33px
  }
  .process-tabs small {
    font-size:10px
  }
  .step-panel {
    padding:24px;
    min-height:440px
  }
  .workspace-bar {
    padding:16px
  }
  .step-panel h3 {
    font-size:26px
  }
  .process-preview .panel-message {
    padding:12px;
    gap:9px
  }
  .quality-section {
    gap:45px
  }
  .quality-list h3 {
    font-size:19px
  }
  .quality-list article {
    gap:16px
  }
  .offer {
    padding:25px
  }
  .offer h3 {
    font-size:29px
  }
  .offer>p {
    font-size:14px
  }
  .offer li {
    font-size:12px
  }
  .offer p.offer-note {
    font-size:10px
  }
  .proof-header {
    align-items:start;
    flex-direction:column;
    gap:24px
  }
  .metrics {
    gap:15px
  }
  .metrics strong {
    font-size:52px
  }
  .metrics p {
    font-size:11px
  }
  .faq-section {
    grid-template-columns:1fr 1.6fr;
    gap:35px
  }
  .contact-layout {
    gap:35px
  }
  .contact-card {
    padding:25px
  }
  .contact-layout h2 {
    font-size:40px
  }
  .site-footer {
    flex-wrap:wrap
  }
  .copyright {
    width:100%;
    margin-top:-20px
  }
}

@media(max-width:620px) {
  .container {
    width:calc(100% - 40px)
  }
  .site-header {
    height:77px
  }
  .wordmark {
    font-size:17px;
    gap:7px
  }
  .wordmark img {
    width:25px;
    height:22px
  }
  .nav-row {
    gap:10px
  }
  .nav-actions .sign-in {
    display:none
  }
  .button-small {
    font-size:12px;
    min-height:38px;
    padding:8px 12px;
    gap:8px
  }
  .hero {
    grid-template-columns:1fr;
    padding-block:45px 40px;
    gap:36px
  }
  .intro-label {
    font-size:12px;
    margin-bottom:21px
  }
  h1 {
    font-size:clamp(43px,11.4vw,64px);
    max-width:480px
  }
  .hero-description {
    max-width:430px;
    font-size:16px;
    margin-top:23px
  }
  .hero-actions {
    gap:19px;
    margin-top:25px
  }
  .hero-actions .button {
    font-size:13px;
    padding:13px 17px;
    gap:14px
  }
  .text-link {
    font-size:12px
  }
  .micro-copy {
    font-size:10px;
    margin-top:17px
  }
  .hero-visual {
    height:500px;
    max-width:450px;
    width:calc(100% - 8px);
    margin-inline:auto
  }
  .topic-note {
    left:23px;
    right:26px;
    padding:12px 14px
  }
  .topic-note strong {
    font-size:12px
  }
  .article-preview {
    left:32px;
    right:25px;
    top:155px
  }
  .article-preview-body {
    padding:20px 23px
  }
  .article-preview h2 {
    font-size:26px
  }
  .review-note {
    right:-7px;
    top:305px;
    padding:11px 14px
  }
  .review-note strong {
    font-size:11px
  }
  .review-note div>span {
    font-size:9px
  }
  .preview-footer {
    padding:10px 17px
  }
  .approval-note {
    bottom:30px
  }
  .workflow-strip>.container {
    padding-block:23px;
    gap:18px
  }
  .workflow-strip p {
    font-size:11px
  }
  .workflow-strip p br {
    display:block
  }
  .workflow-strip p strong {
    margin-left:0
  }
  .workflow-strip ul {
    gap:12px;
    flex-wrap:wrap;
    justify-content:start
  }
  .workflow-strip li {
    font-size:14px
  }
  .workflow-strip li span {
    font-size:13px
  }
  .section {
    padding-block:65px
  }
  .section-heading h2,h2 {
    font-size:34px
  }
  .section-kicker {
    font-size:12px;
    margin-bottom:15px
  }
  .section-heading>p:last-child {
    font-size:15px;
    margin-top:20px
  }
  .capabilities {
    grid-template-columns:1fr;
    gap:32px;
    margin-top:35px
  }
  .capabilities article {
    position:relative;
    padding-left:63px
  }
  .feature-symbol {
    position:absolute;
    left:0;
    top:0;
    width:41px;
    height:41px;
    font-size:26px
  }
  .capabilities h3 {
    font-size:23px
  }
  .capabilities p {
    font-size:14px;
    margin-top:10px
  }
  .feature-detail {
    margin-top:12px;
    font-size:10px
  }
  .process-section,.services-section,.contact-section {
    padding-block:60px
  }
  .process-layout {
    grid-template-columns:1fr;
    gap:30px
  }
  .process-copy h2 {
    font-size:34px
  }
  .process-tabs {
    margin-top:23px
  }
  .process-tabs button {
    padding:14px;
    gap:16px
  }
  .process-tabs strong {
    font-size:14px
  }
  .process-tabs small {
    font-size:11px
  }
  .process-preview {
    max-width:480px;
    width:100%;
    margin:auto
  }
  .step-panel {
    padding:26px;
    min-height:437px
  }
  .step-panel h3 {
    font-size:29px
  }
  .workspace-bar {
    padding:17px 24px
  }
  .quality-section {
    grid-template-columns:1fr;
    gap:34px
  }
  .quality-section>div:first-child>p:not(.section-kicker) {
    font-size:15px;
    margin-block:20px
  }
  .quality-list article {
    padding:23px 0;
    gap:18px
  }
  .quality-list h3 {
    font-size:21px
  }
  .quality-list p {
    font-size:14px
  }
  .offer-grid {
    grid-template-columns:1fr;
    margin-top:32px;
    gap:20px
  }
  .offer {
    padding:28px
  }
  .offer h3 {
    font-size:33px
  }
  .offer-top {
    margin-bottom:20px
  }
  .offer li {
    font-size:14px
  }
  .offer>p {
    font-size:15px
  }
  .offer p.offer-note {
    font-size:11px
  }
  .centered {
    text-align:left
  }
  .centered>p:last-child br {
    display:none
  }
  .metrics {
    grid-template-columns:1fr 1fr;
    gap:28px 20px;
    margin-top:25px;
    padding-top:15px
  }
  .metrics strong {
    font-size:53px
  }
  .metrics p {
    font-size:12px;
    max-width:150px
  }
  .quote-layout {
    gap:14px;
    margin-top:35px
  }
  .quote-art {
    font-size:78px
  }
  .quote-layout blockquote {
    font-size:24px
  }
  .quote-layout figcaption {
    align-items:start;
    font-size:11px
  }
  .quote-layout figcaption div>span {
    font-size:9px
  }
  .quote-avatar {
    flex-shrink:0;
    width:30px;
    height:30px;
    font-size:13px
  }
  .faq-section {
    grid-template-columns:1fr;
    gap:35px
  }
  .faq-section h2 br {
    display:none
  }
  .faq-section>div>p:not(.section-kicker) {
    margin-top:15px
  }
  .faq-list summary {
    font-size:15px
  }
  .faq-list details {
    padding-block:19px
  }
  .contact-layout {
    grid-template-columns:1fr;
    gap:35px
  }
  .contact-layout h2 {
    font-size:43px
  }
  .contact-layout h2 br:last-child {
    display:none
  }
  .contact-layout>div>p:not(.section-kicker) {
    font-size:15px;
    margin-top:20px
  }
  .contact-layout>div>p br {
    display:none
  }
  .contact-signature {
    margin-top:22px
  }
  .contact-card {
    padding:25px
  }
  .contact-layout .contact-card>p {
    font-size:13px;
    margin-top:10px
  }
  .site-footer {
    padding-block:35px;
    gap:25px
  }
  .site-footer>div {
    width:100%
  }
  .site-footer nav {
    margin:0;
    gap:25px
  }
  .copyright {
    margin:0
  }
  .scene-top {
    font-size:10px
  }
}

@media(prefers-reduced-motion:reduce) {
  :root {
    scroll-behavior:auto
  }
  * {
    transition:none!important
  }
}

/* Leave breathing room around the layered document. */
.hero-visual {
  height:545px
}

@media(max-width:1100px) {
  .hero-visual {
    height:550px
  }
}

@media(max-width:820px) {
  .hero-visual {
    height:530px
  }
}

@media(max-width:620px) {
  .hero-visual {
    height:540px
  }
}

/* Managed SEO: capabilities grouped by the work customers need done. */
.platform-section { background: #f8faff; }
.platform-heading { display: grid; grid-template-columns: 1.45fr 1fr; gap: 65px; align-items: end; }
.platform-heading > p { color: var(--muted); font-size: 16px; max-width: 400px; }
.platform-heading h2 { font-size: 42px; }
.platform-layout { display: grid; grid-template-columns: 340px minmax(0,1fr); gap: 35px; margin-top: 42px; align-items: start; }
.capability-tabs { margin: 0; gap: 0; }
.capability-tabs button { padding: 24px 17px; gap: 13px; border: 0; border-bottom: 1px solid #e3e9f3; border-radius: 0; background: transparent; }
.capability-tabs button[aria-selected=true] { border-color: #9eb5ee; box-shadow: inset 3px 0 var(--blue); background: #edf2fc; }
.capability-tabs button > .capability-icon:first-child { font-size: 26px; width: 27px; flex-shrink: 0; }
.capability-tabs small { font-size: 11px; }
.capability-workspace { background: white; border: 1px solid #d4dff2; border-radius: 12px; overflow: hidden; box-shadow: 0 12px 30px #315bdf06; }
.capability-panel { padding: 30px 35px; min-height: 392px; }
.capability-panel .panel-breadcrumb { margin-bottom: 15px; }
.capability-panel h3 { font-size: 32px; margin-bottom: 16px; }
.panel-description { font-size: 14px; color: var(--muted); max-width: 600px; }
.opportunity-table { margin-top: 25px; }
.opportunity-table > div { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 13px 0; border-bottom: 1px solid #edf0f5; font-size: 13px; }
.opportunity-table .opportunity-head { font-size: 10px; color: var(--muted); padding-top: 0; }
.opportunity-table small { display: block; font-size: 10px; color: var(--muted); margin-left: 15px; }
.opportunity-table b { font-size: 11px; font-weight: 500; background: var(--mist); color: var(--blue); padding: 3px 10px; border-radius: 4px; }
.signal-dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; margin-right: 9px; }
.signal-dot.green { background: #709067; }.signal-dot.peach { background: #c28d66; }.signal-dot.blue { background: #6589e7; }
.panel-footnote { font-size: 10px; color: var(--muted); margin-top: 23px; }
.connections { display: flex; align-items: center; gap: 35px; margin-top: 30px; font-size: 12px; }
.connections > span { color: var(--muted); }
.connections ul { list-style: none; display: flex; flex-wrap: wrap; gap: 30px; padding: 0; margin: 0; font-weight: 500; }
.creation-preview { display: grid; grid-template-columns: 1fr 1.2fr; gap: 25px; margin-top: 26px; }
.cover-sample { position: relative; overflow: hidden; min-height: 220px; border-radius: 8px; padding: 18px; background: #dae5ff; color: #233e80; }
.cover-sample > span { font-size: 9px; }
.cover-sample > strong { position: absolute; bottom: 18px; left: 18px; font-family: Archivo, sans-serif; font-size: 22px; line-height: 1.1; font-weight: 500; letter-spacing: -.7px; }
.cover-orbit { position: absolute; width: 115px; height: 110px; right: 7px; top: 29px; transform: rotate(-20deg); }
.cover-orbit i { position: absolute; width: 95px; height: 40px; border: 1px solid #7796df; border-radius: 50%; top: 20px; }
.cover-orbit i:nth-child(2) { transform: rotate(60deg); }.cover-orbit i:nth-child(3) { transform: rotate(120deg); }
.creation-details > div:not(.chart-sample) { display: flex; align-items: start; gap: 9px; margin-bottom: 12px; }
.creation-details > div > span { color: #518968; }
.creation-details strong { display: block; font-size: 12px; font-weight: 500; }
.creation-details small { display: block; font-size: 10px; color: var(--muted); }
.chart-sample { height: 55px; display: flex; align-items: end; gap: 6px; padding: 4px 0; }
.chart-sample i { width: 12px; height: 18px; background: #92afd6; border-radius: 3px 3px 0 0; }
.chart-sample i:nth-child(2) { height: 33px; }.chart-sample i:nth-child(3) { height: 27px; }.chart-sample i:nth-child(4) { height: 45px; }
.chart-sample > span { font-size: 10px; padding: 0 0 3px 9px; color: var(--muted) !important; }
.improvement-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 26px; }
.improvement-grid article { padding: 18px; background: #eef4e9; border-radius: 7px; }.improvement-grid article + article { background: #f8eee7; }
.improvement-label { font-size: 9px; color: var(--muted); }.improvement-grid h4 { font-family: Archivo,sans-serif; font-size: 17px; letter-spacing: -.6px; margin: 8px 0 14px; font-weight: 500; }
.improvement-grid ul { padding-left: 14px; margin: 0; font-size: 11px; color: var(--muted); display: grid; gap: 8px; }
.delivery-list { list-style: none; padding: 0; margin: 22px 0 0; display: grid; gap: 16px; }.delivery-list li { display: flex; gap: 14px; align-items: center; }.delivery-list li > span { background: var(--mist); border-radius: 50%; width: 28px; height: 28px; display: grid; place-items: center; color: var(--blue); font-size: 10px; flex-shrink: 0; }.delivery-list strong { display: block; font-size: 13px; font-weight: 500; }.delivery-list small { display: block; font-size: 11px; color: var(--muted); }
.managed-process { display: grid; grid-template-columns: 1fr 1fr; gap: 95px; align-items: center; }.managed-process > div > p:last-child { font-size: 16px; color: var(--muted); margin-top: 24px; max-width: 430px; }.managed-steps { list-style: none; padding: 0; margin: 0; display: grid; gap: 30px; }.managed-steps li { display: flex; gap: 22px; }.managed-steps li > span { color: var(--blue); font-size: 12px; padding-top: 3px; }.managed-steps h3 { font-size: 23px; }.managed-steps p { font-size: 14px; color: var(--muted); margin-top: 10px; }
.managed-offer { display: grid; grid-template-columns: 1fr 1.1fr; gap: 90px; align-items: center; }.managed-offer-intro > p:not(.section-kicker) { color: var(--muted); font-size: 16px; margin: 24px 0; max-width: 400px; }.managed-offer-intro p.offer-note { font-size: 11px; margin-top: 13px; }.service-scope { background: white; padding: 35px; border: 1px solid var(--line); border-radius: 12px; }.scope-heading { display: flex; gap: 13px; align-items: center; }.scope-heading h3 { font-size: 26px; }.service-scope ul { list-style: none; padding: 0; margin: 20px 0; }.service-scope li { padding: 15px 0; border-bottom: 1px solid #e8edf4; }.service-scope strong { display: block; font-size: 15px; font-weight: 500; }.service-scope li span { display: block; font-size: 12px; color: var(--muted); margin-top: 4px; }.scope-note { background: var(--mist); padding: 17px; border-radius: 6px; }.scope-note p { font-size: 12px; color: var(--muted); margin-top: 6px; }
.claim-note { display: block; color: #876037; font-size: 10px; margin-top: 5px; }
@media(max-width:1100px) { .platform-heading { gap: 40px; }.platform-heading h2 { font-size: 36px; }.platform-layout { grid-template-columns: 300px minmax(0,1fr); gap: 22px; }.capability-tabs button { padding: 22px 13px; }.capability-panel { padding: 26px; }.managed-process,.managed-offer { gap: 50px; }.connections { gap: 20px; }.connections ul { gap: 20px; } }
@media(max-width:820px) { .platform-heading { grid-template-columns: 1fr; gap: 24px; }.platform-heading > p { max-width: 550px; }.platform-layout { grid-template-columns: 1fr; margin-top: 30px; }.capability-tabs { grid-template-columns: 1fr 1fr; gap: 10px; }.capability-tabs button { padding: 18px 14px; }.capability-tabs strong { font-size: 14px; }.capability-tabs small { font-size: 10px; }.capability-panel { min-height: 390px; }.connections { align-items: start; flex-direction: column; gap: 10px; }.connections ul { gap: 12px 25px; }.managed-process,.managed-offer { gap: 35px; }.service-scope { padding: 26px; } }
@media(max-width:620px) { .platform-heading h2 { font-size: 33px; }.platform-heading > p { font-size: 15px; }.capability-tabs { grid-template-columns: 1fr; gap: 8px; }.capability-tabs button { padding: 15px; }.capability-tabs button > .capability-icon:first-child { width: 28px; font-size: 26px; }.capability-tabs small { font-size: 11px; }.capability-panel { padding: 23px 20px; min-height: 0; }.capability-panel h3 { font-size: 28px; }.panel-description { font-size: 13px; }.opportunity-table > div { font-size: 12px; gap: 10px; }.opportunity-table small { font-size: 9px; }.panel-footnote { font-size: 9px; }.creation-preview { gap: 14px; grid-template-columns: 1fr 1fr; }.cover-sample { padding: 13px; min-height: 235px; }.cover-sample > strong { font-size: 19px; left: 13px; }.creation-details strong { font-size: 11px; }.creation-details small { font-size: 9px; }.chart-sample > span { font-size: 8px; padding-left: 2px; }.improvement-grid { grid-template-columns: 1fr; gap: 12px; }.improvement-grid article { padding: 17px; }.managed-process,.managed-offer { grid-template-columns: 1fr; gap: 33px; }.managed-process > div > p:last-child { font-size: 15px; margin-top: 20px; }.managed-steps { gap: 25px; }.managed-steps li { gap: 17px; }.managed-offer-intro h2 br:last-child { display: none; }.managed-offer-intro > p:not(.section-kicker) { font-size: 15px; }.service-scope { padding: 24px; }.connections { font-size: 11px; }.contact-layout h2 { font-size: 43px; } }

/* Quieter hierarchy, recognisable connections and an editorial closing image. */
.hero-description { max-width: 430px; }
.platform-heading { grid-template-columns: 1.2fr 1fr; }
.workspace-indicator { display: flex; gap: 5px; }
.workspace-indicator i { width: 5px; height: 5px; border-radius: 50%; background: #b9c6dc; }
.integrations { margin-top: 52px; padding: 35px 40px 26px; background: var(--ink); color: #fff; border-radius: 8px; }
.integration-intro h3 { font-size: 25px; font-weight: 500; letter-spacing: -.03em; }
.integration-logos { display: grid; grid-template-columns: 1.35fr 1fr 1.1fr 1fr; align-items: center; gap: 35px; margin: 36px 0; padding: 0; list-style: none; }
.integration-logos li { display: flex; align-items: center; gap: 12px; font-family: Archivo, sans-serif; font-size: 20px; font-weight: 500; line-height: 1.15; }
.integration-logos li:first-child { font-size: 15px; }
.integration-logos img { flex-shrink: 0; object-fit: contain; filter: invert(1); }
.integration-logos .ahrefs-logo img { filter: none; width: 97px; height: 28px; }
.wider-stack { border-top: 1px solid #ffffff26; padding-top: 22px; display: flex; justify-content: space-between; align-items: center; gap: 30px; }
.wider-stack p { color: #b9c6d9; font-size: 12px; max-width: 250px; }
.wider-stack p a { color: #fff; white-space: nowrap; }
.wider-stack ul { display: flex; flex-wrap: wrap; gap: 28px; list-style: none; padding: 0; margin: 0; }
.wider-stack li { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.wider-stack img { object-fit: contain; filter: invert(1); }
.contact-layout { gap: 65px; }
.contact-story { min-width: 0; }
.contact-card { box-shadow: 0 12px 40px #2c4d8b06; }
.contact-layout h2 { font-size: clamp(43px, 4.4vw, 61px); }
.service-scope ul { margin-bottom: 0; }
.service-scope li:last-child { border-bottom: 0; }
@media (max-width: 820px) {
  .platform-heading { grid-template-columns: 1fr; }
  .integrations { padding: 30px; }
  .integration-logos { grid-template-columns: 1fr 1fr; gap: 28px; }
  .wider-stack { align-items: start; flex-direction: column; gap: 20px; }
  .wider-stack p { max-width: none; }
  .contact-layout { gap: 35px; }
}
@media (max-width: 620px) {
  .integrations { padding: 27px 22px; margin-top: 30px; }
  .integration-intro h3 { font-size: 24px; max-width: 240px; }
  .integration-logos { gap: 26px 16px; margin-block: 29px; }
  .integration-logos li { font-size: 17px; gap: 8px; }
  .integration-logos li:first-child { font-size: 12px; }
  .integration-logos img { max-width: 25px; }
  .integration-logos .ahrefs-logo img { max-width: none; width: 86px; height: 25px; }
  .wider-stack ul { gap: 18px; }
  .wider-stack li { font-size: 12px; }
  .wider-stack img { width: 21px; height: 21px; }
  .contact-layout { gap: 15px; }
}

/* Shared 24px line icons keep controls independent of font rendering. */
.icon { display: inline-block; width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; vertical-align: middle; }
.button > span, .tab-arrow { display: inline-flex; align-items: center; }
.button .icon { width: 20px; height: 20px; }
.text-link .icon, .contact-direct .icon, .faq-section a .icon { width: 18px; height: 18px; }
.play-icon .icon { width: 15px; height: 15px; }
.capability-tabs button > .capability-icon:first-child { display: grid; place-items: center; width: 28px; }
.capability-icon .icon { width: 25px; height: 25px; }
.tab-arrow .icon { width: 17px; height: 17px; }
.quality-list article > span { display: inline-flex; align-items: flex-start; padding-top: 1px; }
.quality-list .icon, .note-icon .icon, .offer-icon .icon { width: 26px; height: 26px; }
.source-note .icon { width: 21px; height: 21px; }
.check-circle .icon { width: 20px; height: 20px; }
.creation-details .icon { width: 16px; height: 16px; }

/* One edge-to-edge landscape: top blend only, footer sits on the artwork. */
.contact-section { padding-bottom: 0; }
.contact-layout { align-items: start; }
.contact-story { padding-top: 28px; }
.closing-landscape { position: relative; isolation: isolate; background: #e7efff; }
.closing-illustration { display: block; width: 100%; height: clamp(540px, 59vw, 1000px); object-fit: cover; object-position: center bottom; margin: 0; mask-image: linear-gradient(to bottom, transparent, #000 24%); }
.closing-landscape .site-footer { position: absolute; z-index: 1; bottom: 0; left: 0; right: 0; padding-block: 38px; border-top: 1px solid #18263826; }
.closing-landscape .site-footer > div > p, .closing-landscape .copyright { color: #34465a; }
@media (max-width: 820px) {
  .contact-story { padding-top: 16px; }
  .closing-landscape .site-footer { gap: 25px; }
  .closing-landscape .copyright { margin: 0; }
}
@media (max-width: 620px) {
  .contact-story { padding-top: 0; }
  .contact-layout { gap: 30px; }
  .closing-illustration { height: 540px; object-position: 52% bottom; }
  .closing-landscape .site-footer { padding-block: 25px; gap: 20px; }
}

.contact-security { margin-top: 18px; min-height: 65px; }
.contact-honeypot { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.contact-submit:disabled { opacity: .55; cursor: not-allowed; }
.form-status[data-state="error"] { color: #a32f2f; }
.form-status:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
