:root {
  --ink: #111827;
  --text: #334155;
  --muted: #667085;
  --line: #dbe3ee;
  --line-dark: #b9c3d1;
  --bg: #f6f8fb;
  --paper: #ffffff;
  --dark: #111827;
  --green: #128c7e;
  --green-dark: #0b6f64;
  --blue: #315f9f;
  --amber: #95620f;
  --shadow: 0 20px 55px rgba(17, 24, 39, .12);
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  line-height: 1.55;
  letter-spacing: 0;
}

img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, p { margin-top: 0; }

.container {
  width: min(1160px, calc(100% - 44px));
  margin: 0 auto;
}

.narrow { max-width: 900px; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 30;
  border-bottom: 1px solid rgba(219, 227, 238, .92);
  background: rgba(255, 255, 255, .94);
  backdrop-filter: blur(14px);
}

.nav {
  min-height: 70px;
  display: flex;
  align-items: center;
  gap: 24px;
  position: relative;
}

.brand {
  display: flex;
  align-items: center;
  gap: 11px;
  font-weight: 850;
  white-space: nowrap;
  flex: 1 1 0;
  min-width: 0;
}

.brand img {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  object-fit: cover;
}

.brand img.brand-logo-wide {
  width: 156px;
  height: 42px;
  border-radius: 0;
  object-fit: contain;
}

.nav-links,
.nav-actions,
.action-row {
  display: flex;
  align-items: center;
  gap: 12px;
}

.nav-links {
  gap: 22px;
  color: var(--text);
  font-size: 14px;
  font-weight: 650;
  flex: 0 0 auto;
}

.nav-actions {
  flex: 1 1 0;
  min-width: 0;
  justify-content: flex-end;
  margin-right: 7rem;
}

.nav-links .language-switch {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}

.nav-links a:hover,
.footer a:hover {
  color: var(--green-dark);
}

.button {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 17px;
  border: 1px solid var(--line-dark);
  border-radius: 8px;
  color: var(--ink);
  background: #fff;
  font-size: 14px;
  font-weight: 820;
  line-height: 1;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease;
}

.button svg {
  width: 17px;
  height: 17px;
  fill: currentColor;
  flex: 0 0 auto;
}

.button:hover {
  transform: translateY(-1px);
  border-color: #8f9bad;
  box-shadow: 0 12px 24px rgba(17, 24, 39, .12);
}

.button.primary {
  border-color: var(--green);
  color: #fff;
  background: var(--green);
}

.button.primary:hover {
  border-color: var(--green-dark);
  background: var(--green-dark);
}

.button.ghost { background: #f8fafc; }
.button.large { min-height: 48px; padding-inline: 20px; }
.button.dark-outline { border-color: rgba(255, 255, 255, .34); color: #fff; background: transparent; }

.hero {
  position: relative;
  overflow: hidden;
  padding: 78px 0 82px;
  border-bottom: 1px solid var(--line);
  background:
    radial-gradient(circle at 82% 18%, rgba(18, 140, 126, .2), transparent 31%),
    radial-gradient(circle at 6% 12%, rgba(49, 95, 159, .14), transparent 28%),
    linear-gradient(135deg, #f9fcfd 0%, #eef7f4 45%, #f4f7fb 100%);
}

.hero::before {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 48%;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(18, 140, 126, .1) 1px, transparent 1px),
    linear-gradient(0deg, rgba(49, 95, 159, .08) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: linear-gradient(transparent, #000);
}

.hero-grid {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, .94fr) minmax(480px, 1.06fr);
  gap: 44px;
  align-items: center;
}

.kicker {
  margin-bottom: 12px;
  color: var(--green-dark);
  font-size: 12px;
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.hero-kicker {
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  padding: 0 16px;
  border: 1px solid rgba(18, 140, 126, .22);
  border-radius: 999px;
  background: rgba(255, 255, 255, .72);
  box-shadow: 0 12px 28px rgba(17, 24, 39, .06);
  font-size: 16px;
  letter-spacing: 0;
  text-transform: none;
}

h1 {
  margin-bottom: 22px;
  font-size: clamp(44px, 5vw, 68px);
  line-height: 1.02;
  letter-spacing: 0;
}

.home-page .hero h1 { font-size: clamp(44px, 4.4vw, 60px); }

.lead {
  margin-bottom: 28px;
  color: var(--text);
  font-size: 20px;
}

.support-note,
.section-heading p,
.pain-grid p,
.solution-map p,
.timeline p,
.trial-panel p,
.resource-card p,
.faq-list p,
.plan-card p,
.account-card p,
.usage-box p,
.footer p {
  color: var(--muted);
}

.support-note {
  margin: 18px 0 0;
  font-size: 14px;
}

.hero-showcase {
  position: relative;
  min-height: 510px;
  display: grid;
  place-items: center;
  margin-right: -14px;
}

.hero-ambient {
  position: absolute;
  inset: 8% 4% 4% 10%;
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .76), rgba(255, 255, 255, .28)),
    radial-gradient(circle at 18% 26%, rgba(18, 140, 126, .25), transparent 30%),
    radial-gradient(circle at 84% 72%, rgba(49, 95, 159, .18), transparent 30%);
  border: 1px solid rgba(255, 255, 255, .68);
  box-shadow: var(--shadow);
  transform: rotate(-2deg);
}

.hero-visual {
  position: relative;
  z-index: 1;
  width: min(720px, 104%);
  margin: 0;
  border: 1px solid rgba(185, 195, 209, .75);
  border-radius: 24px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 34px 90px rgba(17, 24, 39, .18);
  transform: rotate(.8deg);
}

.hero-visual img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.hero-chip {
  position: absolute;
  z-index: 2;
  min-width: 128px;
  padding: 13px 17px;
  border: 1px solid rgba(255, 255, 255, .82);
  border-radius: 8px;
  color: var(--ink);
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 22px 44px rgba(17, 24, 39, .2), 0 4px 12px rgba(18, 140, 126, .12);
  font-size: 15px;
  font-weight: 850;
  text-align: center;
  backdrop-filter: blur(10px);
}

.hero-chip.corner::before {
  content: "";
  width: 8px;
  height: 8px;
  display: inline-block;
  margin-right: 8px;
  border-radius: 999px;
  background: var(--green);
  box-shadow: 0 0 0 4px rgba(18, 140, 126, .12);
  vertical-align: 1px;
}

.hero-chip.top-left {
  top: 4%;
  left: 4%;
  transform: rotate(-2deg);
}

.hero-chip.top-right {
  top: 3%;
  right: -2%;
  transform: rotate(2deg);
}

.hero-chip.bottom-left {
  left: 5%;
  bottom: 4%;
  transform: rotate(2deg);
}

.hero-chip.bottom-right {
  right: -2%;
  bottom: 5%;
  transform: rotate(-2deg);
}

.section {
  padding: 86px 0;
  border-bottom: 1px solid var(--line);
}

.section.muted { background: var(--bg); }
.section.dark { color: #fff; background: var(--dark); }

.section-heading {
  max-width: 780px;
  margin-bottom: 36px;
}

.section-heading.compact { max-width: 700px; }

.section-media-heading {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(360px, .78fr);
  gap: 34px;
  align-items: center;
  margin-bottom: 38px;
}

.section-media-heading .section-heading {
  margin-bottom: 0;
}

.section-visual {
  position: relative;
  overflow: hidden;
  margin: 0;
  border: 1px solid rgba(18, 140, 126, .16);
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 24px 58px rgba(17, 24, 39, .12);
}

.section-visual::after,
.workflow-art::after,
.faq-art::after,
.trial-media::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .08), transparent 42%),
    radial-gradient(circle at 18% 18%, rgba(18, 140, 126, .1), transparent 28%);
}

.section-visual img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}

.pain-section {
  overflow: hidden;
  background:
    radial-gradient(circle at 92% 12%, rgba(18, 140, 126, .12), transparent 28%),
    linear-gradient(180deg, #fff, #fbfefd 58%, #f7fafc);
}

.pain-section .section-media-heading {
  padding: 26px;
  border: 1px solid rgba(18, 140, 126, .14);
  border-radius: 30px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .94), rgba(242, 252, 249, .78)),
    radial-gradient(circle at 88% 12%, rgba(18, 140, 126, .12), transparent 30%);
  box-shadow: 0 24px 60px rgba(15, 118, 110, .09);
}

.pain-visual {
  align-self: stretch;
  min-height: 265px;
  border-radius: 22px;
  box-shadow: none;
  transform: none;
}

.pain-visual img {
  height: 100%;
  aspect-ratio: auto;
  object-position: center;
}

.solution-section {
  overflow: hidden;
}

.solution-heading {
  grid-template-columns: minmax(0, .85fr) minmax(360px, .86fr);
  padding: 24px;
  border: 1px solid rgba(49, 95, 159, .12);
  border-radius: 30px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .92), rgba(245, 249, 255, .84)),
    radial-gradient(circle at 92% 20%, rgba(49, 95, 159, .12), transparent 28%);
  box-shadow: 0 22px 58px rgba(49, 95, 159, .08);
}

.solution-visual {
  border-color: rgba(49, 95, 159, .18);
  border-radius: 22px;
  box-shadow: none;
  transform: none;
}

.solution-visual img {
  aspect-ratio: 16 / 7.4;
  object-position: center;
}

h2 {
  margin-bottom: 14px;
  font-size: clamp(30px, 4vw, 50px);
  line-height: 1.08;
}

h3 { margin-bottom: 9px; line-height: 1.2; }

.pain-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.pain-grid article,
.solution-map article,
.timeline article,
.plan-card,
.account-card,
.usage-box,
.resource-card,
details {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.pain-grid article {
  position: relative;
  overflow: hidden;
  min-height: 260px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  box-shadow: 0 12px 28px rgba(17, 24, 39, .05);
}

.pain-grid article::after {
  content: "";
  position: absolute;
  right: -34px;
  top: -34px;
  width: 108px;
  height: 108px;
  border-radius: 999px;
  background: rgba(18, 140, 126, .08);
}

.pain-grid span {
  width: 42px;
  height: 34px;
  display: grid;
  place-items: center;
  margin-bottom: 32px;
  border-radius: 8px;
  color: var(--green-dark);
  background: linear-gradient(135deg, #e5f6f2, #f5fbfa);
  font-weight: 900;
}

.pain-grid p { margin-top: auto; margin-bottom: 0; }

.solution-map {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.solution-map article {
  min-height: 230px;
  padding: 26px;
  box-shadow: 0 12px 28px rgba(17, 24, 39, .05);
}

.solution-index {
  display: inline-flex;
  margin-bottom: 18px;
  padding: 6px 10px;
  border-radius: 999px;
  color: var(--green-dark);
  background: #e5f6f2;
  font-size: 12px;
  font-weight: 850;
  text-transform: uppercase;
}

.workflow-section {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 9% 22%, rgba(18, 140, 126, .16), transparent 30%),
    radial-gradient(circle at 90% 18%, rgba(49, 95, 159, .14), transparent 28%),
    linear-gradient(135deg, #f7fffc 0%, #eef7ff 64%, #fff7e8 100%);
}

.workflow-section::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(18, 140, 126, .06) 1px, transparent 1px),
    linear-gradient(0deg, rgba(49, 95, 159, .06) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(90deg, rgba(0, 0, 0, .1), rgba(0, 0, 0, .42), rgba(0, 0, 0, .08));
}

.workflow-layout {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 34px;
}

.workflow-intro {
  max-width: 880px;
  margin: 0 auto;
  text-align: center;
}

.workflow-intro h2 {
  font-size: clamp(32px, 3.4vw, 48px);
  line-height: 1.12;
}

.workflow-intro p {
  max-width: 720px;
  margin: 14px auto 0;
  color: var(--muted);
  font-size: 18px;
}

.workflow-art {
  position: relative;
  overflow: hidden;
  width: 100%;
  margin: 0;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 18px;
  background: rgba(255, 255, 255, .08);
  box-shadow: 0 18px 42px rgba(0, 0, 0, .18);
  z-index: 2;
}

.workflow-art img {
  width: 100%;
  aspect-ratio: 16 / 8.4;
  object-fit: cover;
  object-position: center;
}

.workflow-board {
  position: relative;
  display: grid;
  grid-template-columns: minmax(360px, .88fr) minmax(0, 1.12fr);
  gap: 24px;
  align-items: stretch;
  padding: 20px;
  border: 1px solid rgba(18, 140, 126, .18);
  border-radius: 28px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .82), rgba(246, 255, 252, .72)),
    rgba(255, 255, 255, .68);
  box-shadow: 0 28px 70px rgba(15, 118, 110, .14);
  backdrop-filter: blur(16px);
}

.workflow-console {
  position: relative;
  overflow: hidden;
  min-height: 100%;
  display: grid;
  align-content: start;
  gap: 18px;
  padding: 24px;
  border-radius: 22px;
  color: #fff;
  background:
    radial-gradient(circle at 84% 12%, rgba(56, 189, 248, .3), transparent 32%),
    radial-gradient(circle at 12% 86%, rgba(16, 185, 129, .24), transparent 28%),
    linear-gradient(145deg, #102033, #123e67);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 20px 44px rgba(16, 32, 51, .2);
}

.workflow-console::after {
  content: "";
  position: absolute;
  right: -70px;
  bottom: -70px;
  width: 220px;
  height: 220px;
  border-radius: 999px;
  border: 34px solid rgba(255, 255, 255, .06);
}

.workflow-console-top {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #cbd5e1;
  font-size: 13px;
  font-weight: 850;
}

.workflow-console-top i {
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: #ef4444;
}

.workflow-console-top i:nth-child(2) { background: #f59e0b; }
.workflow-console-top i:nth-child(3) { background: #22c55e; }
.workflow-console-top span { margin-left: 6px; }

.workflow-progress {
  position: relative;
  z-index: 1;
  display: block;
  margin-top: 12px;
}

.workflow-progress strong {
  display: block;
  max-width: 330px;
  font-size: 28px;
  line-height: 1.12;
}

.workflow-progress span {
  color: #a9c5d8;
  font-size: 13px;
}

.workflow-console-copy {
  position: relative;
  z-index: 1;
  max-width: 420px;
  margin: 0;
  color: #cbd5e1;
  font-size: 15px;
  line-height: 1.65;
}

.workflow-console-list {
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 16px;
  background: rgba(255, 255, 255, .08);
}

.workflow-console-list {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 10px;
  padding: 14px;
}

.workflow-console-list div {
  display: flex;
  gap: 10px;
  align-items: center;
  color: #e5eef7;
  font-size: 14px;
  font-weight: 760;
}

.workflow-console-list span {
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: #25d366;
  box-shadow: 0 0 0 4px rgba(37, 211, 102, .14);
}

.timeline {
  position: relative;
  display: grid;
  gap: 12px;
}

.workflow-steps {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.timeline::before {
  content: "";
  position: absolute;
  top: 28px;
  bottom: 28px;
  left: 24px;
  width: 2px;
  background: linear-gradient(180deg, rgba(18, 140, 126, .15), var(--green), rgba(49, 95, 159, .18));
}

.timeline article {
  position: relative;
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 14px;
  padding: 17px 18px;
  border-color: rgba(18, 140, 126, .18);
  border-radius: 16px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .96), rgba(248, 255, 252, .92));
  box-shadow: 0 12px 28px rgba(15, 118, 110, .07);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.timeline article:hover {
  transform: translateX(4px);
  border-color: rgba(18, 140, 126, .34);
  box-shadow: 0 24px 48px rgba(15, 118, 110, .14);
}

.timeline span {
  position: relative;
  z-index: 1;
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  color: #fff;
  background: linear-gradient(135deg, var(--green-dark), var(--green), #2ba7de);
  box-shadow: 0 14px 28px rgba(18, 140, 126, .2);
  font-weight: 900;
}

.timeline h3 { margin-bottom: 4px; }
.timeline p {
  margin-bottom: 0;
  font-size: 15px;
}
.timeline a {
  color: var(--green-dark);
  font-weight: 850;
  text-decoration: none;
}

.timeline a:hover { text-decoration: underline; }

.trial-panel {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(430px, 1.1fr);
  gap: 34px;
  align-items: center;
  padding: 22px;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 28px;
  background:
    radial-gradient(circle at 12% 12%, rgba(117, 214, 202, .18), transparent 32%),
    linear-gradient(135deg, rgba(255, 255, 255, .05), rgba(255, 255, 255, .02));
  box-shadow: 0 28px 80px rgba(0, 0, 0, .22);
}

.dark .kicker { color: #75d6ca; }
.dark h2 { color: #fff; }
.trial-panel p { color: #cbd5e1; }

.trial-copy {
  padding: 18px 0 18px 12px;
}

.trial-copy .action-row {
  margin-top: 26px;
}

.trial-media {
  position: relative;
  overflow: hidden;
  width: min(660px, 100%);
  justify-self: end;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 24px;
  background: rgba(255, 255, 255, .06);
  box-shadow: 0 22px 54px rgba(0, 0, 0, .28);
}

.trial-media img {
  width: 100%;
  aspect-ratio: 16 / 8.6;
  object-fit: cover;
  object-position: center;
  opacity: .92;
}

.check-list {
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 12px;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px 10px;
  margin: 0;
  padding: 11px 12px;
  list-style: none;
  background:
    linear-gradient(180deg, rgba(15, 23, 42, .05), rgba(15, 23, 42, .26)),
    rgba(15, 23, 42, .48);
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 18px;
  backdrop-filter: blur(12px);
}

.check-list li {
  position: relative;
  padding-left: 20px;
  color: #e5e7eb;
  font-size: 12px;
  font-weight: 720;
}

.check-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 6px;
  width: 12px;
  height: 12px;
  border-radius: 4px;
  background: #75d6ca;
}

.resource-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 28px;
  align-items: center;
  padding: 30px;
}

.faq-layout {
  display: grid;
  grid-template-columns: minmax(340px, .82fr) minmax(0, 1.18fr);
  gap: 48px;
  align-items: start;
}

.faq-art {
  position: relative;
  overflow: hidden;
  max-width: 430px;
  margin: 24px 0 0;
  border: 1px solid rgba(18, 140, 126, .16);
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 22px 52px rgba(17, 24, 39, .11);
}

.faq-art img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.faq-list { display: grid; gap: 10px; }

summary {
  cursor: pointer;
  padding: 19px 21px;
  font-weight: 850;
  list-style: none;
}

summary::-webkit-details-marker { display: none; }

details p {
  margin: 0;
  padding: 0 21px 20px;
}

.sub-hero {
  padding: 70px 0 54px;
  background:
    radial-gradient(circle at 82% 18%, rgba(18, 140, 126, .14), transparent 30%),
    #f8fafc;
  border-bottom: 1px solid var(--line);
}

.sub-hero h1 { font-size: clamp(42px, 5vw, 64px); }

.pricing-hero {
  overflow: hidden;
  padding: 56px 0 44px;
  background:
    radial-gradient(circle at 18% 16%, rgba(18, 140, 126, .18), transparent 30%),
    radial-gradient(circle at 88% 24%, rgba(49, 95, 159, .16), transparent 28%),
    linear-gradient(135deg, #f7fffc 0%, #eef7ff 62%, #fff7e8 100%);
}

.pricing-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, .68fr);
  gap: 34px;
  align-items: center;
}

.pricing-visual {
  position: relative;
  overflow: hidden;
  margin: 0;
  border: 1px solid rgba(18, 140, 126, .16);
  border-radius: 26px;
  background: rgba(255, 255, 255, .8);
  box-shadow: 0 28px 70px rgba(15, 118, 110, .12);
  max-width: 520px;
  justify-self: end;
}

.pricing-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .12), transparent 46%),
    radial-gradient(circle at 86% 20%, rgba(18, 140, 126, .12), transparent 28%);
}

.pricing-visual img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.pricing-hero .pricing-title {
  font-size: clamp(38px, 4.3vw, 58px);
}

.pricing-title {
  position: relative;
  display: inline-block;
  max-width: 920px;
  padding-bottom: 16px;
}

.pricing-title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: min(360px, 58%);
  height: 8px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--green), #38bdf8, #f5b84b);
  box-shadow: 0 12px 28px rgba(18, 140, 126, .18);
}

.pricing-section {
  background:
    radial-gradient(circle at 12% 10%, rgba(18, 140, 126, .1), transparent 28%),
    linear-gradient(180deg, #fff, #f7fafc);
}

.plan-grid,
.account-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.plan-card,
.account-card {
  display: flex;
  flex-direction: column;
  min-height: 430px;
  padding: 26px;
}

.plan-card.highlighted {
  border-color: rgba(18, 140, 126, .45);
  box-shadow: var(--shadow);
}

.plan-label,
.account-card span {
  display: inline-flex;
  align-self: flex-start;
  margin-bottom: 18px;
  padding: 6px 10px;
  border-radius: 999px;
  color: var(--green-dark);
  background: #e5f6f2;
  font-size: 12px;
  font-weight: 850;
  text-transform: uppercase;
}

.plan-card h2,
.account-card h3 { font-size: 27px; }

.plan-card ul,
.account-card ul {
  display: grid;
  gap: 9px;
  margin: 20px 0 24px;
  padding-left: 18px;
  color: var(--text);
}

.plan-card .button,
.account-card .button { margin-top: auto; }

.pricing-plans {
  display: grid;
  grid-template-columns: minmax(250px, .82fr) minmax(420px, 1.36fr) minmax(250px, .86fr);
  gap: 18px;
  align-items: stretch;
}

.pricing-plans .plan-card {
  position: relative;
  overflow: hidden;
  border-color: rgba(18, 140, 126, .15);
  border-radius: 22px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(248, 253, 251, .94));
  box-shadow: 0 18px 48px rgba(17, 24, 39, .08);
}

.pricing-plans .plan-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 5px;
  background: linear-gradient(90deg, rgba(18, 140, 126, .92), rgba(56, 189, 248, .68), rgba(245, 184, 75, .75));
}

.pricing-plans .plan-card::after {
  content: "";
  position: absolute;
  right: -42px;
  top: -42px;
  width: 132px;
  height: 132px;
  border-radius: 999px;
  background: rgba(18, 140, 126, .08);
  pointer-events: none;
}

.pricing-plans .highlighted {
  border-color: rgba(18, 140, 126, .36);
  background:
    radial-gradient(circle at 92% 6%, rgba(18, 140, 126, .14), transparent 25%),
    linear-gradient(180deg, #ffffff, #f6fffb);
  box-shadow: 0 28px 70px rgba(15, 118, 110, .14);
}

.trial-plan .button,
.custom-plan .button,
.configurable-plan .button,
.trial-plan h2,
.custom-plan h2,
.configurable-plan h2,
.trial-plan p,
.custom-plan p,
.configurable-plan p {
  position: relative;
  z-index: 1;
}

.plan-metrics {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 12px;
  margin: 22px 0 28px;
  padding: 0;
  list-style: none;
}

.plan-metrics li {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 13px 14px;
  border: 1px solid rgba(18, 140, 126, .14);
  border-radius: 14px;
  background: rgba(255, 255, 255, .75);
}

.plan-metrics span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 720;
}

.plan-metrics b {
  color: var(--green-dark);
}

.configurator {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 18px;
  margin: 22px 0 24px;
  padding: 18px;
  border: 1px solid rgba(18, 140, 126, .14);
  border-radius: 20px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .92), rgba(239, 252, 248, .78));
}

.config-row {
  display: grid;
  gap: 10px;
}

.config-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
}

.config-head label {
  color: var(--ink);
  font-weight: 850;
}

.config-head strong {
  color: var(--green-dark);
  font-size: 15px;
}

.duration-options {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}

.duration-option {
  min-height: 42px;
  padding: 0 10px;
  border: 1px solid rgba(18, 140, 126, .16);
  border-radius: 12px;
  color: var(--text);
  background: rgba(255, 255, 255, .82);
  font: inherit;
  font-size: 13px;
  font-weight: 820;
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease;
}

.duration-option:hover {
  transform: translateY(-2px);
  border-color: rgba(18, 140, 126, .38);
  box-shadow: 0 10px 22px rgba(15, 118, 110, .12);
}

.duration-option.active {
  color: #fff;
  border-color: rgba(18, 140, 126, .72);
  background: linear-gradient(135deg, var(--green), #2d8bd8);
  box-shadow: 0 12px 26px rgba(15, 118, 110, .22);
}

.config-number {
  width: 124px;
  min-height: 38px;
  padding: 0 10px;
  border: 1px solid rgba(18, 140, 126, .22);
  border-radius: 10px;
  color: var(--ink);
  background: #fff;
  font: inherit;
  font-weight: 800;
  text-align: right;
}

.configurator input[type="range"] {
  appearance: none;
  width: 100%;
  height: 12px;
  border-radius: 999px;
  background:
    linear-gradient(90deg, rgba(18, 140, 126, .82), rgba(56, 189, 248, .58)),
    #d8ebe8;
  box-shadow: inset 0 0 0 1px rgba(18, 140, 126, .08);
  cursor: pointer;
}

.configurator input[type="range"]::-webkit-slider-thumb {
  appearance: none;
  width: 24px;
  height: 24px;
  border: 4px solid #fff;
  border-radius: 999px;
  background: var(--green);
  box-shadow: 0 8px 18px rgba(15, 118, 110, .26);
}

.configurator input[type="range"]::-moz-range-thumb {
  width: 18px;
  height: 18px;
  border: 4px solid #fff;
  border-radius: 999px;
  background: var(--green);
  box-shadow: 0 8px 18px rgba(15, 118, 110, .26);
}

.range-labels {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 6px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 720;
  text-align: center;
}

.config-note {
  color: var(--muted);
  font-size: 12px;
  font-weight: 680;
}

.config-limit-note {
  margin: -4px 0 0;
  padding: 12px 14px;
  border: 1px solid rgba(245, 184, 75, .3);
  border-radius: 14px;
  color: #6f4b07;
  background: linear-gradient(135deg, rgba(255, 249, 235, .96), rgba(240, 253, 250, .78));
  font-size: 13px;
  font-weight: 760;
}

.config-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.config-summary span {
  display: grid;
  gap: 3px;
  min-height: 66px;
  padding: 12px;
  border-radius: 14px;
  color: var(--text);
  background: rgba(255, 255, 255, .82);
  border: 1px solid rgba(18, 140, 126, .13);
  font-size: 12px;
  font-weight: 760;
}

.config-summary b {
  color: var(--green-dark);
  font-size: 17px;
}

.custom-plan ul {
  position: relative;
  z-index: 1;
}

/* Resource-based pricing page */
.pricing-v2-hero .pricing-hero-grid {
  grid-template-columns: minmax(0, 1fr) minmax(430px, .82fr);
  gap: 48px;
}

.pricing-v2-hero .pricing-title { max-width: 760px; }
.pricing-v2-hero .lead { max-width: 730px; }

.pricing-offers-section {
  scroll-margin-top: 72px;
  padding: 32px 0 72px;
  background:
    radial-gradient(circle at 10% 10%, rgba(18, 140, 126, .09), transparent 27%),
    radial-gradient(circle at 90% 14%, rgba(245, 184, 75, .1), transparent 25%),
    #fff;
}

.pricing-offers-section .section-heading {
  max-width: 850px;
  margin-bottom: 0;
}

.pricing-offers-section .section-heading h2 {
  max-width: 780px;
  margin-inline: auto;
  margin-bottom: 8px;
  font-size: clamp(32px, 3.2vw, 42px);
}

.pricing-offer-grid {
  display: grid;
  grid-template-columns: minmax(0, .86fr) minmax(340px, 1.28fr) minmax(0, .86fr);
  grid-template-areas: "trial flexible custom";
  gap: 14px;
  align-items: stretch;
  margin-top: 12px;
}

.pricing-offer-card {
  display: flex;
  min-height: 0;
  flex-direction: column;
  padding: 24px;
  border: 1px solid rgba(18, 140, 126, .15);
  border-radius: 8px;
  background: rgba(255, 255, 255, .97);
  box-shadow: 0 20px 50px rgba(17, 24, 39, .08);
}

.pricing-trial-card {
  grid-area: trial;
  background: linear-gradient(160deg, #fff, #f1fbf8);
}

.pricing-flex-card {
  grid-area: flexible;
  padding: 23px;
  scroll-margin-top: 92px;
  color: #e5edf4;
  border-color: rgba(78, 219, 198, .42);
  background:
    radial-gradient(circle at 88% 8%, rgba(44, 189, 168, .24), transparent 28%),
    linear-gradient(145deg, #102b3b, #123f48);
  box-shadow: 0 28px 65px rgba(15, 42, 56, .2);
}

.pricing-custom-card {
  grid-area: custom;
  border-color: rgba(245, 184, 75, .24);
  background: linear-gradient(160deg, #fff, #fffaf0);
}

.pricing-offer-top {
  display: flex;
  min-height: 30px;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 16px;
}

.pricing-offer-top span {
  padding: 6px 9px;
  border-radius: 7px;
  color: var(--green-dark);
  background: #e7f7f3;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.pricing-custom-card .pricing-offer-top span {
  color: #805a12;
  background: #fff0c9;
}

.pricing-offer-top b {
  color: var(--muted);
  font-size: 12px;
  text-transform: uppercase;
}

.pricing-flex-card .pricing-offer-top span {
  color: #0f594f;
  background: #8ee6d8;
}

.pricing-flex-card .pricing-offer-top b { color: #9ceadf; }

.pricing-offer-card h3 {
  margin-bottom: 8px;
  font-size: 27px;
}

.pricing-flex-card h3 { color: #fff; }
.pricing-offer-card > p:not(.pricing-card-note) { color: var(--text); }
.pricing-flex-card > p:not(.pricing-card-note) { color: #cbd5e1; }
.pricing-offer-card > p:not(.pricing-card-note) { font-size: 14px; line-height: 1.55; }

.pricing-plan-benefits {
  display: grid;
  gap: 12px;
  margin: 22px 0 0;
  padding: 0;
  list-style: none;
}

.pricing-plan-benefits li {
  position: relative;
  padding-left: 25px;
  color: var(--text);
  font-size: 14px;
  font-weight: 720;
  line-height: 1.45;
}

.pricing-plan-benefits li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 4px;
  width: 14px;
  height: 14px;
  border-radius: 4px;
  background: linear-gradient(135deg, #36c6b2, #2f78c7);
  box-shadow: inset 0 0 0 4px #effbf8;
}

.pricing-custom-card .pricing-plan-benefits li::before {
  background: linear-gradient(135deg, #f5b84b, var(--green));
  box-shadow: inset 0 0 0 4px #fff8e8;
}

.pricing-resource-list {
  display: grid;
  gap: 0;
  margin: 25px 0 0;
}

.pricing-resource-list > div {
  display: grid;
  gap: 5px;
  padding: 15px 0;
  border-top: 1px solid rgba(18, 140, 126, .14);
}

.pricing-resource-list dt {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.pricing-resource-list dd {
  margin: 0;
  color: var(--ink);
  font-size: 17px;
  font-weight: 900;
}

.pricing-resource-stack {
  display: grid;
  margin: 24px 0 0;
}

.pricing-resource-stack > div {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 13px;
  padding: 16px 0;
  border-top: 1px solid rgba(255, 255, 255, .16);
}

.pricing-resource-stack > div > span {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border-radius: 8px;
  color: #102b3b;
  background: #7ce0d1;
  font-size: 10px;
  font-weight: 900;
}

.pricing-resource-stack p { margin: 0; }
.pricing-resource-stack b { display: block; color: #fff; }
.pricing-resource-stack small { display: block; margin-top: 5px; color: #cbd5e1; line-height: 1.5; }

.pricing-configurator {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 12px;
  flex: 1;
  margin-top: 12px;
}

.pricing-config-group:first-of-type,
.pricing-selection-summary,
.pricing-quote-actions,
.pricing-quote-hint,
.pricing-wa-quote { grid-column: 1 / -1; }

.pricing-config-group {
  min-width: 0;
  margin: 0;
  padding: 11px 0;
  border: 0;
  border-top: 1px solid rgba(255, 255, 255, .16);
}

.pricing-config-legend {
  display: grid;
  width: 100%;
  grid-template-columns: 32px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  padding: 0;
}

.pricing-config-legend > span:first-child {
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border-radius: 8px;
  color: #102b3b;
  background: #7ce0d1;
  font-size: 10px;
  font-weight: 900;
}

.pricing-config-legend b,
.pricing-config-legend small { display: block; }
.pricing-config-legend b { color: #fff; font-size: 15px; }
.pricing-config-legend small { margin-top: 3px; color: #b8c8d3; font-size: 11px; line-height: 1.4; }

.pricing-duration-options {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 4px;
  margin-top: 11px;
  padding: 4px;
  border: 1px solid rgba(255, 255, 255, .15);
  border-radius: 8px;
  background: rgba(4, 20, 31, .24);
}

.pricing-duration-options button {
  min-height: 36px;
  padding: 6px 3px;
  border: 1px solid transparent;
  border-radius: 6px;
  color: #cbd5e1;
  background: transparent;
  font: inherit;
  font-size: 10px;
  font-weight: 800;
  cursor: pointer;
  transition: border-color .16s ease, color .16s ease, background .16s ease;
}

.pricing-duration-options button:hover {
  color: #fff;
  background: rgba(255, 255, 255, .07);
}

.pricing-duration-options button[aria-pressed="true"] {
  border-color: rgba(143, 238, 223, .6);
  color: #0d3d37;
  background: #8ee6d8;
  box-shadow: 0 8px 20px rgba(3, 18, 27, .2);
}

.pricing-duration-options button:focus-visible,
.pricing-number-control input:focus-visible,
.pricing-switch input:focus-visible + .pricing-switch-track {
  outline: 3px solid rgba(125, 224, 209, .42);
  outline-offset: 2px;
}

.pricing-control-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 112px;
  gap: 10px;
  align-items: center;
  margin-top: 12px;
}

.pricing-range {
  --range-progress: 0%;
  width: 100%;
  height: 6px;
  margin: 0;
  border: 0;
  border-radius: 999px;
  appearance: none;
  background: linear-gradient(90deg, #67d8c8 0 var(--range-progress), rgba(255, 255, 255, .2) var(--range-progress) 100%);
  cursor: pointer;
}

.pricing-range::-webkit-slider-thumb {
  width: 20px;
  height: 20px;
  border: 3px solid #123640;
  border-radius: 50%;
  appearance: none;
  background: #a2efe3;
  box-shadow: 0 4px 12px rgba(0, 0, 0, .28);
}

.pricing-range::-moz-range-thumb {
  width: 15px;
  height: 15px;
  border: 3px solid #123640;
  border-radius: 50%;
  background: #a2efe3;
  box-shadow: 0 4px 12px rgba(0, 0, 0, .28);
}

.pricing-range:disabled { cursor: not-allowed; opacity: .38; }

.pricing-number-control {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  min-height: 40px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .2);
  border-radius: 8px;
  background: rgba(255, 255, 255, .08);
}

.pricing-number-control input {
  min-width: 0;
  width: 100%;
  height: 38px;
  padding: 0 8px;
  border: 0;
  color: #fff;
  background: transparent;
  font: inherit;
  font-size: 13px;
  font-weight: 850;
}

.pricing-number-control input:focus { outline: 0; }
.pricing-number-control input:disabled { color: #8a9aa7; cursor: not-allowed; }

.pricing-number-control span {
  padding-right: 8px;
  color: #9fb2c0;
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
}

.pricing-range-scale {
  display: flex;
  justify-content: space-between;
  margin: 7px 122px 0 0;
  color: #91a5b4;
  font-size: 10px;
  font-weight: 700;
}

.pricing-config-group:not(:first-of-type) .pricing-control-row {
  grid-template-columns: 1fr;
  gap: 9px;
}

.pricing-config-group:not(:first-of-type) .pricing-range-scale {
  margin-right: 0;
}

.pricing-switch {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: 11px;
  color: #dce8ee;
  font-size: 13px;
  font-weight: 780;
  cursor: pointer;
}

.pricing-switch input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.pricing-switch-track {
  position: relative;
  width: 42px;
  height: 24px;
  flex: 0 0 auto;
  border: 1px solid rgba(255, 255, 255, .24);
  border-radius: 999px;
  background: rgba(255, 255, 255, .12);
  transition: background .16s ease, border-color .16s ease;
}

.pricing-switch-track::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #c7d7df;
  transition: transform .16s ease, background .16s ease;
}

.pricing-switch input:checked + .pricing-switch-track {
  border-color: #7ce0d1;
  background: #1ea394;
}

.pricing-switch input:checked + .pricing-switch-track::after {
  transform: translateX(18px);
  background: #fff;
}

.pricing-translation-controls {
  max-height: 82px;
  overflow: hidden;
  opacity: 1;
  transition: max-height .18s ease, opacity .18s ease;
}

.pricing-translation-controls.is-disabled {
  max-height: 0;
  opacity: 0;
  pointer-events: none;
}

.pricing-selection-summary {
  display: none;
  gap: 7px;
  margin: 2px 0 9px;
  padding: 10px;
  border: 1px solid rgba(142, 230, 216, .32);
  border-radius: 8px;
  background: rgba(4, 20, 31, .34);
}

.pricing-selection-summary > span {
  color: #8ee6d8;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.pricing-selection-summary > div {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
}

.pricing-selection-summary p { margin: 0; }
.pricing-selection-summary small { display: block; color: #9fb2c0; font-size: 10px; }
.pricing-selection-summary b { display: block; margin-top: 3px; color: #fff; font-size: 12px; }

.pricing-quote-actions {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
  gap: 8px;
}

@media (min-width: 761px) {
  .pricing-configurator { grid-template-rows: auto auto 1fr; }
  .pricing-quote-actions { align-self: end; }
}

.pricing-quote-cta,
.pricing-quote-actions .pricing-wa-quote { min-height: 46px; }

.pricing-quote-hint {
  margin: 7px 0 0;
  color: #aebfca;
  font-size: 11px;
  line-height: 1.45;
  text-align: center;
}

.pricing-quote-hint:empty { display: none; }

.pricing-quote-actions .pricing-wa-quote {
  grid-column: auto;
  color: #d8f8f2;
  border-color: rgba(142, 230, 216, .42);
  background: rgba(255, 255, 255, .06);
}

.pricing-custom-list {
  display: grid;
  gap: 12px;
  margin: 26px 0 0;
  padding: 0;
  list-style: none;
}

.pricing-custom-list li {
  position: relative;
  padding-left: 26px;
  color: var(--text);
  font-weight: 720;
}

.pricing-custom-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 5px;
  width: 14px;
  height: 14px;
  border-radius: 4px;
  background: linear-gradient(135deg, #f5b84b, var(--green));
  box-shadow: inset 0 0 0 4px #fff8e8;
}

.pricing-card-note {
  margin: auto 0 20px;
  padding-top: 20px;
  border-top: 1px solid rgba(18, 140, 126, .14);
  color: var(--muted);
  font-size: 13px;
}

.pricing-flex-card .pricing-card-note {
  border-top-color: rgba(255, 255, 255, .16);
  color: #b8c8d3;
}

.pricing-offer-card .button { width: 100%; }
.pricing-flex-card .button.primary { background: #22ad9d; }

.pricing-resource-section {
  background:
    linear-gradient(rgba(49, 95, 159, .026) 1px, transparent 1px),
    linear-gradient(90deg, rgba(49, 95, 159, .026) 1px, transparent 1px),
    #f7fafc;
  background-size: 38px 38px;
}

.pricing-resource-layout {
  display: grid;
  grid-template-columns: minmax(0, .72fr) minmax(0, 1.28fr);
  gap: 64px;
  align-items: start;
}

.pricing-resource-intro {
  position: sticky;
  top: 104px;
}

.pricing-resource-intro h2 { font-size: clamp(35px, 3.7vw, 48px); }
.pricing-resource-intro p:not(.kicker) { color: var(--text); }

.pricing-resource-explainer {
  display: grid;
  border-top: 1px solid var(--line);
}

.pricing-resource-explainer article {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 20px;
  padding: 28px 0;
  border-bottom: 1px solid var(--line);
}

.pricing-resource-explainer article > span {
  display: grid;
  width: 46px;
  height: 42px;
  place-items: center;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--green), #2f78c7);
  font-size: 11px;
  font-weight: 900;
}

.pricing-resource-explainer h3 { font-size: 24px; }
.pricing-resource-explainer p { margin-bottom: 0; color: var(--text); }

.pricing-quote-section {
  color: #e2e8f0;
  background:
    radial-gradient(circle at 10% 20%, rgba(18, 140, 126, .3), transparent 28%),
    radial-gradient(circle at 90% 18%, rgba(56, 189, 248, .18), transparent 26%),
    #0f172a;
}

.pricing-quote-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 60px;
  align-items: center;
}

.pricing-quote-panel h2 { max-width: 740px; color: #fff; }
.pricing-quote-panel p:not(.kicker) { max-width: 760px; color: #cbd5e1; }
.pricing-quote-panel .kicker { color: #6ee7d8; }

.pricing-quote-actions {
  display: grid;
  gap: 10px;
  min-width: 250px;
}

.pricing-quote-actions .button:not(.primary) {
  border-color: rgba(255, 255, 255, .32);
  color: #fff;
  background: transparent;
}

.usage-box { padding: 30px; }
.usage-box h2 { max-width: 720px; }

.wa-hash-section {
  background:
    radial-gradient(circle at 12% 20%, rgba(18, 140, 126, .12), transparent 30%),
    radial-gradient(circle at 88% 16%, rgba(49, 95, 159, .12), transparent 30%),
    linear-gradient(135deg, #f7fffc, #f8fafc);
}

.wa-hash-box {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(340px, .95fr);
  gap: 28px;
  align-items: stretch;
  padding: 34px;
  border-color: rgba(18, 140, 126, .18);
  border-radius: 24px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .94), rgba(247, 255, 252, .86));
  box-shadow: 0 24px 60px rgba(15, 118, 110, .12);
}

.wa-hash-box::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(18, 140, 126, .05) 1px, transparent 1px),
    linear-gradient(0deg, rgba(49, 95, 159, .05) 1px, transparent 1px);
  background-size: 36px 36px;
  mask-image: linear-gradient(90deg, transparent, #000, transparent);
}

.wa-hash-copy,
.wa-hash-visual {
  position: relative;
  z-index: 1;
}

.wa-hash-copy h2 {
  max-width: 760px;
  font-size: clamp(30px, 3vw, 44px);
  line-height: 1.12;
}

.wa-hash-copy h3 {
  max-width: 760px;
  margin-bottom: 12px;
  font-size: clamp(22px, 2vw, 30px);
  line-height: 1.22;
}

.wa-hash-copy p {
  max-width: 760px;
  font-size: 16px;
  line-height: 1.7;
}

.wa-hash-points {
  display: grid;
  gap: 9px;
  margin: 18px 0 0;
  padding: 0;
  list-style: none;
}

.wa-hash-points li {
  position: relative;
  padding: 11px 14px 11px 36px;
  border: 1px solid rgba(18, 140, 126, .16);
  border-radius: 14px;
  background: rgba(255, 255, 255, .7);
  color: var(--text);
  font-size: 14px;
  font-weight: 720;
}

.wa-hash-points li::before {
  content: "";
  position: absolute;
  left: 14px;
  top: 17px;
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--green), #38bdf8);
  box-shadow: 0 0 0 4px rgba(18, 140, 126, .1);
}

.wa-hash-visual {
  display: grid;
  gap: 12px;
}

.wa-hash-visual div {
  padding: 18px;
  border: 1px solid rgba(18, 140, 126, .16);
  border-radius: 18px;
  background: rgba(255, 255, 255, .82);
  box-shadow: 0 14px 28px rgba(15, 118, 110, .08);
}

.wa-hash-visual span {
  display: inline-flex;
  margin-bottom: 12px;
  padding: 5px 9px;
  border-radius: 999px;
  color: #fff;
  background: linear-gradient(135deg, var(--green-dark), var(--green), #2ba7de);
  font-size: 12px;
  font-weight: 900;
}

.wa-hash-visual b {
  display: block;
  margin-bottom: 6px;
  color: var(--text);
}

.wa-hash-visual p {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
}

.account-contact-section {
  background:
    radial-gradient(circle at 18% 22%, rgba(18, 140, 126, .13), transparent 28%),
    linear-gradient(135deg, #f7fafc, #eef9f5);
}

.account-contact-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 28px;
  align-items: center;
  padding: 32px;
  border: 1px solid rgba(18, 140, 126, .18);
  border-radius: 22px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .94), rgba(246, 253, 250, .9));
  box-shadow: 0 24px 55px rgba(15, 118, 110, .13);
}

.account-contact-card h2 {
  max-width: 780px;
  margin-bottom: 12px;
  font-size: clamp(28px, 3vw, 42px);
}

.account-contact-card p:not(.kicker) {
  max-width: 780px;
  margin-bottom: 0;
  color: var(--text);
  font-size: 17px;
}

.account-contact-actions {
  display: grid;
  gap: 12px;
  min-width: 240px;
}

.float-contact {
  position: fixed;
  right: 14px;
  top: 54%;
  z-index: 40;
  width: 184px;
  transform: translateY(-50%);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.float-contact a {
  display: block;
  margin-top: 9px;
  border-radius: 8px;
  transition: transform .16s ease, filter .16s ease;
  filter: drop-shadow(0 12px 20px rgba(17, 24, 39, .14));
}

.float-contact a:hover {
  transform: translateX(-2px);
  filter: brightness(1.03);
}

.float-contact a img {
  width: 100%;
  height: auto;
}

.float-contact a.float-pill {
  position: relative;
  aspect-ratio: 4 / 1;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  color: #fff;
  text-decoration: none;
}

html[lang="zh-CN"] .float-contact a.float-pill-trial { background-image: url("assets/zh/free-trial-button-sharp-v3.png"); }
html[lang="zh-CN"] .float-contact a.float-pill-tg { background-image: url("assets/zh/contact-tg-button-sharp-v3.png"); }
html[lang="zh-CN"] .float-contact a.float-pill-wa { background-image: url("assets/zh/contact-ws-button-sharp-v3.png"); }
html[lang="zh-CN"] .float-contact a.float-pill-channel { background-image: url("assets/zh/join-channel-button-sharp-v3.png"); }

html[lang="en"] .float-contact a.float-pill-trial { background-image: url("assets/en/free-trial-button-sharp-v3.png"); }
html[lang="en"] .float-contact a.float-pill-tg { background-image: url("assets/en/contact-tg-button-sharp-v3.png"); }
html[lang="en"] .float-contact a.float-pill-wa { background-image: url("assets/en/contact-ws-button-sharp-v3.png"); }
html[lang="en"] .float-contact a.float-pill-channel { background-image: url("assets/en/join-channel-button-sharp-v3.png"); }

.support-avatar {
  width: 118px;
  height: 118px;
  object-fit: cover;
  border-radius: 50%;
  margin: 0 auto 10px;
  border: 0;
  box-shadow: none;
}

.float-contact-toggle { display: none; }

@media (max-width: 1500px) and (min-width: 1181px) {
  .home-page .float-contact,
  .pricing-page .float-contact,
  .seo-page .float-contact {
    right: 8px;
    width: 122px;
  }

  .home-page .support-avatar,
  .pricing-page .support-avatar,
  .seo-page .support-avatar {
    width: 96px;
    height: 96px;
  }
}

.footer {
  padding: 46px 0;
  color: #cbd5e1;
  background: #0f172a;
}

.footer-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) repeat(2, minmax(150px, .55fr));
  gap: 34px;
}

.footer-grid > div:nth-child(n+2) {
  justify-self: end;
  min-width: 150px;
  text-align: center;
}

.footer b {
  display: block;
  margin-bottom: 11px;
  color: #fff;
}

.footer a,
.footer p {
  display: block;
  margin: 0 0 8px;
  color: #cbd5e1;
  font-size: 14px;
}

.footer-grid > div:nth-child(n+2) a {
  width: fit-content;
  margin-left: auto;
  margin-right: auto;
}

.footer a.footer-featured {
  width: fit-content;
  margin-bottom: 12px;
  padding: 8px 13px;
  border: 1px solid rgba(16, 185, 129, .42);
  border-radius: 999px;
  color: #fff;
  background: linear-gradient(135deg, #0b6f64, #128c7e 56%, #10b981);
  box-shadow: 0 12px 28px rgba(16, 185, 129, .2);
  font-weight: 850;
  transition: transform .16s ease, box-shadow .16s ease;
}

.footer a.footer-featured:hover {
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 16px 34px rgba(16, 185, 129, .28);
}

.footer-legal {
  margin: 14px 0 0;
  color: #94a3b8;
  font-size: 13px;
  text-align: left;
}

.footer-legal a {
  display: inline;
  margin: 0;
  color: #e2e8f0;
  font-size: inherit;
}

.footer-legal a:hover {
  color: #fff;
}

.footer p.footer-operator {
  margin-top: 12px;
  color: #e2e8f0;
  font-size: 13px;
}

.about-page {
  background: #f8fbfd;
}

.about-hero {
  background: linear-gradient(115deg, #e7f7f4, #f6fbff 62%, #eef4fb);
}

.about-hero .narrow {
  max-width: 980px;
}

.about-section {
  padding-top: 52px;
}

.about-content {
  max-width: 1040px;
}

.about-identity {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(230px, .8fr);
  gap: 36px;
  align-items: center;
  padding: 34px 0;
  border-top: 2px solid #0f766e;
  border-bottom: 1px solid var(--line);
}

.about-identity h2 {
  margin: 8px 0 12px;
  font-size: clamp(26px, 3vw, 38px);
}

.about-identity p,
.about-copy-grid p {
  color: var(--text);
}

.about-identity-details {
  display: grid;
  gap: 14px;
}

.about-identity-details p {
  display: grid;
  gap: 4px;
  margin: 0;
}

.about-identity-details span {
  color: var(--muted);
  font-size: 13px;
}

.about-identity-details strong {
  font-size: 17px;
}

.about-copy-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 48px;
  padding: 40px 0;
}

.about-copy-grid h2 {
  margin-bottom: 10px;
  font-size: 25px;
}

.about-links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px 24px;
  padding: 26px 0 0;
  border-top: 1px solid var(--line);
}

.about-links p {
  flex-basis: 100%;
  margin: 0;
  font-weight: 700;
}

.about-links > a:not(.button) {
  color: #0f766e;
  font-weight: 700;
}

@media (max-width: 700px) {
  .about-identity,
  .about-copy-grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .about-section {
    padding-top: 28px;
  }
}

.legal-page {
  background:
    radial-gradient(circle at 88% 10%, rgba(18, 140, 126, .16), transparent 28%),
    linear-gradient(135deg, #f8fffb, #f5f8fc);
}

.legal-document {
  max-width: 920px;
  margin: 0 auto;
  padding: 34px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 18px 48px rgba(17, 24, 39, .08);
}

.legal-document h2 {
  margin-top: 28px;
  font-size: 24px;
}

.legal-document h2:first-child {
  margin-top: 0;
}

.legal-entity-disclosure {
  margin: 0 0 26px;
  padding: 16px 20px;
  border-left: 3px solid #0f766e;
  background: #effaf8;
}

.legal-document .legal-entity-disclosure + h2 {
  margin-top: 0;
}

.legal-document p,
.legal-document li {
  color: var(--text);
}

.legal-document ul {
  display: grid;
  gap: 8px;
  padding-left: 20px;
}

.brand-page {
  background: #f6fafb;
}

.brand-hero {
  position: relative;
  overflow: hidden;
  padding: 86px 0 92px;
  color: #fff;
  background:
    radial-gradient(circle at 14% 18%, rgba(20, 184, 166, .3), transparent 30%),
    radial-gradient(circle at 86% 18%, rgba(56, 189, 248, .24), transparent 32%),
    linear-gradient(135deg, #0c1726 0%, #0f2d39 52%, #123d4d 100%);
}

.brand-hero::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 45%;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, .07) 1px, transparent 1px),
    linear-gradient(0deg, rgba(255, 255, 255, .06) 1px, transparent 1px);
  background-size: 46px 46px;
  mask-image: linear-gradient(transparent, #000);
}

.brand-hero-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(420px, 1.1fr);
  gap: 52px;
  align-items: center;
}

.brand-page .brand-hero .container {
  padding-right: 150px;
}

.brand-kicker {
  color: #9be7da;
}

.brand-hero h1 {
  max-width: 760px;
  font-size: clamp(42px, 4.35vw, 62px);
}

.brand-hero .lead {
  color: #d8eef0;
}

.brand-outline {
  border-color: rgba(255, 255, 255, .3);
  color: #fff;
  background: rgba(255, 255, 255, .08);
}

.brand-console {
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: 8px;
  overflow: hidden;
  background: rgba(255, 255, 255, .1);
  box-shadow: 0 26px 70px rgba(0, 0, 0, .24);
  backdrop-filter: blur(16px);
}

.brand-console-top {
  min-height: 54px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 18px;
  border-bottom: 1px solid rgba(255, 255, 255, .16);
  color: #e8faf8;
}

.brand-console-top span {
  width: 11px;
  height: 11px;
  border-radius: 999px;
  background: #75d6ca;
}

.brand-console-top span:nth-child(2) { background: #38bdf8; }
.brand-console-top span:nth-child(3) { background: #f59e0b; }
.brand-console-top b { margin-left: 8px; }

.brand-console-body {
  display: grid;
  grid-template-columns: 170px 1fr;
  min-height: 330px;
}

.brand-console-nav {
  display: grid;
  align-content: start;
  gap: 10px;
  padding: 18px;
  border-right: 1px solid rgba(255, 255, 255, .14);
}

.brand-console-nav span {
  padding: 11px 12px;
  border-radius: 8px;
  color: #cce9ee;
  background: rgba(255, 255, 255, .08);
  font-size: 13px;
  font-weight: 800;
}

.brand-console-main {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  padding: 20px;
}

.brand-metric {
  padding: 20px;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 8px;
  background: linear-gradient(135deg, rgba(255, 255, 255, .16), rgba(255, 255, 255, .07));
}

.brand-metric b {
  display: block;
  margin-bottom: 8px;
  color: #fff;
  font-size: 24px;
}

.brand-metric p {
  margin: 0;
  color: #d8eef0;
}

.brand-band {
  background:
    radial-gradient(circle at 14% 22%, rgba(18, 140, 126, .1), transparent 28%),
    #f6fafb;
}

.brand-grid,
.brand-story-list {
  display: grid;
  gap: 18px;
}

.brand-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.brand-grid article,
.brand-story-list article,
.brand-cta {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 14px 32px rgba(17, 24, 39, .06);
}

.brand-grid article {
  min-height: 260px;
  padding: 26px;
}

.brand-grid span {
  display: inline-flex;
  margin-bottom: 22px;
  padding: 6px 10px;
  border-radius: 999px;
  color: #0b6f64;
  background: #e5f6f2;
  font-size: 12px;
  font-weight: 900;
}

.brand-grid p,
.brand-story-list p,
.brand-cta p {
  color: var(--muted);
}

.brand-story {
  display: grid;
  grid-template-columns: minmax(0, .86fr) minmax(0, 1.14fr);
  gap: 44px;
}

.brand-story-list article {
  padding: 22px;
}

.brand-story-list b {
  display: block;
  margin-bottom: 8px;
}

.brand-story-list p {
  margin-bottom: 0;
}

.brand-cta {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 28px;
  align-items: center;
  padding: 30px;
}

@media (max-width: 1180px) {
  .hero .container,
  .sub-hero .container,
  .brand-page .brand-hero .container { padding-right: 86px; }

  .float-contact {
    right: 12px;
    width: 92px;
    padding: 0;
    display: grid;
    gap: 7px;
  }

  .float-contact a { margin-top: 0; }

  .support-avatar {
    width: 86px;
    height: 86px;
    margin-bottom: 0;
  }
}

@media (max-width: 1100px) {
  .nav-links { display: none; }

  .hero-grid,
  .pricing-hero-grid,
  .section-media-heading,
  .brand-hero-grid,
  .brand-story,
  .workflow-board,
  .wa-hash-box,
  .account-contact-card,
  .trial-panel,
  .resource-card,
  .brand-cta,
  .faq-layout {
    grid-template-columns: 1fr;
  }

  .pricing-visual {
    max-width: 560px;
    justify-self: center;
  }

  .hero-showcase { max-width: 720px; }
  .hero-showcase {
    margin-right: 0;
  }
  .section-visual {
    max-width: 720px;
    justify-self: center;
  }

  .solution-heading {
    grid-template-columns: 1fr;
  }

  .workflow-board { grid-template-columns: 1fr; }
  .workflow-console { min-height: auto; }
  .trial-panel { grid-template-columns: 1fr; }
  .trial-copy { padding: 8px; }
  .trial-media {
    justify-self: center;
  }

  .pain-grid,
  .solution-map,
  .brand-grid,
  .plan-grid,
  .account-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pricing-plans {
    max-width: 780px;
    margin-inline: auto;
    grid-template-columns: 1fr;
  }

  .pricing-plans .configurable-plan {
    grid-column: auto;
  }
}

@media (max-width: 900px) {
  body { padding-bottom: 108px; }

  .float-contact {
    top: auto;
    right: 12px;
    bottom: 12px;
    left: 12px;
    width: auto;
    transform: none;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    padding: 0;
  }

  .float-contact a { margin-top: 0; }
  .support-avatar { display: none; }
}

@media (max-width: 760px) {
  body { padding-bottom: 76px; }

  .container { width: min(100% - 28px, 1160px); }

  .hero .container,
  .sub-hero .container { padding-right: 0; }

  .nav-actions .button.ghost,
  .brand span:last-child { display: none; }

  .brand img.brand-logo-wide {
    width: 132px;
    height: 36px;
  }

  .hero,
  .brand-hero,
  .section,
  .sub-hero { padding: 54px 0; }

  .hero {
    min-height: auto;
  }

  h1 { font-size: 39px; }
  h2 { font-size: 31px; }

  .hero-kicker { font-size: 14px; }

  .brand-hero h1 {
    font-size: 34px;
    line-height: 1.08;
  }

  .brand-hero .lead {
    font-size: 17px;
  }

  .action-row {
    align-items: stretch;
    flex-direction: column;
  }

  .account-contact-card {
    padding: 24px;
  }

  .account-contact-actions {
    min-width: 0;
  }

  .hero-showcase {
    min-height: 260px;
    max-width: 100%;
    margin-top: 26px;
    margin-right: 0;
    display: grid;
  }

  .hero-ambient {
    inset: 8% 3% 2%;
    border-radius: 18px;
    transform: none;
  }

  .hero-visual {
    border-radius: 18px;
    transform: none;
  }

  .hero-chip {
    display: none;
  }

  .section-media-heading {
    gap: 22px;
  }

  .section-visual,
  .workflow-art,
  .faq-art,
  .trial-media {
    border-radius: 18px;
  }

  .section-visual img,
  .workflow-art img,
  .trial-media img,
  .faq-art img {
    aspect-ratio: 4 / 3;
  }

  .pain-grid,
  .solution-map,
  .brand-grid,
  .pricing-plans,
  .plan-grid,
  .account-grid,
  .check-list,
  .footer-grid {
    grid-template-columns: 1fr;
  }

  .pricing-plans .configurable-plan {
    grid-column: auto;
  }

  .pricing-visual img {
    aspect-ratio: 4 / 3;
  }

  .duration-options {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .duration-option:last-child {
    grid-column: 1 / -1;
  }

  .config-head {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }

  .config-number {
    width: 100%;
    text-align: left;
  }

  .range-labels {
    font-size: 10px;
  }

  .config-summary {
    grid-template-columns: 1fr;
  }

  .trial-panel {
    padding: 16px;
  }

  .check-list {
    position: relative;
    left: auto;
    right: auto;
    bottom: auto;
    grid-template-columns: 1fr;
    padding: 16px;
    border-radius: 0;
  }

  .footer-grid > div:nth-child(n+2) {
    justify-self: start;
    text-align: left;
  }

  .footer-grid > div:nth-child(n+2) a {
    margin-left: 0;
    margin-right: 0;
  }

  .brand-console-body {
    grid-template-columns: 1fr;
  }

  .brand-console-nav {
    border-right: 0;
    border-bottom: 1px solid rgba(255, 255, 255, .14);
  }

  .resource-card,
  .brand-cta,
  .usage-box,
  .plan-card,
  .account-card { padding: 22px; }

  .float-contact {
    top: auto;
    right: 14px;
    bottom: 14px;
    left: auto;
    width: auto;
    transform: none;
    display: grid;
    grid-template-columns: 1fr;
    gap: 7px;
    padding: 0;
  }

  .float-contact > a { display: none; margin-top: 0; }
  .float-contact.open {
    width: min(230px, calc(100vw - 28px));
    padding: 10px;
    border: 1px solid rgba(15, 23, 42, .12);
    border-radius: 14px;
    background: rgba(255, 255, 255, .97);
    box-shadow: 0 20px 46px rgba(15, 23, 42, .2);
    backdrop-filter: blur(14px);
  }
  .float-contact.open > a { display: block; }

  .float-contact-toggle {
    display: flex;
    width: 118px;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 5px 12px 5px 6px;
    border: 1px solid rgba(15, 23, 42, .12);
    border-radius: 999px;
    color: #fff;
    background: #0f8f83;
    box-shadow: 0 13px 30px rgba(15, 23, 42, .2);
    font: inherit;
    font-size: 14px;
    font-weight: 850;
    cursor: pointer;
  }
  .float-contact-toggle img {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    object-fit: cover;
  }
  .float-contact:not(.open) .float-contact-toggle {
    width: 50px;
    min-height: 50px;
    padding: 6px;
  }
  .float-contact:not(.open) .float-contact-toggle span {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
  }
  .float-contact.open .float-contact-toggle {
    width: 100%;
    justify-content: flex-start;
    box-shadow: none;
  }

  .support-avatar { display: none; }
}

/* Launch architecture and SEO pages */
.nav-toggle {
  display: none;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  place-items: center;
  gap: 4px;
  padding: 9px;
  border: 1px solid var(--line-dark);
  border-radius: 10px;
  color: var(--ink);
  background: #fff;
  cursor: pointer;
}

.nav-toggle span {
  width: 19px;
  height: 2px;
  border-radius: 999px;
  background: currentColor;
}

.nav-links a.active,
.nav-links a[aria-current="page"] {
  color: var(--green-dark);
  font-weight: 850;
}

.text-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 12px;
  color: var(--green-dark);
  font-size: 14px;
  font-weight: 850;
}

.text-link::after { content: "\2192"; }

.centered {
  max-width: 780px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

.operations-visibility-section {
  background:
    radial-gradient(circle at 10% 15%, rgba(49, 95, 159, .12), transparent 30%),
    linear-gradient(180deg, #f4f8ff, #fff);
}

.operations-visibility {
  display: grid;
  grid-template-columns: minmax(0, .88fr) minmax(420px, 1.12fr);
  gap: 42px;
  align-items: center;
}

.operations-visibility-copy h2 { max-width: 640px; }

.operations-visibility-copy > p:not(.kicker) {
  max-width: 680px;
  color: var(--text);
}

.operations-signals {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 24px 0;
}

.operations-signals span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 12px;
  border: 1px solid rgba(49, 95, 159, .15);
  border-radius: 8px;
  color: #1d4f91;
  background: rgba(255, 255, 255, .86);
  font-size: 12px;
  font-weight: 850;
}

.operations-signals b {
  color: var(--green-dark);
  font-size: 10px;
}

.operations-visibility-media,
.seo-hero-media,
.seo-inline-media {
  overflow: hidden;
  margin: 0;
  border: 1px solid rgba(49, 95, 159, .14);
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 28px 70px rgba(31, 71, 128, .13);
}

.operations-visibility-media img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}

.operations-visibility-media { position: relative; }

.operations-visibility-media figcaption {
  position: absolute;
  right: 16px;
  bottom: 16px;
  left: 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 14px 16px;
  border: 1px solid rgba(255, 255, 255, .28);
  border-radius: 10px;
  color: #fff;
  background: rgba(8, 25, 42, .84);
  backdrop-filter: blur(12px);
}

.operations-visibility-media figcaption span {
  color: #7ce0d1;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.operations-visibility-media figcaption b { font-size: 13px; }

.footer-grid {
  grid-template-columns: minmax(0, 1.45fr) repeat(3, minmax(130px, .52fr));
}

.footer-grid > div:nth-child(n+2) {
  justify-self: start;
  text-align: left;
}

.footer-grid > div:nth-child(n+2) a {
  margin-left: 0;
  margin-right: 0;
}

.footer-logo {
  width: 154px;
  height: 44px;
  margin-bottom: 16px;
  object-fit: contain;
  object-position: left center;
}

.trademark-note {
  margin-top: 26px !important;
  padding-top: 18px;
  border-top: 1px solid rgba(148, 163, 184, .18);
  color: #8491a5 !important;
  font-size: 12px !important;
}

.seo-page { background: #fff; }

.seo-hero {
  overflow: hidden;
  padding: 76px 0 70px;
  border-bottom: 1px solid var(--line);
  background:
    radial-gradient(circle at 10% 12%, rgba(18, 140, 126, .16), transparent 28%),
    radial-gradient(circle at 90% 15%, rgba(49, 95, 159, .15), transparent 30%),
    linear-gradient(135deg, #f7fffc 0%, #f1f7ff 62%, #fff9eb 100%);
}

.seo-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(430px, .9fr);
  gap: 48px;
  align-items: center;
}

.seo-hero h1 {
  max-width: 720px;
  margin-bottom: 22px;
  font-size: clamp(46px, 5.2vw, 70px);
  line-height: 1.01;
}

.seo-hero .lead { max-width: 680px; }

.seo-hero-media { position: relative; }

.seo-hero-media::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .42);
}

.seo-hero-media img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.breadcrumbs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 22px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 720;
}

.breadcrumbs a:hover { color: var(--green-dark); }

.hero-proof-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 22px;
}

.hero-proof-row span {
  padding: 8px 11px;
  border: 1px solid rgba(18, 140, 126, .15);
  border-radius: 8px;
  color: var(--green-dark);
  background: rgba(255, 255, 255, .78);
  font-size: 12px;
  font-weight: 820;
}

.seo-solutions-section {
  background:
    linear-gradient(rgba(18, 140, 126, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(18, 140, 126, .035) 1px, transparent 1px),
    #fff;
  background-size: 30px 30px;
}

.seo-solution-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin-top: 34px;
}

.seo-solution-card {
  position: relative;
  overflow: hidden;
  min-height: 330px;
  padding: 30px;
  border: 1px solid rgba(18, 140, 126, .15);
  border-radius: 18px;
  background: rgba(255, 255, 255, .95);
  box-shadow: 0 18px 45px rgba(17, 24, 39, .07);
}

.seo-solution-card > span,
.capability-grid article > span {
  display: inline-grid;
  min-width: 34px;
  height: 30px;
  place-items: center;
  margin-bottom: 18px;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--green), #2f78c7);
  font-size: 12px;
  font-weight: 900;
}

.seo-solution-card h2 { font-size: 28px; }

.seo-solution-card p,
.seo-solution-card li { color: var(--text); }

.seo-solution-card ul {
  display: grid;
  gap: 7px;
  padding-left: 18px;
}

.decision-band,
.quota-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 34px;
  padding: 36px;
  border: 1px solid rgba(18, 140, 126, .16);
  border-radius: 18px;
  background: rgba(255, 255, 255, .88);
  box-shadow: 0 20px 48px rgba(17, 24, 39, .08);
}

.decision-band > div:first-child,
.quota-panel > div { max-width: 720px; }

.account-mini-bridge { padding: 42px 0; }

.account-mini-inner {
  display: grid;
  grid-template-columns: 170px minmax(0, 1fr) auto;
  gap: 28px;
  align-items: center;
  padding: 26px 30px;
  border: 1px solid rgba(49, 95, 159, .15);
  border-radius: 16px;
  background: linear-gradient(135deg, #f4f8ff, #fff);
}

.account-mini-inner > img {
  width: 160px;
  max-height: 48px;
  object-fit: contain;
}

.account-mini-inner h2 { margin-bottom: 6px; font-size: 25px; }
.account-mini-inner p { margin-bottom: 0; color: var(--text); }

.solution-consultation-section {
  padding-top: 38px;
  background: linear-gradient(180deg, #f7fbff 0%, #fff 100%);
}

.solution-consultation {
  display: grid;
  grid-template-columns: minmax(280px, .72fr) minmax(0, 1.28fr);
  gap: 46px;
  align-items: center;
  padding: 34px;
  border: 1px solid rgba(49, 95, 159, .14);
  border-radius: 18px;
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 24px 64px rgba(31, 71, 128, .1);
}

.solution-consultation figure {
  overflow: hidden;
  margin: 0;
  border-radius: 12px;
  background: #eaf6f4;
}

.solution-consultation figure img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.solution-consultation h2 { max-width: 680px; margin-bottom: 12px; }
.solution-consultation p:not(.kicker) { max-width: 740px; color: var(--text); }

.solution-consultation-points {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 22px 0 24px;
}

.solution-consultation-points span {
  padding: 8px 11px;
  border: 1px solid rgba(18, 140, 126, .16);
  border-radius: 7px;
  color: var(--green-dark);
  background: #f0fbf8;
  font-size: 12px;
  font-weight: 800;
}

.operating-checkpoint-section { padding: 44px 0; background: #f4f8ff; }

.operating-checkpoint {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr) auto;
  gap: 30px;
  align-items: center;
  padding: 30px 34px;
  border: 1px solid rgba(49, 95, 159, .14);
  border-radius: 16px;
  background: linear-gradient(135deg, #fff, #f2fbf9);
  box-shadow: 0 20px 50px rgba(31, 71, 128, .08);
}

.operating-checkpoint h2 { margin-bottom: 8px; font-size: 28px; }
.operating-checkpoint p:not(.kicker) { margin-bottom: 0; color: var(--text); }
.operating-checkpoint-list { display: grid; gap: 8px; }
.operating-checkpoint-list span { display: flex; align-items: center; gap: 10px; color: var(--ink); font-size: 13px; font-weight: 800; }
.operating-checkpoint-list b { display: grid; width: 28px; height: 28px; place-items: center; border-radius: 6px; color: #fff; background: var(--green); font-size: 9px; }

@media (max-width: 1040px) {
  .solution-consultation,
  .operating-checkpoint { grid-template-columns: 1fr; }
  .solution-consultation figure { max-width: 620px; }
  .operating-checkpoint .button { justify-self: start; }
}

@media (max-width: 760px) {
  .solution-consultation { gap: 26px; padding: 22px; }
  .solution-consultation-points { display: grid; }
  .operating-checkpoint { gap: 22px; padding: 24px; }
}

.seo-copy-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, .78fr);
  gap: 54px;
  align-items: center;
}

.seo-copy-grid > div:first-child > p:not(.kicker) { color: var(--text); }

.seo-inline-media img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.seo-stat-stack {
  display: grid;
  gap: 12px;
}

.seo-stat-stack article {
  display: grid;
  gap: 4px;
  padding: 20px 22px;
  border: 1px solid rgba(18, 140, 126, .14);
  border-left: 4px solid var(--green);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(17, 24, 39, .06);
}

.seo-stat-stack b { color: var(--ink); font-size: 19px; }
.seo-stat-stack span { color: var(--text); font-size: 14px; }

.capability-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: 34px;
}

.capability-grid.four { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.capability-grid article {
  min-height: 230px;
  padding: 24px;
  border: 1px solid rgba(18, 140, 126, .14);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 14px 36px rgba(17, 24, 39, .06);
}

.capability-grid h3 { font-size: 21px; }
.capability-grid p { color: var(--text); }

.process-panel {
  display: grid;
  grid-template-columns: minmax(280px, .72fr) minmax(0, 1.28fr);
  gap: 48px;
  align-items: start;
  padding: 38px;
  border-radius: 20px;
  color: #e5eef8;
  background:
    radial-gradient(circle at 90% 8%, rgba(56, 189, 248, .16), transparent 26%),
    linear-gradient(135deg, #0f172a, #103142);
}

.process-panel h2 { color: #fff; }
.process-panel p { color: #cbd5e1; }

.process-list {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: setup;
}

.process-list li {
  position: relative;
  display: grid;
  gap: 3px;
  min-height: 74px;
  padding: 14px 16px 14px 58px;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 10px;
  background: rgba(255, 255, 255, .06);
  counter-increment: setup;
}

.process-list li::before {
  content: counter(setup);
  position: absolute;
  left: 15px;
  top: 16px;
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--green), #38bdf8);
  font-size: 12px;
  font-weight: 900;
}

.process-list b { color: #fff; }
.process-list span { color: #cbd5e1; font-size: 14px; }

.faq-seo-section { background: #f8fafc; }

.seo-final-cta {
  padding: 70px 0;
  color: #e5eef8;
  text-align: center;
  background:
    radial-gradient(circle at 15% 15%, rgba(18, 140, 126, .3), transparent 30%),
    radial-gradient(circle at 88% 18%, rgba(56, 189, 248, .18), transparent 28%),
    #0f172a;
}

.seo-final-cta .container { max-width: 850px; }
.seo-final-cta h2 { color: #fff; }
.seo-final-cta p:not(.kicker) { color: #cbd5e1; }
.seo-final-cta .action-row { justify-content: center; }

.comparison-panel,
.role-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 62px minmax(0, 1fr);
  gap: 22px;
  align-items: center;
}

.comparison-panel > div:not(.comparison-arrow),
.role-grid > div {
  height: 100%;
  padding: 30px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 16px 42px rgba(17, 24, 39, .07);
}

.comparison-panel ul,
.role-grid ul {
  display: grid;
  gap: 10px;
  padding-left: 19px;
  color: var(--text);
}

.comparison-arrow {
  display: grid;
  width: 52px;
  height: 52px;
  place-items: center;
  border-radius: 999px;
  color: #fff;
  background: linear-gradient(135deg, var(--green), #2f78c7);
  font-size: 22px;
  font-weight: 900;
}

.role-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.inbox-preview {
  overflow: hidden;
  border: 1px solid rgba(49, 95, 159, .16);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 22px 56px rgba(31, 71, 128, .13);
}

.inbox-preview-head,
.inbox-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 18px;
}

.inbox-preview-head {
  justify-content: space-between;
  color: #fff;
  background: #122b3b;
  font-weight: 820;
}

.inbox-row { border-top: 1px solid var(--line); }

.inbox-row i {
  width: 38px;
  height: 38px;
  display: grid;
  flex: 0 0 38px;
  place-items: center;
  border-radius: 10px;
  color: #fff;
  background: linear-gradient(135deg, var(--green), #38bdf8);
  font-style: normal;
  font-size: 12px;
  font-weight: 900;
}

.inbox-row div { display: grid; flex: 1; }
.inbox-row span { color: var(--muted); font-size: 12px; }
.inbox-row em { color: var(--blue); font-style: normal; font-size: 12px; font-weight: 800; }

.translation-flow {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 190px minmax(0, 1fr);
  gap: 24px;
  align-items: center;
}

.translation-message {
  padding: 28px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 18px 44px rgba(17, 24, 39, .08);
}

.translation-message > span { color: var(--green-dark); font-size: 12px; font-weight: 900; text-transform: uppercase; }
.translation-message p { margin: 16px 0; color: var(--ink); font-size: 21px; font-weight: 760; }
.translation-message small { color: var(--muted); }

.translation-core {
  display: grid;
  justify-items: center;
  gap: 9px;
  color: var(--text);
  font-size: 12px;
  text-align: center;
}

.translation-core b { color: var(--green-dark); font-size: 15px; }

.translation-core i {
  width: 100%;
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--green), #38bdf8, #f5b84b);
}

@media (max-width: 1180px) {
  .seo-hero .container { padding-right: 86px; }
}

@media (max-width: 1100px) {
  .nav { position: relative; }

  .brand { flex: 0 0 auto; }

  .nav-toggle { display: grid; order: 2; }

  .nav-links {
    position: absolute;
    top: calc(100% + 1px);
    right: 0;
    left: 0;
    z-index: 40;
    display: none;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px;
    padding: 14px;
    border: 1px solid var(--line);
    border-top: 0;
    border-radius: 0 0 14px 14px;
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 18px 36px rgba(17, 24, 39, .12);
  }

  .nav-links.open {
    display: grid;
    overflow: visible;
  }

  .nav-links > a {
    padding: 11px 12px;
    border-radius: 8px;
  }

  .nav-links > a:hover { background: #eef8f6; }

  .nav-links .language-switch {
    position: static;
    transform: none;
    top: auto;
    right: auto;
    grid-column: 1 / -1;
    margin: 6px 0 0;
    padding-top: 10px;
    border-top: 1px solid var(--line);
    display: block;
    width: 100%;
  }

  .nav-links .language-switch-trigger {
    width: 100%;
    justify-content: flex-start;
  }

  .nav-links .language-switch-menu {
    left: 0;
    right: 0;
    min-width: 0;
    width: 100%;
    z-index: 50;
  }

  .nav-actions {
    flex: 0 0 auto;
    margin-left: auto;
    margin-right: 0;
    order: 1;
  }

  .operations-visibility,
  .seo-hero-grid,
  .seo-copy-grid,
  .process-panel {
    grid-template-columns: 1fr;
  }

  .seo-hero-media,
  .operations-visibility-media { max-width: 720px; justify-self: center; }

  .seo-solution-grid,
  .capability-grid,
  .capability-grid.four,
  .footer-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .translation-flow { grid-template-columns: 1fr; }
  .translation-core { grid-template-columns: 1fr auto 1fr; }
  .translation-core i { width: 120px; }
}

@media (max-width: 760px) {
  .nav { gap: 10px; }
  .nav-actions { gap: 8px; }
  .nav-actions .button.primary { padding: 0 12px; }

  .nav-links {
    grid-template-columns: 1fr;
    right: -14px;
    left: -14px;
  }

  .seo-hero { padding: 52px 0; }
  .seo-hero .container { padding-right: 0; }
  .seo-hero h1 { font-size: 39px; }

  .operations-visibility,
  .seo-solution-grid,
  .capability-grid,
  .capability-grid.four,
  .role-grid,
  .footer-grid {
    grid-template-columns: 1fr;
  }

  .operations-visibility { gap: 26px; }
  .operations-visibility-media img,
  .seo-hero-media img { aspect-ratio: 4 / 3; }

  .decision-band,
  .quota-panel {
    align-items: stretch;
    flex-direction: column;
    padding: 26px;
  }

  .account-mini-inner {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .account-mini-inner > img { width: 150px; }

  .process-panel { padding: 26px; }

  .comparison-panel {
    grid-template-columns: 1fr;
  }

  .comparison-arrow {
    margin: -2px auto;
    transform: rotate(90deg);
  }

  .translation-message p { font-size: 18px; }
}

/* Conversion architecture: solutions, account guide, and blog */
.solutions-v2-hero .seo-hero-grid {
  grid-template-columns: minmax(0, .9fr) minmax(500px, 1.1fr);
}

.solutions-v2-hero h1,
.account-buy-hero h1 {
  font-size: clamp(46px, 4vw, 58px);
  line-height: 1.03;
}

.solutions-command-media img,
.account-buy-media img {
  aspect-ratio: 16 / 10;
}

.solution-route-section {
  border-bottom: 1px solid var(--line);
  background: #fff;
}

.solution-route-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.solution-route-grid a {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  min-height: 104px;
  padding: 20px;
  border-right: 1px solid var(--line);
  transition: background .18s ease;
}

.solution-route-grid a:first-child { border-left: 1px solid var(--line); }
.solution-route-grid a:hover { background: #f2fbf8; }

.solution-route-grid > a > span {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--green), #2f78c7);
  font-size: 11px;
  font-weight: 900;
}

.solution-route-grid div { display: grid; gap: 3px; }
.solution-route-grid b { font-size: 15px; }
.solution-route-grid small { color: var(--muted); line-height: 1.35; }

.industry-solutions-section {
  background:
    linear-gradient(rgba(18, 140, 126, .025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(18, 140, 126, .025) 1px, transparent 1px),
    #fff;
  background-size: 36px 36px;
}

.industry-solution {
  display: grid;
  grid-template-columns: minmax(0, 1.06fr) minmax(380px, .94fr);
  gap: 58px;
  align-items: center;
  padding: 72px 0;
  border-bottom: 1px solid var(--line);
}

.industry-solution:last-child { border-bottom: 0; padding-bottom: 0; }
.industry-solution.reverse .industry-solution-media { order: 2; }
.industry-solution.reverse .industry-solution-copy { order: 1; }

.industry-solution-media {
  overflow: hidden;
  margin: 0;
  border: 1px solid rgba(49, 95, 159, .14);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 28px 70px rgba(31, 71, 128, .14);
}

.industry-solution-media img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}

.industry-solution-copy h2 {
  margin-bottom: 18px;
  font-size: clamp(34px, 3.6vw, 48px);
  line-height: 1.06;
}

.industry-solution-copy > p { color: var(--text); font-size: 17px; }

.industry-label {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 18px;
  color: var(--green-dark);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.industry-label span {
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border-radius: 8px;
  color: #fff;
  background: #122b3b;
}

.industry-outcome {
  margin: 24px 0;
  padding: 20px 22px;
  border-left: 4px solid var(--green);
  border-radius: 0 12px 12px 0;
  background: linear-gradient(90deg, #eefaf7, #f8fbff);
}

.industry-outcome b { display: block; margin-bottom: 6px; }
.industry-outcome p { margin-bottom: 0; color: var(--text); }

.industry-capabilities {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 0 0 20px;
  padding: 0;
  list-style: none;
}

.industry-capabilities li {
  position: relative;
  padding-left: 24px;
  color: var(--text);
  font-size: 14px;
  font-weight: 720;
}

.industry-capabilities li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 4px;
  width: 14px;
  height: 14px;
  border-radius: 4px;
  background: linear-gradient(135deg, var(--green), #38bdf8);
  box-shadow: inset 0 0 0 4px #eaf9f6;
}

.pain-solution-section {
  background:
    radial-gradient(circle at 12% 12%, rgba(18, 140, 126, .1), transparent 26%),
    radial-gradient(circle at 88% 8%, rgba(49, 95, 159, .1), transparent 24%),
    #f7fafc;
}

.pain-solution-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: 34px;
}

.pain-solution-grid article {
  min-height: 270px;
  padding: 26px;
  border: 1px solid rgba(18, 140, 126, .14);
  border-radius: 14px;
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 16px 38px rgba(17, 24, 39, .06);
}

.pain-solution-grid span {
  display: inline-flex;
  margin-bottom: 30px;
  padding: 6px 9px;
  border-radius: 7px;
  color: var(--green-dark);
  background: #e8f8f4;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.pain-solution-grid h3 { font-size: 22px; }
.pain-solution-grid p { color: var(--text); }
.pain-solution-grid a { color: var(--green-dark); font-size: 14px; font-weight: 850; }
.solution-blueprint-section { background: #fff; }

.account-buy-hero {
  background:
    radial-gradient(circle at 8% 12%, rgba(18, 140, 126, .16), transparent 28%),
    radial-gradient(circle at 92% 8%, rgba(49, 95, 159, .16), transparent 30%),
    linear-gradient(135deg, #f8fffd, #f1f7ff 68%, #fffaf0);
}

.account-buy-hero .seo-hero-grid { grid-template-columns: minmax(0, .92fr) minmax(470px, 1.08fr); }
.account-purpose-section { background: #fff; }
.account-section-lead { max-width: 720px; color: var(--text); }

.account-requirements-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 350px;
  gap: 54px;
  align-items: start;
}

.account-requirement-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 28px;
}

.account-requirement-grid article {
  min-height: 210px;
  padding: 24px;
  border: 1px solid rgba(18, 140, 126, .14);
  border-radius: 14px;
  background: #fff;
}

.account-requirement-grid span {
  display: grid;
  width: 34px;
  height: 30px;
  place-items: center;
  margin-bottom: 24px;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--green), #2f78c7);
  font-size: 11px;
  font-weight: 900;
}

.account-requirement-grid h3 { font-size: 21px; }
.account-requirement-grid p { margin-bottom: 0; color: var(--text); }

.account-support-brief {
  position: sticky;
  top: 96px;
  padding: 28px;
  border: 1px solid rgba(49, 95, 159, .18);
  border-radius: 16px;
  color: #e2e8f0;
  background: linear-gradient(145deg, #102333, #123e46);
  box-shadow: 0 24px 60px rgba(15, 23, 42, .18);
}

.account-support-brief > img {
  width: 150px;
  max-height: 44px;
  margin-bottom: 28px;
  padding: 8px 10px;
  border-radius: 8px;
  background: #fff;
  object-fit: contain;
}

.account-support-brief h3 { color: #fff; font-size: 27px; }
.account-support-brief .kicker { color: #6ee7d8; }
.account-support-brief ul { display: grid; gap: 10px; margin: 20px 0 26px; padding-left: 20px; color: #cbd5e1; }

.account-purchase-path {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 40px 0 0;
  padding: 0;
  list-style: none;
  counter-reset: none;
}

.account-purchase-path li {
  position: relative;
  min-height: 250px;
  padding: 26px 24px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  border-right: 1px solid var(--line);
  background: #fff;
}

.account-purchase-path li:first-child { border-left: 1px solid var(--line); border-radius: 14px 0 0 14px; }
.account-purchase-path li:last-child { border-radius: 0 14px 14px 0; }
.account-purchase-path > li > span { display: block; margin-bottom: 40px; color: var(--green-dark); font-size: 13px; font-weight: 900; }
.account-purchase-path h3 { font-size: 20px; }
.account-purchase-path p { margin-bottom: 0; color: var(--text); }

.store-gateway-section {
  color: #e2e8f0;
  background:
    radial-gradient(circle at 12% 20%, rgba(18, 140, 126, .3), transparent 28%),
    radial-gradient(circle at 88% 20%, rgba(56, 189, 248, .18), transparent 28%),
    #0f172a;
}

.store-gateway {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 50px;
  align-items: center;
}

.store-gateway h2 { color: #fff; max-width: 700px; }
.store-gateway p:not(.kicker) { max-width: 700px; color: #cbd5e1; }
.store-gateway-actions { display: grid; gap: 10px; min-width: 250px; }
.store-gateway-actions .button:not(.primary) { border-color: rgba(255,255,255,.3); color: #fff; background: transparent; }

/* Simplified WA account introduction */
.account-simple-hero .lead { max-width: 640px; }

.account-relationship-section {
  background:
    linear-gradient(rgba(18, 140, 126, .026) 1px, transparent 1px),
    linear-gradient(90deg, rgba(18, 140, 126, .026) 1px, transparent 1px),
    #fff;
  background-size: 38px 38px;
}

.account-relationship-section .section-heading { max-width: 850px; }

.account-product-flow {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 92px minmax(0, 1fr);
  gap: 22px;
  align-items: stretch;
  margin-top: 38px;
}

.account-product-card {
  min-height: 390px;
  padding: 34px;
  border: 1px solid rgba(18, 140, 126, .16);
  border-radius: 8px;
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 22px 54px rgba(17, 24, 39, .08);
}

.account-product-card.marketplace-card {
  background: linear-gradient(145deg, #fff, #f1fbf8);
}

.account-product-card.cloud-card {
  border-color: rgba(49, 95, 159, .16);
  background: linear-gradient(145deg, #fff, #f2f7ff);
}

.account-product-brand {
  display: flex;
  min-height: 54px;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 32px;
}

.account-product-brand img {
  width: 150px;
  max-height: 46px;
  object-fit: contain;
  object-position: left center;
}

.account-product-brand span {
  color: var(--green-dark);
  font-size: 11px;
  font-weight: 900;
  text-align: right;
  text-transform: uppercase;
}

.account-product-card h3 {
  max-width: 440px;
  margin-bottom: 12px;
  font-size: 30px;
}

.account-product-card p { color: var(--text); }

.account-product-card ul {
  display: grid;
  gap: 11px;
  margin: 24px 0 0;
  padding: 0;
  list-style: none;
}

.account-product-card li {
  position: relative;
  padding-left: 27px;
  color: var(--text);
  font-weight: 720;
}

.account-product-card li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 5px;
  width: 15px;
  height: 15px;
  border-radius: 4px;
  background: linear-gradient(135deg, var(--green), #38bdf8);
  box-shadow: inset 0 0 0 4px #eaf9f6;
}

.account-flow-connector {
  display: grid;
  place-content: center;
  gap: 8px;
  color: var(--green-dark);
  text-align: center;
}

.account-flow-connector span {
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.account-flow-connector b {
  display: grid;
  width: 54px;
  height: 54px;
  place-items: center;
  margin: auto;
  border: 1px solid rgba(18, 140, 126, .16);
  border-radius: 50%;
  color: #fff;
  background: linear-gradient(135deg, var(--green), #2f78c7);
  box-shadow: 0 15px 30px rgba(18, 140, 126, .18);
  font-size: 25px;
}

.account-use-layout {
  display: grid;
  grid-template-columns: minmax(0, .72fr) minmax(0, 1.28fr);
  gap: 60px;
  align-items: start;
}

.account-use-intro h2 { font-size: clamp(34px, 3.5vw, 46px); }
.account-use-intro p:not(.kicker) { max-width: 520px; color: var(--text); }

.account-use-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.account-use-grid article {
  min-height: 280px;
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 14px 34px rgba(17, 24, 39, .05);
}

.account-use-grid span,
.account-simple-path > li > span {
  display: grid;
  width: 38px;
  height: 34px;
  place-items: center;
  margin-bottom: 52px;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--green), #2f78c7);
  font-size: 11px;
  font-weight: 900;
}

.account-use-grid h3 { font-size: 21px; }
.account-use-grid p { margin-bottom: 0; color: var(--text); font-size: 15px; }

.account-simple-path-section { background: #fff; }

.account-simple-path {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  margin: 40px 0 0;
  padding: 0;
  list-style: none;
}

.account-simple-path li {
  position: relative;
  min-height: 265px;
  padding: 30px;
  border: 1px solid var(--line);
  border-right: 0;
  background: linear-gradient(180deg, #fff, #f9fcfd);
}

.account-simple-path li:first-child { border-radius: 8px 0 0 8px; }
.account-simple-path li:last-child { border-right: 1px solid var(--line); border-radius: 0 8px 8px 0; }
.account-simple-path h3 { font-size: 23px; }
.account-simple-path p { margin-bottom: 0; color: var(--text); }
.account-simple-path > li > span { margin-bottom: 42px; }

.blog-hero {
  padding: 76px 0;
  border-bottom: 1px solid var(--line);
  background:
    radial-gradient(circle at 10% 12%, rgba(18, 140, 126, .15), transparent 26%),
    radial-gradient(circle at 88% 16%, rgba(245, 184, 75, .14), transparent 25%),
    linear-gradient(135deg, #f8fffd, #f3f7ff 70%, #fffaf0);
}

.blog-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, .76fr) minmax(480px, 1.24fr);
  gap: 54px;
  align-items: center;
}

.blog-hero h1 { font-size: clamp(45px, 4vw, 58px); line-height: 1.04; }
.blog-topic-row { display: flex; flex-wrap: wrap; gap: 8px; }
.blog-topic-row a { padding: 8px 11px; border: 1px solid rgba(18,140,126,.16); border-radius: 8px; color: var(--green-dark); background: rgba(255,255,255,.76); font-size: 12px; font-weight: 820; }

.blog-featured-card {
  overflow: hidden;
  border: 1px solid rgba(49, 95, 159, .15);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 28px 70px rgba(31, 71, 128, .13);
}

.blog-featured-media { display: block; overflow: hidden; }
.blog-featured-media img { width: 100%; aspect-ratio: 16 / 8; object-fit: cover; transition: transform .3s ease; }
.blog-featured-card:hover .blog-featured-media img { transform: scale(1.02); }
.blog-featured-card > div { padding: 26px; }
.blog-featured-card > div > span,
.blog-card-body > span { color: var(--green-dark); font-size: 11px; font-weight: 900; text-transform: uppercase; }
.blog-featured-card h2 { margin: 8px 0 10px; font-size: 29px; }
.blog-featured-card p { color: var(--text); }

.blog-library { background: #fff; }
.blog-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 34px; }
.blog-card { overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: #fff; box-shadow: 0 16px 40px rgba(17,24,39,.07); }
.blog-card-media { display: block; overflow: hidden; }
.blog-card-media img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; transition: transform .3s ease; }
.blog-card:hover .blog-card-media img { transform: scale(1.025); }
.blog-card-body { padding: 24px; }
.blog-card-body h2 { margin: 8px 0 12px; font-size: 23px; }
.blog-card-body p { color: var(--text); }

.blog-path-section { background: #f7fafc; }
.blog-path-grid { display: grid; grid-template-columns: minmax(0, .85fr) minmax(420px, 1.15fr); gap: 54px; align-items: start; }
.blog-path-grid > div:first-child > p:not(.kicker) { color: var(--text); }
.blog-path-links { display: grid; border-top: 1px solid var(--line); }
.blog-path-links a { display: grid; grid-template-columns: 130px minmax(0, 1fr); gap: 18px; padding: 20px 4px; border-bottom: 1px solid var(--line); }
.blog-path-links span { color: var(--green-dark); font-size: 12px; font-weight: 900; text-transform: uppercase; }
.blog-path-links b { font-size: 17px; }

.article-hero {
  padding: 72px 0 170px;
  background:
    radial-gradient(circle at 12% 10%, rgba(18,140,126,.15), transparent 28%),
    radial-gradient(circle at 88% 8%, rgba(49,95,159,.14), transparent 26%),
    linear-gradient(135deg, #f8fffd, #f3f7ff 72%, #fffaf0);
}

.article-hero-inner { max-width: 920px; }
.article-hero h1 { max-width: 900px; font-size: clamp(48px, 6vw, 74px); }
.article-meta { display: flex; flex-wrap: wrap; gap: 8px; }
.article-meta span { padding: 8px 11px; border: 1px solid rgba(18,140,126,.15); border-radius: 8px; color: var(--green-dark); background: rgba(255,255,255,.8); font-size: 12px; font-weight: 820; }

.article-cover {
  overflow: hidden;
  margin-top: -112px;
  border: 8px solid #fff;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 30px 80px rgba(17,24,39,.16);
}

.article-cover img { width: 100%; aspect-ratio: 16 / 8; object-fit: cover; }
.article-layout { display: grid; grid-template-columns: 230px minmax(0, 760px); gap: 64px; justify-content: center; padding-top: 70px; padding-bottom: 90px; }
.article-toc { position: sticky; top: 94px; align-self: start; display: grid; gap: 10px; padding: 20px 0; border-top: 2px solid var(--green); border-bottom: 1px solid var(--line); }
.article-toc b { margin-bottom: 6px; }
.article-toc a { color: var(--muted); font-size: 13px; }
.article-toc a:hover { color: var(--green-dark); }
.article-content { min-width: 0; }
.article-content section { scroll-margin-top: 100px; margin-bottom: 58px; }
.article-content h2 { margin-bottom: 20px; font-size: 36px; }
.article-content h3 { margin-top: 28px; font-size: 23px; }
.article-content p,
.article-content li { color: var(--text); font-size: 17px; line-height: 1.75; }
.article-content a:not(.button) { color: var(--green-dark); font-weight: 780; text-decoration: underline; text-underline-offset: 3px; }
.article-callout { margin: 28px 0; padding: 24px 26px; border-left: 4px solid var(--green); border-radius: 0 12px 12px 0; background: #eef9f6; }
.article-callout b { display: block; margin-bottom: 10px; }
.article-callout p:last-child,
.article-callout ul:last-child { margin-bottom: 0; }
.article-steps { display: grid; gap: 10px; margin: 26px 0; padding: 0; list-style: none; }
.article-steps li { display: grid; gap: 3px; padding: 18px 20px; border: 1px solid var(--line); border-radius: 10px; background: #fff; }
.article-steps b { color: var(--ink); }
.article-steps span { color: var(--text); font-size: 15px; }
.article-factor-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
.article-factor-grid article { padding: 22px; border: 1px solid var(--line); border-radius: 12px; }
.article-factor-grid span { color: var(--green-dark); font-size: 12px; font-weight: 900; }
.article-factor-grid h3 { margin: 14px 0 8px; font-size: 20px; }
.article-factor-grid p { margin-bottom: 0; font-size: 15px; }
.article-next { display: flex; align-items: center; justify-content: space-between; gap: 26px; margin-top: 34px; padding: 26px; border: 1px solid rgba(18,140,126,.16); border-radius: 14px; background: linear-gradient(135deg,#f2fbf8,#f6f9ff); }
.article-next span { color: var(--green-dark); font-size: 11px; font-weight: 900; text-transform: uppercase; }
.article-next h3 { margin: 5px 0 0; font-size: 22px; }

.home-section-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-top: 34px;
}

.home-proof-band {
  border-bottom: 1px solid var(--line);
  background: #fff;
}

.home-proof-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.home-proof-grid > div {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 4px 13px;
  min-height: 126px;
  align-content: center;
  padding: 22px;
  border-right: 1px solid var(--line);
}

.home-proof-grid > div:first-child { border-left: 1px solid var(--line); }

.home-proof-grid span {
  grid-row: 1 / 3;
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--green), #2f78c7);
  font-size: 10px;
  font-weight: 900;
}

.home-proof-grid b { align-self: end; font-size: 15px; }
.home-proof-grid small { color: var(--muted); line-height: 1.45; }

.solution-map article {
  display: flex;
  flex-direction: column;
}

.solution-map .text-link {
  margin-top: auto;
  padding-top: 18px;
  font-size: 13px;
}

.home-solution-routes {
  display: grid;
  grid-template-columns: minmax(240px, 1.08fr) repeat(3, minmax(0, 1fr));
  overflow: hidden;
  margin-top: 38px;
  border: 1px solid rgba(49, 95, 159, .14);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 18px 46px rgba(17, 24, 39, .07);
}

.home-solution-routes-intro {
  padding: 26px;
  color: #e2e8f0;
  background:
    radial-gradient(circle at 10% 10%, rgba(18, 140, 126, .32), transparent 36%),
    #102b3b;
}

.home-solution-routes-intro .kicker { color: #72e5d4; }
.home-solution-routes-intro h3 { color: #fff; font-size: 23px; }
.home-solution-routes-intro .text-link { color: #9ceadf; }

.home-solution-routes > a {
  display: flex;
  min-height: 218px;
  flex-direction: column;
  padding: 26px;
  border-left: 1px solid var(--line);
  background: linear-gradient(180deg, #fff, #fbfdff);
  transition: background .18s ease, transform .18s ease;
}

.home-solution-routes > a:hover {
  background: #effaf7;
  transform: translateY(-2px);
}

.home-solution-routes > a span {
  margin-bottom: 36px;
  color: var(--green-dark);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.home-solution-routes > a b { font-size: 18px; line-height: 1.35; }
.home-solution-routes > a i { margin-top: auto; color: var(--green-dark); font-size: 13px; font-style: normal; font-weight: 850; }

.home-insights-section {
  border-top: 1px solid var(--line);
  background: #f8fafc;
}

.home-insights-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 30px;
  margin-bottom: 30px;
}

.home-insights-heading h2 { max-width: 720px; margin-bottom: 0; }
.home-insights-heading .text-link { margin: 0 0 8px; white-space: nowrap; }
.home-insights-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.home-insights-grid article { overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: #fff; box-shadow: 0 14px 36px rgba(17,24,39,.06); }
.home-insights-grid article > a { display: block; overflow: hidden; }
.home-insights-grid img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; transition: transform .3s ease; }
.home-insights-grid article:hover img { transform: scale(1.025); }
.home-insights-grid article > div { padding: 22px; }
.home-insights-grid span { color: var(--green-dark); font-size: 11px; font-weight: 900; text-transform: uppercase; }
.home-insights-grid h3 { margin: 8px 0 10px; font-size: 21px; }
.home-insights-grid p { margin-bottom: 0; color: var(--text); font-size: 14px; }

@media (min-width: 901px) and (max-width: 1180px) {
  .pricing-page .float-contact {
    right: 6px;
    width: 68px;
    gap: 4px;
  }

  .pricing-page .support-avatar {
    width: 64px;
    height: 64px;
  }

}

@media (min-width: 1101px) and (max-width: 1180px) {
  .pricing-offer-grid,
  .pricing-resource-layout,
  .pricing-quote-panel {
    grid-template-columns: 1fr;
  }

  .pricing-offer-grid {
    grid-template-areas:
      "flexible"
      "trial"
      "custom";
    max-width: 780px;
    margin-inline: auto;
  }

  .pricing-offer-card { min-height: 0; }

  .pricing-resource-layout,
  .pricing-quote-panel {
    max-width: 920px;
    margin-inline: auto;
  }

  .pricing-resource-intro {
    position: relative;
    top: auto;
  }

  .pricing-quote-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    min-width: 0;
  }
}

@media (max-width: 1100px) {

  .pricing-offers-section .section-heading { max-width: 780px; }

  .pricing-v2-hero .pricing-hero-grid,
  .pricing-offer-grid,
  .pricing-resource-layout,
  .pricing-quote-panel,
  .solutions-v2-hero .seo-hero-grid,
  .account-buy-hero .seo-hero-grid,
  .blog-hero-grid,
  .industry-solution,
  .account-requirements-layout,
  .account-product-flow,
  .account-use-layout,
  .blog-path-grid {
    grid-template-columns: 1fr;
  }

  .pricing-v2-hero .pricing-visual { max-width: 760px; justify-self: center; }
  .pricing-offer-grid {
    grid-template-areas:
      "flexible"
      "trial"
      "custom";
    max-width: 780px;
    margin-inline: auto;
  }
  .pricing-offer-card { min-height: 0; }
  .pricing-resource-intro { position: relative; top: auto; }
  .pricing-quote-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); min-width: 0; }

  .solutions-command-media,
  .account-buy-media,
  .blog-featured-card { max-width: 780px; }
  .industry-solution { gap: 34px; }
  .industry-solution.reverse .industry-solution-media,
  .industry-solution.reverse .industry-solution-copy { order: initial; }
  .industry-solution-media { max-width: 820px; }
  .solution-route-grid,
  .account-purchase-path { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .solution-route-grid a:nth-child(3) { border-left: 1px solid var(--line); }
  .account-support-brief { position: relative; top: auto; max-width: 620px; }
  .account-product-card { min-height: 0; max-width: 780px; }
  .account-flow-connector { min-height: 76px; }
  .account-flow-connector b { transform: rotate(90deg); }
  .account-use-grid { max-width: 900px; }
  .account-purchase-path li { border: 1px solid var(--line); border-radius: 0; }
  .account-purchase-path li:first-child { border-radius: 14px 0 0 0; }
  .account-purchase-path li:nth-child(2) { border-radius: 0 14px 0 0; }
  .account-purchase-path li:nth-child(3) { border-radius: 0 0 0 14px; }
  .account-purchase-path li:last-child { border-radius: 0 0 14px 0; }
  .blog-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-insights-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-proof-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-proof-grid > div:nth-child(3) { border-left: 1px solid var(--line); border-top: 1px solid var(--line); }
  .home-proof-grid > div:nth-child(4) { border-top: 1px solid var(--line); }
  .home-solution-routes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-solution-routes > a:nth-child(3) { border-left: 0; border-top: 1px solid var(--line); }
  .home-solution-routes > a:nth-child(4) { border-top: 1px solid var(--line); }
  .home-insights-grid article:last-child { grid-column: 1 / -1; max-width: 570px; }
  .blog-card:last-child { grid-column: 1 / -1; max-width: 570px; }
  .article-layout { grid-template-columns: 1fr; gap: 28px; }
  .article-toc { position: relative; top: auto; grid-template-columns: repeat(2, minmax(0,1fr)); }
  .article-toc b { grid-column: 1 / -1; }
}

@media (min-width: 1001px) and (max-width: 1180px) {
  .pricing-offer-grid {
    width: calc(100% - 120px);
    max-width: 1020px;
    grid-template-columns: minmax(0, .82fr) minmax(340px, 1.36fr) minmax(0, .82fr);
    grid-template-areas: "trial flexible custom";
    gap: 10px;
    margin: 12px auto 0;
  }

  .pricing-offer-card { padding: 20px; }
  .pricing-flex-card { padding: 22px; }
  .pricing-offer-card h3 { font-size: 24px; }
  .pricing-duration-options button { padding-inline: 2px; font-size: 9px; }
  .pricing-selection-summary { display: none; }
}

@media (min-width: 1101px) and (max-width: 1180px) {
  .pricing-offers-section { padding-top: 16px; }
  .pricing-offers-section .section-heading h2 { font-size: 36px; }
  .pricing-offer-grid { margin-top: 8px; }
  .pricing-plan-benefits { gap: 10px; margin-top: 18px; }
  .pricing-card-note { margin-bottom: 14px; padding-top: 14px; }
}

@media (min-width: 1001px) and (max-width: 1100px) {
  .pricing-page .float-contact { display: none; }

  .pricing-offers-section { padding-top: 10px; }
  .pricing-offers-section .section-heading .kicker { margin-bottom: 4px; }
  .pricing-offers-section .section-heading h2 { font-size: 30px; }
  .pricing-offers-section .section-heading > p:last-child { font-size: 13px; }

  .pricing-offer-grid {
    width: calc(100% - 40px);
    max-width: 970px;
    grid-template-columns: minmax(0, .82fr) minmax(400px, 1.3fr) minmax(0, .82fr);
    margin-top: 8px;
  }

  .pricing-selection-summary { display: none; }
  .pricing-offer-top { margin-bottom: 12px; }
  .pricing-configurator { margin-top: 8px; }
  .pricing-config-group { padding: 8px 0; }
  .pricing-duration-options { margin-top: 8px; }
  .pricing-duration-options button { min-height: 32px; }
  .pricing-control-row { margin-top: 8px; }
  .pricing-switch { margin-top: 8px; }
  .pricing-card-note { margin-bottom: 14px; padding-top: 14px; }
}

@media (max-width: 1000px) {
  .pricing-offer-grid {
    grid-template-columns: 1fr;
    grid-template-areas:
      "trial"
      "flexible"
      "custom";
    max-width: 780px;
    margin-inline: auto;
  }
}

@media (max-width: 760px) {
  .solution-route-grid,
  .pain-solution-grid,
  .account-requirement-grid,
  .account-purchase-path,
  .account-use-grid,
  .account-simple-path,
  .blog-card-grid,
  .article-factor-grid {
    grid-template-columns: 1fr;
  }

  .home-insights-heading { align-items: flex-start; flex-direction: column; }
  .pricing-offer-card { padding: 24px; }
  .pricing-flex-card { padding: 22px; }
  .pricing-offer-top { margin-bottom: 18px; }
  .pricing-configurator { grid-template-columns: 1fr; }
  .pricing-duration-options { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pricing-control-row { grid-template-columns: 1fr; gap: 15px; }
  .pricing-range-scale { margin-right: 0; }
  .pricing-selection-summary > div { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
  .pricing-quote-actions { grid-template-columns: 1fr; }
  .pricing-resource-explainer article { grid-template-columns: 44px minmax(0, 1fr); gap: 14px; padding: 24px 0; }
  .pricing-resource-explainer article > span { width: 40px; height: 38px; }
  .pricing-quote-actions { grid-template-columns: 1fr; }
  .home-proof-grid,
  .home-solution-routes { grid-template-columns: 1fr; }
  .home-proof-grid > div,
  .home-proof-grid > div:first-child,
  .home-proof-grid > div:nth-child(3),
  .home-proof-grid > div:nth-child(4) { min-height: 104px; border: 0; border-bottom: 1px solid var(--line); }
  .home-proof-grid > div:last-child { border-bottom: 0; }
  .home-solution-routes > a,
  .home-solution-routes > a:nth-child(3),
  .home-solution-routes > a:nth-child(4) { min-height: 170px; border: 0; border-top: 1px solid var(--line); }
  .home-solution-routes > a span { margin-bottom: 22px; }
  .home-insights-grid { grid-template-columns: 1fr; }
  .home-insights-grid article:last-child { grid-column: auto; max-width: none; }

  .solution-route-grid a,
  .solution-route-grid a:first-child,
  .solution-route-grid a:nth-child(3) { min-height: 88px; border-right: 1px solid var(--line); border-left: 1px solid var(--line); border-bottom: 1px solid var(--line); }
  .industry-solution { padding: 50px 0; }
  .industry-solution-copy h2 { font-size: 33px; }
  .industry-capabilities { grid-template-columns: 1fr; }
  .pain-solution-grid article { min-height: 0; }
  .account-purchase-path li,
  .account-purchase-path li:first-child,
  .account-purchase-path li:nth-child(2),
  .account-purchase-path li:nth-child(3),
  .account-purchase-path li:last-child { min-height: 0; border-radius: 0; }
  .account-purchase-path li:first-child { border-radius: 14px 14px 0 0; }
  .account-purchase-path li:last-child { border-radius: 0 0 14px 14px; }
  .account-product-card { padding: 26px; }
  .account-product-brand { align-items: flex-start; flex-direction: column; margin-bottom: 24px; }
  .account-product-brand span { text-align: left; }
  .account-use-layout { gap: 30px; }
  .account-use-grid article { min-height: 0; }
  .account-use-grid span { margin-bottom: 30px; }
  .account-simple-path li,
  .account-simple-path li:first-child,
  .account-simple-path li:last-child { min-height: 0; border: 1px solid var(--line); border-bottom: 0; border-radius: 0; }
  .account-simple-path li:first-child { border-radius: 8px 8px 0 0; }
  .account-simple-path li:last-child { border-bottom: 1px solid var(--line); border-radius: 0 0 8px 8px; }
  .account-simple-path > li > span { margin-bottom: 26px; }
  .store-gateway { grid-template-columns: 1fr; gap: 26px; }
  .store-gateway-actions { min-width: 0; }
  .blog-hero { padding: 54px 0; }
  .blog-hero h1,
  .article-hero h1 { font-size: 39px; }
  .blog-featured-card h2 { font-size: 24px; }
  .blog-card:last-child { grid-column: auto; max-width: none; }
  .blog-path-links a { grid-template-columns: 1fr; gap: 6px; }
  .article-hero { padding: 54px 0 118px; }
  .article-cover { width: calc(100% - 28px); margin-top: -74px; border-width: 5px; border-radius: 14px; }
  .article-cover img { aspect-ratio: 4 / 3; }
  .article-layout { padding-top: 48px; padding-bottom: 60px; }
  .article-toc { grid-template-columns: 1fr; }
  .article-toc b { grid-column: auto; }
  .article-content h2 { font-size: 30px; }
  .article-content p,
  .article-content li { font-size: 16px; }
  .article-next { align-items: stretch; flex-direction: column; }
}

/* 2026 product-site visual refinement */
.home-proof-band { position: relative; z-index: 2; background: linear-gradient(180deg, #fff, #f8fbfd); box-shadow: 0 18px 48px rgba(15,39,52,.05); }
.home-proof-grid > div { position: relative; grid-template-columns: 56px minmax(0,1fr); gap: 5px 15px; min-height: 138px; padding: 24px 20px; transition: background .2s ease; }
.home-proof-grid > div:hover { background: rgba(232,248,245,.58); }
.home-proof-grid .home-proof-icon { position: relative; grid-row: 1 / 3; display: grid; width: 52px; height: 52px; place-items: center; overflow: visible; border: 1px solid rgba(18,140,126,.22); border-radius: 8px; color: #0f665c; background: linear-gradient(145deg,#fff,#e8f8f4); box-shadow: 0 12px 25px rgba(18,140,126,.13); }
.home-proof-grid .home-proof-icon::before { content: ""; position: absolute; inset: 5px; border: 1px solid rgba(49,95,159,.1); border-radius: 5px; }
.home-proof-grid .home-proof-icon svg { position: relative; z-index: 1; width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.home-proof-grid .home-proof-icon i { position: absolute; right: -7px; bottom: -7px; z-index: 2; display: grid; width: 23px; height: 20px; place-items: center; border: 2px solid #fff; border-radius: 5px; color: #fff; background: #17384a; font-size: 8px; font-style: normal; font-weight: 900; }
.home-proof-grid b { font-size: 16px; line-height: 1.25; }
.home-proof-grid small { font-size: 12px; }
.solution-index { position: relative; align-self: flex-start; margin-bottom: 20px; padding: 7px 11px 7px 27px; border: 1px solid rgba(25,88,111,.12); border-radius: 6px; color: #17384a; background: linear-gradient(90deg,#f6fbfd,#eef8f6); box-shadow: inset 3px 0 #22ad9a; font-size: 11px; letter-spacing: 0; }
.solution-index::before { content: ""; position: absolute; left: 12px; top: 50%; width: 6px; height: 6px; border-radius: 50%; background: #22ad9a; box-shadow: 0 0 0 4px rgba(34,173,154,.11); transform: translateY(-50%); }
.home-solution-routes { grid-template-columns: minmax(280px,1.18fr) repeat(3,minmax(0,1fr)); border-color: rgba(15,52,70,.22); background: #102b3b; box-shadow: 0 24px 60px rgba(15,39,52,.15); }
.home-solution-routes-intro { position: relative; overflow: hidden; padding: 30px; background: linear-gradient(135deg,rgba(67,218,196,.18),transparent 52%),#102b3b; }
.home-solution-routes-intro::after { content: ""; position: absolute; right: -44px; bottom: -58px; width: 150px; height: 150px; border: 1px solid rgba(125,224,209,.18); border-radius: 50%; }
.home-solution-routes-intro > * { position: relative; z-index: 1; }
.home-solution-routes-intro > p:not(.kicker) { margin: -3px 0 18px; color: #b9c9d3; font-size: 13px; line-height: 1.55; }
.home-solution-routes > a { position: relative; min-height: 238px; padding: 28px 24px; border-left-color: rgba(255,255,255,.12); color: #e5edf2; background: linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.012)); transform: none; }
.home-solution-routes > a:hover { color: #fff; background: linear-gradient(180deg,rgba(50,184,165,.2),rgba(255,255,255,.035)); transform: none; }
.home-solution-routes > a svg { width: 34px; height: 34px; margin-bottom: 25px; padding: 7px; border: 1px solid rgba(125,224,209,.24); border-radius: 7px; color: #8ee6d8; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.home-solution-routes > a span { margin-bottom: 9px; color: #8ee6d8; }
.home-solution-routes > a b { color: #fff; }
.home-solution-routes > a i { color: #a8e9df; }
.footer-logo { filter: brightness(0) invert(1); opacity: .96; }
.footer a.footer-featured { display: flex; width: 100%; max-width: 120px; justify-content: center; margin-left: 0; margin-right: 0; text-align: center; }

@media (max-width: 1100px) {
  .home-solution-routes { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .home-solution-routes > a { min-height: 206px; }
}

@media (max-width: 760px) {
  .home-proof-grid > div,
  .home-proof-grid > div:first-child,
  .home-proof-grid > div:nth-child(3),
  .home-proof-grid > div:nth-child(4) { grid-template-columns: 52px minmax(0,1fr); min-height: 116px; padding: 20px 18px; }
  .home-proof-grid .home-proof-icon { width: 48px; height: 48px; }
  .home-solution-routes { grid-template-columns: 1fr; }
  .home-solution-routes > a,
  .home-solution-routes > a:nth-child(3),
  .home-solution-routes > a:nth-child(4) { min-height: 182px; border-top-color: rgba(255,255,255,.12); }
  .home-solution-routes > a svg { margin-bottom: 17px; }
}

.pricing-offers-section .section-heading > p { max-width: 720px; margin-inline: auto; }
.pricing-duration-options { grid-template-columns: repeat(4,minmax(0,1fr)); }
.pricing-duration-options button { font-size: 11px; }

.pricing-resource-explainer article { grid-template-columns: 62px minmax(0,1fr); align-items: start; }
.pricing-resource-explainer article > .pricing-resource-icon {
  position: relative;
  display: grid;
  width: 56px;
  height: 56px;
  place-items: center;
  overflow: visible;
  border: 1px solid rgba(18,140,126,.2);
  border-radius: 8px;
  color: #0d7165;
  background: linear-gradient(145deg,#fff,#eaf8f5);
  box-shadow: 0 12px 28px rgba(18,140,126,.11);
}
.pricing-resource-icon svg { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.pricing-resource-icon i { position: absolute; right: -5px; bottom: -6px; display: grid; width: 23px; height: 20px; place-items: center; border: 2px solid #f7fafc; border-radius: 5px; color: #fff; background: #17384a; font-size: 8px; font-style: normal; font-weight: 900; }

.pricing-quote-section { position: relative; overflow: hidden; }
.pricing-quote-section::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px); background-size: 36px 36px; }
.pricing-quote-panel { position: relative; grid-template-columns: minmax(0,1fr) minmax(250px,.58fr) 250px; gap: 30px; }
.pricing-quote-copy h2 { margin-bottom: 13px; font-size: clamp(32px,3.5vw,47px); }
.pricing-custom-visual { display: grid; border-top: 1px solid rgba(255,255,255,.18); }
.pricing-custom-visual > div { display: grid; grid-template-columns: 40px minmax(0,1fr); gap: 12px; align-items: center; padding: 14px 2px; border-bottom: 1px solid rgba(255,255,255,.18); }
.pricing-custom-visual svg { width: 36px; height: 36px; padding: 8px; border: 1px solid rgba(111,231,216,.3); border-radius: 7px; color: #7ce0d1; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.pricing-custom-visual span { display: grid; }
.pricing-custom-visual small { color: #7ce0d1; font-size: 10px; font-weight: 850; text-transform: uppercase; }
.pricing-custom-visual b { color: #fff; font-size: 14px; }
.pricing-tailored-actions { align-content: center; }

@media (max-width: 1100px) {
  .pricing-v2-hero .pricing-visual { width: 100%; max-width: 560px; }
  .pricing-quote-panel { grid-template-columns: minmax(0,1fr) minmax(250px,.72fr); }
  .pricing-quote-copy { grid-column: 1 / -1; }
}

@media (max-width: 760px) {
  .pricing-duration-options { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .pricing-resource-explainer article { grid-template-columns: 54px minmax(0,1fr); }
  .pricing-resource-explainer article > .pricing-resource-icon { width: 48px; height: 48px; }
  .pricing-quote-panel { grid-template-columns: 1fr; }
  .pricing-quote-copy { grid-column: auto; }
}

.account-buy-media { border-color: rgba(18,140,126,.2); background: #eaf8f6; box-shadow: 0 30px 70px rgba(19,73,86,.16); }
.account-buy-media img { aspect-ratio: 5 / 4; object-fit: cover; object-position: center; }
.account-buy-proof { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); max-width: 650px; }
.account-buy-proof span { justify-content: flex-start; min-height: 38px; }

.account-product-flow { position: relative; }
.account-product-card { position: relative; overflow: hidden; }
.account-product-card::after { content: ""; position: absolute; right: -62px; bottom: -72px; width: 180px; height: 180px; border: 1px solid rgba(18,140,126,.11); border-radius: 50%; pointer-events: none; }
.account-product-step { display: inline-flex; margin-bottom: 18px; padding: 6px 9px; border: 1px solid rgba(18,140,126,.15); border-radius: 6px; color: #0b6f64; background: rgba(255,255,255,.72); font-size: 10px; font-weight: 900; text-transform: uppercase; }
.account-product-brand { margin-bottom: 22px; }
.account-flow-connector { position: relative; }
.account-flow-connector::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 1px; background: linear-gradient(90deg,transparent,#49bbaa,transparent); }
.account-flow-connector > * { position: relative; z-index: 1; }
.account-flow-connector span { padding: 3px 7px; background: #fff; }

.account-use-grid article { position: relative; overflow: hidden; min-height: 292px; padding-top: 28px; }
.account-use-grid article::after { content: ""; position: absolute; left: 24px; right: 24px; top: 94px; height: 1px; background: linear-gradient(90deg,rgba(18,140,126,.22),transparent); }
.account-use-grid span.account-number-icon,
.account-simple-path > li > span.account-number-icon { position: relative; display: grid; width: 52px; height: 52px; place-items: center; overflow: visible; margin-bottom: 54px; border: 1px solid rgba(18,140,126,.19); border-radius: 8px; color: #0d7165; background: linear-gradient(145deg,#fff,#eaf8f5); box-shadow: 0 12px 28px rgba(18,140,126,.12); }
.account-number-icon svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; }
.account-number-icon i { position: absolute; right: -6px; bottom: -6px; display: grid; width: 23px; height: 20px; place-items: center; border: 2px solid #fff; border-radius: 5px; color: #fff; background: #17384a; font-size: 8px; font-style: normal; font-weight: 900; }
.account-simple-path { gap: 12px; }
.account-simple-path li,
.account-simple-path li:first-child,
.account-simple-path li:last-child { overflow: hidden; border: 1px solid var(--line); border-radius: 8px; }
.account-simple-path li::before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 4px; background: linear-gradient(90deg,#22ad9a,#315f9f); }

.store-gateway-section { position: relative; overflow: hidden; }
.store-gateway-section::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px); background-size: 38px 38px; }
.store-gateway { position: relative; z-index: 1; grid-template-columns: minmax(0,1fr) minmax(300px,.72fr) 250px; gap: 30px; }
.store-gateway-visual { display: grid; gap: 0; }
.store-gateway-visual span { display: grid; padding: 11px 14px; border: 1px solid rgba(125,224,209,.24); border-radius: 7px; color: #7ce0d1; background: rgba(255,255,255,.045); font-size: 10px; font-weight: 850; text-transform: uppercase; }
.store-gateway-visual b { margin-top: 2px; color: #fff; font-size: 13px; text-transform: none; }
.store-gateway-visual i { width: 1px; height: 10px; margin-left: 24px; background: #4bc2b1; }

@media (max-width: 1100px) {
  .store-gateway { grid-template-columns: minmax(0,1fr) minmax(280px,.75fr); }
  .store-gateway > div:first-child { grid-column: 1 / -1; }
}

@media (max-width: 760px) {
  .account-buy-proof { grid-template-columns: 1fr; }
  .account-use-grid article { min-height: 0; }
  .account-use-grid span.account-number-icon,
  .account-simple-path > li > span.account-number-icon { margin-bottom: 36px; }
  .account-simple-path { gap: 0; }
  .account-simple-path li,
  .account-simple-path li:first-child,
  .account-simple-path li:last-child { border-radius: 0; }
  .account-simple-path li:first-child { border-radius: 8px 8px 0 0; }
  .account-simple-path li:last-child { border-radius: 0 0 8px 8px; }
  .store-gateway { grid-template-columns: 1fr; }
  .store-gateway > div:first-child { grid-column: auto; }
}

.solution-route-section { padding: 34px 0; border-bottom: 1px solid rgba(18,140,126,.13); background: linear-gradient(180deg,#fff,#f5f9fb); }
.solution-route-shell { display: grid; grid-template-columns: minmax(270px,.68fr) minmax(0,1.32fr); overflow: hidden; border: 1px solid rgba(15,52,70,.18); border-radius: 8px; background: #102b3b; box-shadow: 0 24px 58px rgba(15,39,52,.13); }
.solution-route-intro { position: relative; overflow: hidden; padding: 34px; background: linear-gradient(145deg,rgba(36,184,164,.18),transparent 58%); }
.solution-route-intro::after { content: ""; position: absolute; left: -64px; bottom: -90px; width: 210px; height: 210px; border: 1px solid rgba(125,224,209,.16); border-radius: 50%; }
.solution-route-intro > * { position: relative; z-index: 1; }
.solution-route-intro .kicker { color: #77dfd0; }
.solution-route-intro h2 { color: #fff; font-size: 29px; line-height: 1.12; }
.solution-route-intro > p:not(.kicker) { margin-bottom: 0; color: #b7c8d2; font-size: 14px; }
.solution-route-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); border-left: 1px solid rgba(255,255,255,.12); }
.solution-route-grid a,
.solution-route-grid a:first-child,
.solution-route-grid a:nth-child(3) { position: relative; display: grid; grid-template-columns: 48px minmax(0,1fr) 22px; gap: 14px; align-items: start; min-height: 174px; padding: 26px; border: 0; border-right: 1px solid rgba(255,255,255,.11); border-bottom: 1px solid rgba(255,255,255,.11); color: #e4edf2; background: rgba(255,255,255,.025); transition: background .18s ease; }
.solution-route-grid a:nth-child(3),
.solution-route-grid a:nth-child(4) { border-bottom: 0; }
.solution-route-grid a:hover { background: rgba(50,184,165,.15); }
.solution-route-grid > a > span.solution-route-icon { display: grid; width: 46px; height: 46px; place-items: center; border: 1px solid rgba(125,224,209,.25); border-radius: 8px; color: #83e3d5; background: rgba(255,255,255,.04); }
.solution-route-icon svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.solution-route-grid a > div { display: grid; gap: 3px; }
.solution-route-grid small { color: #75dccc; font-size: 9px; font-weight: 900; text-transform: uppercase; }
.solution-route-grid b { color: #fff; font-size: 17px; line-height: 1.25; }
.solution-route-grid p { margin: 5px 0 0; color: #b8c8d3; font-size: 12px; line-height: 1.45; }
.solution-route-grid a > i { align-self: center; color: #84e2d4; font-size: 18px; font-style: normal; transition: transform .18s ease; }
.solution-route-grid a:hover > i { transform: translateX(3px); }

.pain-solution-grid article { position: relative; display: flex; min-height: 292px; flex-direction: column; overflow: hidden; padding: 24px; border-radius: 8px; box-shadow: 0 16px 40px rgba(16,44,59,.07); }
.pain-solution-grid article::before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 4px; background: linear-gradient(90deg,#22ad9a,#315f9f); }
.pain-solution-grid span { display: inline-flex; align-self: flex-start; align-items: center; gap: 7px; margin-bottom: 25px; padding: 6px 9px; border: 1px solid rgba(18,140,126,.13); border-radius: 6px; color: #17384a; background: #f2faf8; }
.pain-solution-grid span svg { width: 17px; height: 17px; color: #128c7e; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.pain-solution-grid p { margin-bottom: 20px; }
.pain-solution-grid a { display: inline-flex; align-items: center; gap: 6px; margin-top: auto; }
.pain-solution-grid a::after { content: "\2192"; }

@media (max-width: 1100px) {
  .solution-route-shell { grid-template-columns: 1fr; }
  .solution-route-grid { border-top: 1px solid rgba(255,255,255,.12); border-left: 0; }
  .solution-route-intro { padding: 30px; }
}

@media (max-width: 760px) {
  .solution-route-section { padding: 22px 0; }
  .solution-route-intro { padding: 25px 22px; }
  .solution-route-intro h2 { font-size: 25px; }
  .solution-route-grid { grid-template-columns: 1fr; }
  .solution-route-grid a,
  .solution-route-grid a:first-child,
  .solution-route-grid a:nth-child(3),
  .solution-route-grid a:nth-child(4) { min-height: 148px; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.11); }
  .solution-route-grid a:last-child { border-bottom: 0; }
  .pain-solution-grid article { min-height: 0; }
}

.blog-topic-row span { display: inline-flex; align-items: center; gap: 7px; padding: 8px 11px; border: 1px solid rgba(18,140,126,.16); border-radius: 7px; color: #17384a; background: rgba(255,255,255,.76); font-size: 12px; font-weight: 820; }
.blog-topic-row span::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #22ad9a; box-shadow: 0 0 0 3px rgba(34,173,154,.11); }
.blog-library-heading { display: grid; grid-template-columns: minmax(0,1fr) minmax(430px,.9fr); gap: 40px; align-items: end; }
.blog-library-heading .section-heading { margin-bottom: 0; }
.blog-library-heading .section-heading > p:last-child { color: var(--text); }
.blog-filters { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.blog-filters button { min-height: 38px; padding: 8px 12px; border: 1px solid rgba(18,140,126,.16); border-radius: 7px; color: #385164; background: #fff; font: inherit; font-size: 12px; font-weight: 820; cursor: pointer; transition: color .18s ease,background .18s ease,border-color .18s ease; }
.blog-filters button:hover { border-color: rgba(18,140,126,.34); color: #0b6f64; }
.blog-filters button[aria-pressed="true"] { border-color: #17384a; color: #fff; background: #17384a; box-shadow: 0 9px 20px rgba(23,56,74,.15); }
.blog-card-grid { align-items: stretch; margin-top: 30px; }
.blog-card { display: flex; min-height: 100%; flex-direction: column; border-radius: 8px; }
.blog-card[hidden] { display: none; }
.blog-card-media img { aspect-ratio: 16 / 9; background: #edf7f5; }
.blog-card-body { display: flex; flex: 1; flex-direction: column; }
.blog-card-meta { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.blog-card-meta > span { color: var(--green-dark); font-size: 10px; font-weight: 900; text-transform: uppercase; }
.blog-card-meta > small { color: var(--muted); font-size: 11px; white-space: nowrap; }
.blog-card-body h2 { font-size: 21px; line-height: 1.28; }
.blog-card-body > p { font-size: 14px; }
.blog-card-body .text-link { margin-top: auto; padding-top: 6px; }

@media (max-width: 1100px) {
  .blog-library-heading { grid-template-columns: 1fr; gap: 22px; }
  .blog-filters { justify-content: flex-start; }
  .blog-card:last-child { grid-column: auto; max-width: none; }
}

@media (max-width: 760px) {
  .blog-filters { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .blog-filters button { padding-inline: 8px; }
  .blog-card-grid { grid-template-columns: 1fr; }
}

/* Homepage alignment refinements */
.home-proof-grid > div {
  display: flex;
  min-height: 145px;
  flex-direction: column;
  justify-content: center;
  padding-left: 91px;
}

.home-proof-grid .home-proof-icon {
  position: absolute;
  left: 22px;
  top: 50%;
  grid-row: auto;
  flex: 0 0 auto;
  transform: translateY(-50%);
}

.home-proof-grid b { display: block; margin-bottom: 5px; }
.home-proof-grid small { display: block; }

.footer-grid > div:nth-child(2) {
  min-width: 150px;
  text-align: center;
}

.footer-grid > div:nth-child(2) a { margin-left: auto; margin-right: auto; }
.footer-grid > div:nth-child(2) a.footer-featured { width: 120px; max-width: 120px; }

@media (max-width: 760px) {
  .home-proof-grid > div,
  .home-proof-grid > div:first-child,
  .home-proof-grid > div:nth-child(3),
  .home-proof-grid > div:nth-child(4) { min-height: 122px; padding-left: 84px; }
  .home-proof-grid .home-proof-icon { left: 18px; }
}

/* Compact decision path for the flexible pricing plan */
.pricing-flex-card .pricing-configurator {
  display: flex;
  gap: 0;
  flex-direction: column;
  margin-top: 14px;
}

.pricing-flex-card .pricing-config-group {
  display: grid;
  grid-template-columns: minmax(150px, .9fr) minmax(185px, 1.1fr);
  gap: 10px 15px;
  align-items: center;
  padding: 13px 0;
}

.pricing-flex-card .pricing-config-legend {
  grid-template-columns: 30px minmax(0, 1fr);
  gap: 9px;
  align-items: center;
}

.pricing-flex-card .pricing-config-legend > span:first-child {
  width: 28px;
  height: 28px;
  border: 1px solid rgba(142, 230, 216, .42);
  color: #9bf0e3;
  background: rgba(142, 230, 216, .1);
}

.pricing-flex-card .pricing-config-legend b { font-size: 13px; line-height: 1.25; }
.pricing-flex-card .pricing-config-legend small { margin-top: 3px; font-size: 10px; line-height: 1.35; }

.pricing-flex-card .pricing-duration-options {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 0;
}

.pricing-flex-card .pricing-control-row,
.pricing-flex-card .pricing-config-group:not(:first-of-type) .pricing-control-row {
  grid-template-columns: minmax(0, 1fr) 104px;
  gap: 9px;
  margin-top: 0;
}

.pricing-flex-card .pricing-range-scale,
.pricing-flex-card .pricing-config-group:not(:first-of-type) .pricing-range-scale {
  grid-column: 2;
  margin: -4px 113px 0 0;
}

.pricing-flex-card .pricing-switch,
.pricing-flex-card .pricing-translation-controls {
  grid-column: 2;
}

.pricing-flex-card .pricing-switch { margin-top: 0; }
.pricing-flex-card .pricing-translation-controls { width: 100%; }
.pricing-flex-card .pricing-translation-controls .pricing-range-scale { grid-column: auto; }
.pricing-flex-card .pricing-quote-actions { margin-top: auto; padding-top: 13px; border-top: 1px solid rgba(255, 255, 255, .16); }

/* Enterprise quote section uses a complete scene instead of another icon list. */
.pricing-quote-panel {
  grid-template-columns: minmax(0, 1fr) minmax(270px, .72fr) 250px;
  align-items: center;
}

.pricing-quote-copy h2 { max-width: 720px; }

.pricing-tailored-proof {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 22px;
}

.pricing-tailored-proof span {
  padding: 7px 10px;
  border: 1px solid rgba(124, 224, 209, .26);
  border-radius: 6px;
  color: #b9f0e8;
  background: rgba(124, 224, 209, .07);
  font-size: 11px;
  font-weight: 800;
}

.pricing-custom-visual {
  position: relative;
  display: block;
  min-height: 230px;
  overflow: hidden;
  margin: 0;
  border: 1px solid rgba(124, 224, 209, .2);
  border-radius: 8px;
  background: #0a2432;
  box-shadow: 0 24px 52px rgba(1, 11, 18, .32);
}

.pricing-custom-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .05);
}

.pricing-custom-visual img {
  display: block;
  width: 100%;
  height: 230px;
  object-fit: cover;
  object-position: center;
}

@media (max-width: 1100px) {
  .pricing-quote-panel { grid-template-columns: minmax(0, 1fr) 250px; }
  .pricing-quote-copy { grid-column: 1 / -1; }
  .pricing-custom-visual { min-height: 210px; }
  .pricing-custom-visual img { height: 210px; }
}

@media (max-width: 760px) {
  .pricing-flex-card .pricing-config-group { grid-template-columns: 1fr; gap: 10px; }
  .pricing-flex-card .pricing-duration-options,
  .pricing-flex-card .pricing-control-row,
  .pricing-flex-card .pricing-config-group:not(:first-of-type) .pricing-control-row,
  .pricing-flex-card .pricing-switch,
  .pricing-flex-card .pricing-translation-controls,
  .pricing-flex-card .pricing-range-scale,
  .pricing-flex-card .pricing-config-group:not(:first-of-type) .pricing-range-scale {
    grid-column: auto;
  }
  .pricing-flex-card .pricing-range-scale,
  .pricing-flex-card .pricing-config-group:not(:first-of-type) .pricing-range-scale { margin: -3px 113px 0 0; }
  .pricing-quote-panel { grid-template-columns: 1fr; }
  .pricing-quote-copy { grid-column: auto; }
  .pricing-custom-visual { min-height: 215px; }
  .pricing-custom-visual img { height: 215px; }
}

/* Shared workflow journey */
.account-flow-connector {
  display: flex;
  min-width: 92px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.account-flow-connector::before { display: none; }

.account-flow-connector span,
.account-flow-connector b {
  position: relative;
  z-index: 1;
  padding: 0;
  color: #24675f;
  background: transparent;
  font-size: 9px;
  font-weight: 900;
  line-height: 1.25;
  text-align: center;
  text-transform: uppercase;
}

.account-flow-connector b {
  display: block;
  width: auto;
  height: auto;
  margin: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.account-delivery-track {
  position: relative;
  width: 78px;
  height: 42px;
  overflow: hidden;
  border: 1px solid rgba(18, 140, 126, .2);
  border-radius: 21px;
  background: linear-gradient(90deg, #eefaf7, #edf5fb);
  box-shadow: inset 0 0 0 5px rgba(255, 255, 255, .72), 0 10px 26px rgba(18, 92, 103, .1);
}

.account-delivery-track::before {
  content: "";
  position: absolute;
  left: 12px;
  right: 12px;
  top: 50%;
  height: 2px;
  background: linear-gradient(90deg, #1baa99, #3c7fbd);
  transform: translateY(-50%);
}

.account-delivery-track i {
  position: absolute;
  top: 50%;
  width: 8px;
  height: 8px;
  border: 2px solid #fff;
  border-radius: 50%;
  background: #22ad9a;
  box-shadow: 0 2px 8px rgba(15, 73, 86, .24);
  transform: translate(-50%, -50%);
}

.account-delivery-track i:nth-child(1) { left: 18px; }
.account-delivery-track i:nth-child(2) { left: 50%; background: #36a4b6; }
.account-delivery-track i:nth-child(3) { left: calc(100% - 18px); background: #315f9f; }

.account-use-grid article:first-child .account-number-icon {
  margin-left: auto;
  margin-right: auto;
}

.account-journey-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(340px, .92fr);
  gap: 44px;
  align-items: center;
  margin-top: 40px;
}

.account-journey-visual {
  position: relative;
  overflow: hidden;
  margin: 0;
  border: 1px solid rgba(18, 140, 126, .17);
  border-radius: 8px;
  background: #e7f6f3;
  box-shadow: 0 26px 62px rgba(19, 67, 82, .14);
}

.account-journey-visual img {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
}

.account-journey-visual figcaption {
  position: absolute;
  left: 16px;
  right: 16px;
  bottom: 16px;
  display: grid;
  grid-template-columns: auto auto minmax(34px, 1fr) auto auto;
  gap: 8px;
  align-items: center;
  padding: 12px 14px;
  border: 1px solid rgba(255, 255, 255, .62);
  border-radius: 7px;
  background: rgba(255, 255, 255, .9);
  box-shadow: 0 10px 30px rgba(18, 53, 68, .13);
  backdrop-filter: blur(10px);
}

.account-journey-visual figcaption span { color: var(--green-dark); font-size: 10px; font-weight: 900; text-transform: uppercase; }
.account-journey-visual figcaption b { color: var(--ink); font-size: 12px; }
.account-journey-visual figcaption i { height: 1px; background: linear-gradient(90deg, #22ad9a, #315f9f); }

.account-journey-layout .account-simple-path {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  margin: 0;
  border-top: 1px solid var(--line);
}

.account-journey-layout .account-simple-path li,
.account-journey-layout .account-simple-path li:first-child,
.account-journey-layout .account-simple-path li:last-child {
  display: grid;
  min-height: 0;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 17px;
  align-items: start;
  padding: 22px 0;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
}

.account-journey-layout .account-simple-path li::before { display: none; }

.account-journey-layout .account-simple-path > li > span {
  display: grid;
  width: 38px;
  height: 36px;
  place-items: center;
  margin: 0;
  border: 1px solid rgba(18, 140, 126, .2);
  border-radius: 6px;
  color: #0b6f64;
  background: linear-gradient(145deg, #fff, #e9f8f5);
  box-shadow: 0 8px 20px rgba(18, 140, 126, .09);
  font-size: 10px;
  font-weight: 900;
}

.account-journey-layout .account-simple-path h3 { margin-bottom: 5px; font-size: 20px; }
.account-journey-layout .account-simple-path p { font-size: 14px; line-height: 1.55; }

.store-gateway-visual {
  position: relative;
  display: block;
  min-height: 230px;
  overflow: hidden;
  margin: 0;
  border: 1px solid rgba(125, 224, 209, .22);
  border-radius: 8px;
  background: #102c3a;
  box-shadow: 0 22px 52px rgba(0, 8, 15, .3);
}

.store-gateway-visual img {
  display: block;
  width: 100%;
  height: 230px;
  object-fit: cover;
}

@media (max-width: 1100px) {
  .account-flow-connector { min-height: 100px; }
  .account-flow-connector b { transform: none; }
  .account-delivery-track { width: 42px; height: 72px; }
  .account-delivery-track::before { left: 50%; right: auto; top: 12px; bottom: 12px; width: 2px; height: auto; transform: translateX(-50%); }
  .account-delivery-track i { left: 50%; top: auto; transform: translate(-50%, -50%); }
  .account-delivery-track i:nth-child(1) { left: 50%; top: 18px; }
  .account-delivery-track i:nth-child(2) { left: 50%; top: 50%; }
  .account-delivery-track i:nth-child(3) { left: 50%; top: calc(100% - 18px); }
  .account-journey-layout { grid-template-columns: minmax(0, 1fr) minmax(300px, .8fr); gap: 28px; }
}

@media (max-width: 760px) {
  .account-journey-layout { grid-template-columns: 1fr; gap: 22px; }
  .account-journey-visual figcaption { grid-template-columns: auto minmax(0, 1fr); }
  .account-journey-visual figcaption i { display: none; }
  .account-journey-visual figcaption span:nth-of-type(2) { border-top: 1px solid var(--line); padding-top: 7px; }
  .account-journey-visual figcaption b:last-child { border-top: 1px solid var(--line); padding-top: 7px; }
  .account-journey-layout .account-simple-path { gap: 0; }
  .account-journey-layout .account-simple-path li,
  .account-journey-layout .account-simple-path li:first-child,
  .account-journey-layout .account-simple-path li:last-child { border-left: 0; border-right: 0; }
  .store-gateway-visual,
  .store-gateway-visual img { min-height: 215px; height: 215px; }
}

/* Solution selection by operating problem */
.pain-solution-layout {
  display: grid;
  grid-template-columns: minmax(280px, .62fr) minmax(0, 1.38fr);
  gap: 54px;
  align-items: start;
}

.pain-solution-layout > .section-heading {
  position: sticky;
  top: 104px;
  margin: 0;
  text-align: left;
}

.pain-solution-layout > .section-heading h2 { font-size: clamp(34px, 3.5vw, 46px); }
.pain-solution-layout > .section-heading p:not(.kicker) { max-width: 430px; color: var(--text); }

.pain-solution-layout .pain-solution-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 0;
}

.pain-solution-layout .pain-solution-grid article {
  min-height: 255px;
  padding: 26px;
  border-color: rgba(18, 140, 126, .13);
  background: linear-gradient(155deg, #fff, #f8fbfc);
}

.pain-solution-layout .pain-solution-grid article::before {
  top: 0;
  bottom: 0;
  width: 4px;
  height: auto;
  background: linear-gradient(180deg, #22ad9a, #315f9f);
}

.pain-solution-layout .pain-solution-grid span {
  margin-bottom: 20px;
  padding: 0;
  border: 0;
  color: #147669;
  background: transparent;
  letter-spacing: .04em;
}

.pain-solution-layout .pain-solution-grid span svg { display: none; }
.pain-solution-layout .pain-solution-grid h3 { margin-bottom: 10px; font-size: 21px; }
.pain-solution-layout .pain-solution-grid p { font-size: 14px; line-height: 1.58; }
.solution-blueprint > div h2 { font-size: clamp(32px, 3.2vw, 43px); line-height: 1.07; }

@media (max-width: 1100px) {
  .pain-solution-layout { grid-template-columns: 1fr; gap: 32px; }
  .pain-solution-layout > .section-heading { position: static; max-width: 760px; }
}

@media (max-width: 760px) {
  .pain-solution-layout .pain-solution-grid { grid-template-columns: 1fr; }
  .pain-solution-layout .pain-solution-grid article { min-height: 0; }
}

@media (max-width: 1280px) {
  .blog-library-heading { grid-template-columns: 1fr; gap: 22px; }
  .blog-library-heading .section-heading { max-width: 780px; }
  .blog-filters { justify-content: flex-start; }
}

/* Final conversion and visual alignment refinements */
.home-proof-grid > div b,
.home-proof-grid > div small {
  width: 100%;
  align-self: stretch;
  text-align: center;
}

.pricing-offer-grid {
  grid-template-columns: minmax(0, .78fr) minmax(430px, 1.44fr) minmax(0, .78fr);
  gap: 16px;
}

.pricing-flex-card .pricing-config-group {
  padding: 12px;
  border: 1px solid rgba(142, 230, 216, .16);
  border-radius: 7px;
  background: rgba(255, 255, 255, .035);
}

.pricing-flex-card .pricing-config-group + .pricing-config-group { margin-top: 8px; }
.pricing-flex-card .pricing-config-group:hover { border-color: rgba(142, 230, 216, .3); }
.pricing-flex-card .pricing-quote-actions { margin-top: 10px; }

.pricing-quote-panel {
  grid-template-columns: minmax(300px, .78fr) minmax(460px, 1.22fr);
  grid-template-areas:
    "copy visual"
    "actions visual";
  gap: 18px 42px;
  align-items: stretch;
}

.pricing-quote-copy {
  grid-area: copy;
  align-self: end;
}

.pricing-tailored-actions {
  grid-area: actions;
  align-self: start;
  width: 100%;
  max-width: 390px;
}

.pricing-custom-visual {
  grid-area: visual;
  min-height: 370px;
  height: 100%;
}

.pricing-custom-visual img {
  min-height: 370px;
  height: 100%;
  object-position: center;
}

.account-use-grid article .account-number-icon {
  margin-right: auto;
  margin-left: auto;
}

.store-gateway {
  grid-template-columns: minmax(320px, .82fr) minmax(460px, 1.18fr);
  grid-template-areas:
    "copy visual"
    "actions visual";
  gap: 18px 40px;
  min-height: 400px;
  align-items: stretch;
}

.store-gateway > div:first-child {
  grid-area: copy;
  grid-column: auto;
  align-self: end;
}

.store-gateway-actions {
  grid-area: actions;
  align-self: start;
  max-width: 390px;
}

.store-gateway-visual {
  grid-area: visual;
  min-height: 370px;
  height: 100%;
  overflow: visible;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.store-gateway-visual::before {
  content: "";
  position: absolute;
  inset: 8% 2% 4% 10%;
  border-radius: 50%;
  background: rgba(48, 190, 172, .18);
  filter: blur(46px);
}

.store-gateway-visual img {
  position: relative;
  min-height: 370px;
  height: 100%;
  border-radius: 8px;
  object-position: center;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 14%, #000 100%);
  mask-image: linear-gradient(90deg, transparent 0, #000 14%, #000 100%);
}

.solution-route-grid a,
.solution-route-grid a:first-child,
.solution-route-grid a:nth-child(3) {
  align-content: center;
  align-items: center;
}

.pain-solution-layout .pain-solution-grid article {
  display: flex;
  min-height: 208px;
  flex-direction: column;
  padding: 18px 21px;
}

.pain-solution-layout .pain-solution-grid span { margin-bottom: 8px; font-size: 10px; }
.pain-solution-layout .pain-solution-grid h3 { margin-bottom: 5px; font-size: 19px; line-height: 1.24; }
.pain-solution-layout .pain-solution-grid p { margin-bottom: 11px; font-size: 13px; line-height: 1.46; }
.pain-solution-layout .pain-solution-grid a { margin-top: auto; font-size: 13px; }

.solution-blueprint {
  grid-template-columns: minmax(230px, .72fr) minmax(300px, 1.08fr) minmax(300px, 1fr);
  grid-template-areas: "copy visual steps";
  gap: 28px;
  align-items: stretch;
  padding: 34px;
  border: 1px solid rgba(81, 214, 195, .16);
  border-radius: 12px;
  box-shadow: 0 30px 70px rgba(5, 21, 32, .18);
}

.solution-blueprint-copy {
  grid-area: copy;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
}

.solution-blueprint-copy .button { margin-top: 8px; }

.solution-blueprint-visual {
  position: relative;
  grid-area: visual;
  min-height: 360px;
  overflow: hidden;
  margin: 0;
  border: 1px solid rgba(133, 226, 213, .2);
  border-radius: 8px;
  background: #081b2d;
  box-shadow: 0 24px 52px rgba(0, 9, 18, .32);
}

.solution-blueprint-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .04);
}

.solution-blueprint-visual img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 360px;
  object-fit: cover;
  object-position: center;
}

.solution-blueprint .process-list {
  grid-area: steps;
  align-content: center;
}

.solution-blueprint .process-list li {
  min-height: 76px;
  border-color: rgba(130, 225, 211, .16);
  background: linear-gradient(90deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, .035));
}

@media (min-width: 1001px) and (max-width: 1180px) {
  .pricing-offer-grid {
    grid-template-columns: minmax(0, .78fr) minmax(400px, 1.44fr) minmax(0, .78fr);
  }
}

@media (max-width: 1100px) {
  .pricing-quote-panel {
    grid-template-columns: minmax(300px, .82fr) minmax(420px, 1.18fr);
    grid-template-areas:
      "copy visual"
      "actions visual";
    gap: 18px 30px;
  }

  .pricing-quote-copy { grid-column: auto; }
  .pricing-custom-visual,
  .pricing-custom-visual img { min-height: 330px; }

  .store-gateway {
    grid-template-columns: minmax(300px, .82fr) minmax(420px, 1.18fr);
    grid-template-areas:
      "copy visual"
      "actions visual";
    gap: 18px 28px;
  }

  .store-gateway > div:first-child { grid-column: auto; }
  .store-gateway-visual,
  .store-gateway-visual img { min-height: 330px; }

  .solution-blueprint {
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
    grid-template-areas:
      "copy copy"
      "visual steps";
  }
}

@media (max-width: 1000px) {
  .pricing-offer-grid {
    grid-template-columns: 1fr;
    grid-template-areas:
      "trial"
      "flexible"
      "custom";
  }
}

@media (max-width: 820px) {
  .pricing-quote-panel,
  .store-gateway {
    grid-template-columns: 1fr;
    grid-template-areas:
      "copy"
      "visual"
      "actions";
  }

  .pricing-custom-visual,
  .pricing-custom-visual img,
  .store-gateway-visual,
  .store-gateway-visual img { min-height: 245px; height: 245px; }

  .store-gateway-visual img {
    -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 12%, #000 100%);
    mask-image: linear-gradient(180deg, transparent 0, #000 12%, #000 100%);
  }
}

@media (max-width: 760px) {
  .home-proof-grid > div b,
  .home-proof-grid > div small { text-align: left; }

  .pricing-flex-card .pricing-config-group { padding: 12px; }
  .pricing-tailored-actions,
  .store-gateway-actions { max-width: none; }

  .solution-blueprint {
    grid-template-columns: 1fr;
    grid-template-areas:
      "copy"
      "visual"
      "steps";
    gap: 22px;
    padding: 24px;
  }

  .solution-blueprint-visual,
  .solution-blueprint-visual img { min-height: 220px; height: 220px; }
}

/* Refined alignment, plan builder, and integrated conversion panels */
.home-proof-grid > div {
  padding-right: 20px;
  padding-left: 20px;
}

.home-proof-grid > div b {
  box-sizing: border-box;
  width: 100%;
  align-self: stretch;
  padding-right: 62px;
  padding-left: 62px;
  text-align: center;
}

.home-proof-grid > div small {
  width: auto;
  align-self: stretch;
  margin-left: 71px;
  text-align: left;
}

.pricing-flex-intro {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 142px;
  gap: 18px;
  align-items: start;
}

.pricing-flex-intro h3 { margin-bottom: 6px; }
.pricing-flex-intro p { margin: 0; color: #cbd5e1; font-size: 13px; line-height: 1.5; }

.pricing-flex-status {
  position: relative;
  display: grid;
  gap: 2px;
  padding: 12px 12px 12px 30px;
  border: 1px solid rgba(143, 238, 223, .25);
  border-radius: 7px;
  background: rgba(6, 29, 39, .34);
}

.pricing-flex-status i {
  position: absolute;
  left: 12px;
  top: 16px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #70dfcf;
  box-shadow: 0 0 0 5px rgba(112, 223, 207, .1);
}

.pricing-flex-status small { color: #83e6d7; font-size: 9px; font-weight: 900; text-transform: uppercase; }
.pricing-flex-status b { color: #fff; font-size: 11px; line-height: 1.35; }
.pricing-flex-card .pricing-configurator { margin-top: 16px; }

.pricing-flex-card .pricing-config-group {
  position: relative;
  overflow: hidden;
  border-color: rgba(142, 230, 216, .18);
  background: linear-gradient(90deg, rgba(255, 255, 255, .055), rgba(255, 255, 255, .025));
}

.pricing-flex-card .pricing-config-group::before {
  content: "";
  position: absolute;
  left: 0;
  top: 12px;
  bottom: 12px;
  width: 2px;
  border-radius: 2px;
  background: linear-gradient(180deg, #71dfcf, rgba(84, 132, 190, .72));
}

.pricing-flex-card .pricing-config-legend b { font-size: 14px; }
.pricing-flex-card .pricing-config-legend small { color: #b9cbd4; }

.pricing-flex-card .pricing-selection-summary {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  margin: 9px 0 10px;
  padding: 10px 12px;
  border-color: rgba(142, 230, 216, .25);
  background: rgba(3, 18, 27, .42);
}

.pricing-flex-card .pricing-selection-summary > div { gap: 0; }
.pricing-flex-card .pricing-selection-summary p { padding: 1px 10px; border-left: 1px solid rgba(255, 255, 255, .13); }
.pricing-flex-card .pricing-selection-summary small { font-size: 9px; }
.pricing-flex-card .pricing-selection-summary b { font-size: 12px; }

.pricing-quote-section {
  padding: 76px 0;
  background: linear-gradient(180deg, #f5f9fb, #eaf4f5);
}

.pricing-quote-panel {
  position: relative;
  display: grid;
  min-height: 520px;
  overflow: hidden;
  grid-template-columns: minmax(0, 500px) minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr) auto;
  grid-template-areas:
    "copy ."
    "actions .";
  gap: 0;
  align-items: stretch;
  padding: 0;
  border: 1px solid rgba(65, 208, 189, .2);
  border-radius: 12px;
  background: #071827;
  box-shadow: 0 34px 80px rgba(8, 31, 46, .22);
}

.pricing-quote-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(3, 14, 25, .18) 0, transparent 54%),
    linear-gradient(180deg, transparent 66%, rgba(2, 12, 22, .24));
}

.pricing-quote-copy {
  position: relative;
  z-index: 2;
  grid-area: copy;
  align-self: end;
  max-width: 470px;
  padding: 54px 0 18px 50px;
}

.pricing-quote-copy h2 {
  max-width: 440px;
  margin-bottom: 17px;
  font-size: clamp(38px, 4vw, 53px);
  line-height: 1.02;
}

.pricing-quote-copy p:not(.kicker) { max-width: 425px; font-size: 16px; line-height: 1.58; }
.pricing-tailored-proof { gap: 7px; margin-top: 20px; }

.pricing-custom-visual {
  position: absolute;
  inset: 0;
  z-index: 0;
  min-height: 100%;
  height: 100%;
  overflow: hidden;
  margin: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.pricing-custom-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(3, 15, 26, .34) 0, rgba(3, 15, 26, .08) 42%, transparent 68%);
  box-shadow: none;
}

.pricing-custom-visual img {
  width: 100%;
  min-height: 0;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.pricing-tailored-actions {
  position: relative;
  z-index: 2;
  grid-area: actions;
  width: auto;
  max-width: 430px;
  align-self: start;
  padding: 0 0 52px 50px;
}

.store-gateway-section {
  color: var(--ink);
  background:
    radial-gradient(circle at 9% 12%, rgba(35, 181, 161, .14), transparent 28%),
    radial-gradient(circle at 92% 84%, rgba(49, 95, 159, .1), transparent 28%),
    linear-gradient(145deg, #effaf7, #f7fbff 58%, #fff);
}

.store-gateway-section::after {
  background:
    linear-gradient(90deg, rgba(18, 140, 126, .04) 1px, transparent 1px),
    linear-gradient(rgba(18, 140, 126, .04) 1px, transparent 1px);
  background-size: 42px 42px;
}

.store-gateway {
  grid-template-columns: minmax(0, 1.16fr) minmax(330px, .84fr);
  grid-template-areas: "visual copy";
  gap: 54px;
  min-height: 0;
  align-items: center;
}

.store-gateway-copy {
  position: relative;
  z-index: 2;
  grid-area: copy;
}

.store-gateway-brand {
  display: block;
  width: 150px;
  height: 42px;
  margin-bottom: 24px;
  object-fit: contain;
  object-position: left center;
}

.store-gateway h2 {
  max-width: 480px;
  margin-bottom: 16px;
  color: var(--ink);
  font-size: clamp(38px, 4vw, 52px);
  line-height: 1.04;
}

.store-gateway p:not(.kicker) { max-width: 480px; color: var(--text); font-size: 16px; line-height: 1.62; }

.store-gateway-actions {
  display: grid;
  max-width: 390px;
  grid-template-columns: 1fr;
  gap: 10px;
  margin-top: 26px;
}

.store-gateway-actions .button:not(.primary) {
  border-color: rgba(15, 23, 42, .2);
  color: var(--ink);
  background: rgba(255, 255, 255, .72);
}

.store-gateway-visual {
  position: relative;
  grid-area: visual;
  min-height: 440px;
  height: 440px;
  overflow: hidden;
  margin: 0;
  border: 1px solid rgba(18, 140, 126, .16);
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 30px 70px rgba(18, 65, 79, .16);
}

.store-gateway-visual::before { display: none; }

.store-gateway-visual img {
  width: 100%;
  min-height: 0;
  height: 100%;
  border-radius: 0;
  object-fit: cover;
  object-position: center;
  -webkit-mask-image: none;
  mask-image: none;
}

.store-gateway-visual figcaption {
  position: absolute;
  right: 16px;
  bottom: 16px;
  left: 16px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  padding: 10px;
  border: 1px solid rgba(255, 255, 255, .7);
  border-radius: 8px;
  background: rgba(255, 255, 255, .9);
  box-shadow: 0 14px 34px rgba(17, 54, 69, .14);
  backdrop-filter: blur(12px);
}

.store-gateway-visual figcaption span {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  gap: 7px;
  align-items: center;
  padding: 7px 8px;
  border: 0;
  border-radius: 6px;
  color: var(--ink);
  background: #f2faf8;
  text-transform: none;
}

.store-gateway-visual figcaption small {
  display: grid;
  width: 24px;
  height: 24px;
  place-items: center;
  border-radius: 5px;
  color: #fff;
  background: linear-gradient(135deg, #18a693, #315f9f);
  font-size: 8px;
  font-weight: 900;
}

.store-gateway-visual figcaption b { margin: 0; color: var(--ink); font-size: 11px; }

@media (max-width: 1180px) {
  .pricing-flex-card .pricing-selection-summary { display: none; }
}

@media (max-width: 1100px) {
  .pricing-quote-panel {
    min-height: 480px;
    grid-template-columns: minmax(0, 440px) minmax(0, 1fr);
    grid-template-areas:
      "copy ."
      "actions .";
    gap: 0;
  }

  .pricing-quote-copy { grid-column: auto; padding: 40px 0 16px 36px; }
  .pricing-tailored-actions { padding: 0 0 40px 36px; }
  .pricing-custom-visual,
  .pricing-custom-visual img { min-height: 0; height: 100%; }

  .store-gateway {
    grid-template-columns: minmax(0, 1.05fr) minmax(330px, .95fr);
    grid-template-areas: "visual copy";
    gap: 32px;
  }

  .store-gateway-visual,
  .store-gateway-visual img { min-height: 390px; height: 390px; }
}

@media (max-width: 820px) {
  .pricing-quote-section { padding: 56px 0; background: #eef5f6; }

  .pricing-quote-panel {
    min-height: 0;
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    grid-template-areas:
      "copy"
      "visual"
      "actions";
    gap: 22px;
    padding: 26px;
  }

  .pricing-quote-copy { max-width: none; padding: 0; }
  .pricing-quote-copy h2 { font-size: 38px; }
  .pricing-custom-visual {
    position: relative;
    inset: auto;
    grid-area: visual;
    min-height: 250px;
    height: 250px;
    border: 1px solid rgba(125, 224, 209, .18);
    border-radius: 8px;
  }
  .pricing-custom-visual img { min-height: 250px; height: 250px; }
  .pricing-custom-visual::after { background: linear-gradient(180deg, transparent 50%, rgba(3, 15, 26, .22)); }
  .pricing-tailored-actions { width: 100%; max-width: none; padding: 0; }

  .store-gateway {
    grid-template-columns: 1fr;
    grid-template-areas:
      "copy"
      "visual";
    gap: 30px;
  }

  .store-gateway-visual,
  .store-gateway-visual img { min-height: 300px; height: 300px; }
}

@media (max-width: 760px) {
  .home-proof-grid > div,
  .home-proof-grid > div:first-child,
  .home-proof-grid > div:nth-child(3),
  .home-proof-grid > div:nth-child(4) {
    padding-right: 18px;
    padding-left: 18px;
  }

  .home-proof-grid > div b {
    padding-right: 48px;
    padding-left: 48px;
    text-align: center;
  }

  .home-proof-grid > div small {
    margin-left: 66px;
    text-align: left;
  }

  .pricing-flex-intro { grid-template-columns: 1fr; }
  .pricing-flex-status { display: none; }
  .pricing-flex-card .pricing-selection-summary { display: none; }

  .store-gateway-brand { width: 136px; margin-bottom: 20px; }
  .store-gateway h2 { font-size: 38px; }
  .store-gateway-visual,
  .store-gateway-visual img { min-height: 250px; height: 250px; }
  .store-gateway-visual figcaption { right: 10px; bottom: 10px; left: 10px; gap: 5px; padding: 7px; }
  .store-gateway-visual figcaption span { grid-template-columns: 22px minmax(0, 1fr); gap: 5px; padding: 6px; }
  .store-gateway-visual figcaption small { width: 20px; height: 20px; }
  .store-gateway-visual figcaption b { font-size: 9px; }
}

@media (min-width: 901px) and (max-width: 1350px) {
  .home-page .float-contact,
  .pricing-page .float-contact,
  .seo-page .float-contact,
  .float-contact {
    top: 54%;
    right: 12px;
    bottom: auto;
    left: auto;
    display: grid;
    width: auto;
    grid-template-columns: 1fr;
    gap: 7px;
    padding: 0;
    transform: translateY(-50%);
  }

  .float-contact > .support-avatar,
  .float-contact > a { display: none; margin-top: 0; }

  .float-contact.open {
    width: 220px;
    padding: 10px;
    border: 1px solid rgba(15, 23, 42, .12);
    border-radius: 10px;
    background: rgba(255, 255, 255, .97);
    box-shadow: 0 20px 46px rgba(15, 23, 42, .2);
    backdrop-filter: blur(14px);
  }

  .float-contact.open > a { display: block; }

  .float-contact-toggle {
    display: flex;
    width: 58px;
    min-height: 58px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 6px;
    overflow: hidden;
    border: 1px solid rgba(15, 23, 42, .12);
    border-radius: 50%;
    color: #fff;
    background: #fff;
    box-shadow: 0 13px 30px rgba(15, 23, 42, .2);
    font: inherit;
    cursor: pointer;
  }

  .float-contact-toggle img {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    object-fit: cover;
  }

  .float-contact-toggle span {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
  }

  .float-contact.open .float-contact-toggle {
    width: 100%;
    min-height: 52px;
    justify-content: flex-start;
    padding: 3px 10px 3px 4px;
    border-radius: 8px;
    color: var(--ink);
    box-shadow: none;
  }

  .float-contact.open .float-contact-toggle span {
    position: static;
    width: auto;
    height: auto;
    overflow: visible;
    clip: auto;
    white-space: normal;
    font-size: 14px;
    font-weight: 850;
  }
}

/* Homepage proof alignment, flexible-duration input, and editorial blog system */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.home-proof-grid > div,
.home-proof-grid > div:first-child,
.home-proof-grid > div:nth-child(3),
.home-proof-grid > div:nth-child(4) {
  display: flex;
  min-height: 170px;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 7px;
  padding: 20px 14px;
  text-align: center;
}

.home-proof-grid .home-proof-icon {
  position: relative;
  left: auto;
  top: auto;
  grid-row: auto;
  flex: 0 0 auto;
  transform: none;
}

.home-proof-grid > div b {
  width: 100%;
  margin: 2px 0 0;
  padding: 0;
  font-size: 14px;
  line-height: 1.25;
  text-align: center;
  white-space: nowrap;
}

.home-proof-grid > div small {
  width: 100%;
  max-width: 230px;
  margin: 0;
  font-size: 12px;
  line-height: 1.42;
  text-align: center;
}

.pricing-custom-duration {
  display: grid;
  grid-column: 2;
  grid-template-columns: minmax(0, 1fr) 118px;
  gap: 10px;
  align-items: center;
  margin-top: 8px;
  color: #dce8ee;
  font-size: 11px;
  font-weight: 800;
}

.pricing-custom-duration[hidden] { display: none; }
.pricing-custom-duration > span:first-child { color: #b9cbd4; }
.pricing-custom-duration .pricing-number-control { min-height: 38px; }
.pricing-custom-duration .pricing-number-control input { height: 36px; }
.pricing-quote-actions .pricing-wa-quote { white-space: nowrap; }

.blog-featured-card { border-radius: 8px; }
.blog-featured-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 7px 14px;
  margin: 15px 0 17px;
  color: #667d8d;
  font-size: 11px;
  font-weight: 720;
}

.blog-featured-meta span + time,
.blog-featured-meta time + span { position: relative; }
.blog-featured-meta span + time::before,
.blog-featured-meta time + span::before {
  content: "";
  position: absolute;
  left: -8px;
  top: 50%;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: #8fa2af;
  transform: translateY(-50%);
}

.blog-editorial-strip {
  border-bottom: 1px solid var(--line);
  background: #fff;
}

.blog-editorial-strip .container {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.blog-editorial-strip .container > div {
  display: grid;
  gap: 4px;
  min-height: 106px;
  align-content: center;
  padding: 22px 30px;
  border-left: 1px solid var(--line);
}

.blog-editorial-strip .container > div:last-child { border-right: 1px solid var(--line); }
.blog-editorial-strip b { color: var(--ink); font-size: 14px; }
.blog-editorial-strip span { color: var(--muted); font-size: 12px; line-height: 1.45; }

.blog-topic-hub-section {
  border-bottom: 1px solid var(--line);
  background:
    linear-gradient(90deg, rgba(18, 140, 126, .035) 1px, transparent 1px),
    linear-gradient(rgba(18, 140, 126, .035) 1px, transparent 1px),
    #f4f8fa;
  background-size: 40px 40px;
}

.blog-topic-hub-section .section-heading > p:last-child { max-width: 740px; margin-inline: auto; color: var(--text); }
.blog-topic-hub-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-top: 34px;
}

.blog-topic-hub-grid > a {
  display: flex;
  min-height: 225px;
  flex-direction: column;
  padding: 24px;
  border: 1px solid rgba(23, 56, 74, .12);
  border-radius: 8px;
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 16px 34px rgba(17, 42, 58, .06);
  transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.blog-topic-hub-grid > a:hover {
  border-color: rgba(18, 140, 126, .38);
  transform: translateY(-3px);
  box-shadow: 0 22px 44px rgba(17, 42, 58, .1);
}

.blog-topic-hub-grid span {
  display: grid;
  width: 36px;
  height: 32px;
  place-items: center;
  margin-bottom: 28px;
  border: 1px solid rgba(18, 140, 126, .2);
  border-radius: 6px;
  color: #0f6d63;
  background: #eaf8f5;
  font-size: 10px;
  font-weight: 900;
}

.blog-topic-hub-grid h3 { margin-bottom: 9px; font-size: 20px; }
.blog-topic-hub-grid p { margin-bottom: 18px; color: var(--text); font-size: 13px; line-height: 1.55; }
.blog-topic-hub-grid b { margin-top: auto; color: var(--green-dark); font-size: 12px; }

.blog-library-heading { align-items: start; }
.blog-library-tools { display: grid; gap: 12px; }
.blog-search {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 10px;
  min-height: 48px;
  align-items: center;
  padding: 0 15px;
  border: 1px solid rgba(23, 56, 74, .16);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(17, 42, 58, .05);
}

.blog-search:focus-within { border-color: #1ba390; box-shadow: 0 0 0 3px rgba(27, 163, 144, .12); }
.blog-search svg { width: 20px; height: 20px; fill: none; stroke: #577081; stroke-width: 1.8; stroke-linecap: round; }
.blog-search input { width: 100%; height: 44px; border: 0; outline: 0; color: var(--ink); background: transparent; font: inherit; font-size: 14px; }
.blog-search input::placeholder { color: #8799a5; }
.blog-filters button span { margin-left: 4px; opacity: .7; font-size: 10px; }
.blog-card-author { display: block; margin: 2px 0 12px; color: #718796; font-size: 11px; font-weight: 720; }
.blog-card-body .blog-card-author + .text-link { padding-top: 0; }
.blog-no-results { margin: 34px 0 0; padding: 28px; border: 1px dashed rgba(23, 56, 74, .2); color: var(--text); text-align: center; }

.blog-method-section { color: #fff; background: #0b2030; }
.blog-method-grid {
  display: grid;
  grid-template-columns: minmax(260px, 1.15fr) repeat(3, minmax(0, .8fr));
  gap: 0;
  border-top: 1px solid rgba(255, 255, 255, .14);
  border-bottom: 1px solid rgba(255, 255, 255, .14);
}

.blog-method-grid > div { min-height: 220px; padding: 30px; border-left: 1px solid rgba(255, 255, 255, .14); }
.blog-method-grid > div:last-child { border-right: 1px solid rgba(255, 255, 255, .14); }
.blog-method-grid > div:first-child { display: flex; justify-content: center; flex-direction: column; }
.blog-method-grid h2 { color: #fff; font-size: clamp(28px, 3vw, 40px); }
.blog-method-grid span { color: #72dfcf; font-size: 10px; font-weight: 900; text-transform: uppercase; }
.blog-method-grid h3 { margin: 38px 0 9px; color: #fff; font-size: 18px; }
.blog-method-grid p { margin: 0; color: #b9cbd6; font-size: 13px; line-height: 1.58; }

@media (max-width: 1100px) {
  .blog-topic-hub-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .blog-method-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .blog-method-grid > div:nth-child(3) { border-top: 1px solid rgba(255, 255, 255, .14); }
  .blog-method-grid > div:nth-child(4) { border-top: 1px solid rgba(255, 255, 255, .14); border-right: 1px solid rgba(255, 255, 255, .14); }
}

@media (max-width: 760px) {
  .pricing-custom-duration { grid-column: 1 / -1; }
  .pricing-quote-actions .pricing-wa-quote { font-size: 12px; }
  .blog-editorial-strip .container { grid-template-columns: 1fr; }
  .blog-editorial-strip .container > div { min-height: 86px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
  .blog-editorial-strip .container > div:last-child { border-bottom: 0; }
  .blog-topic-hub-grid { grid-template-columns: 1fr; }
  .blog-topic-hub-grid > a { min-height: 190px; }
  .blog-method-grid { grid-template-columns: 1fr; }
  .blog-method-grid > div { min-height: 0; border-right: 1px solid rgba(255, 255, 255, .14); border-bottom: 1px solid rgba(255, 255, 255, .14); }
  .blog-method-grid > div:last-child { border-bottom: 0; }
  .blog-method-grid h3 { margin-top: 24px; }
}

@media (max-width: 560px) {
  .home-proof-grid { grid-template-columns: 1fr; }
  .home-proof-grid > div,
  .home-proof-grid > div:first-child,
  .home-proof-grid > div:nth-child(3),
  .home-proof-grid > div:nth-child(4) { min-height: 148px; border-left: 1px solid var(--line); border-top: 1px solid var(--line); }
  .home-proof-grid > div:first-child { border-top: 0; }
  .home-proof-grid > div b { font-size: 15px; }
  .blog-filters { grid-template-columns: 1fr 1fr; }
}

/* Compliance-led product roadmap and brand-neutral product visuals */
.home-page .solution-visual {
  aspect-ratio: 16 / 8.7;
  overflow: hidden;
  border: 1px solid rgba(23, 56, 74, .1);
  border-radius: 8px;
  background: #eaf4f8;
  box-shadow: 0 18px 46px rgba(17, 42, 58, .11);
}

.home-page .solution-visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.product-roadmap-section {
  position: relative;
  overflow: hidden;
  border-top: 1px solid rgba(23, 56, 74, .08);
  border-bottom: 1px solid rgba(23, 56, 74, .08);
  background:
    linear-gradient(90deg, rgba(22, 157, 141, .035) 1px, transparent 1px),
    linear-gradient(rgba(22, 157, 141, .035) 1px, transparent 1px),
    #f6f9fa;
  background-size: 44px 44px;
}

.roadmap-heading {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(320px, .72fr);
  gap: 48px;
  align-items: end;
  margin-bottom: 34px;
}

.roadmap-heading > div:first-child > p:last-child {
  max-width: 720px;
  margin: 0;
  color: var(--text);
}

.roadmap-heading h2 { max-width: 760px; margin-bottom: 14px; }

.responsible-messaging-card {
  display: grid;
  gap: 8px;
  padding: 23px 24px;
  border: 1px solid rgba(114, 223, 207, .18);
  border-radius: 8px;
  color: #eaf4f6;
  background: #102b3a;
  box-shadow: 0 18px 40px rgba(11, 32, 48, .16);
}

.responsible-messaging-card span {
  color: #73dfcf;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.responsible-messaging-card b { color: #fff; font-size: 16px; line-height: 1.4; }
.responsible-messaging-card p { margin: 0; color: #b9cbd5; font-size: 12px; line-height: 1.55; }

.roadmap-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid rgba(23, 56, 74, .13);
  border-left: 1px solid rgba(23, 56, 74, .13);
}

.roadmap-grid article {
  position: relative;
  min-height: 238px;
  padding: 26px 23px 24px;
  border-right: 1px solid rgba(23, 56, 74, .13);
  border-bottom: 1px solid rgba(23, 56, 74, .13);
  background: rgba(255, 255, 255, .94);
  transition: background .18s ease, transform .18s ease, box-shadow .18s ease;
}

.roadmap-grid article:hover {
  z-index: 1;
  background: #fff;
  transform: translateY(-3px);
  box-shadow: 0 18px 36px rgba(17, 42, 58, .09);
}

.roadmap-grid article:nth-child(4n + 2)::before,
.roadmap-grid article:nth-child(4n + 4)::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: #2f77d0;
}

.roadmap-grid article:nth-child(4n + 3)::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: #d89535;
}

.roadmap-grid article:nth-child(4n + 1)::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: #169d8d;
}

.roadmap-status {
  display: inline-flex;
  min-height: 24px;
  align-items: center;
  padding: 0 8px;
  border: 1px solid rgba(23, 56, 74, .12);
  border-radius: 4px;
  color: #526b7a;
  background: #f4f7f8;
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
}

.roadmap-grid i {
  position: absolute;
  top: 24px;
  right: 22px;
  color: #9aaab4;
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
}

.roadmap-grid h3 { margin: 8px 0 10px; padding-right: 30px; font-size: 19px; }
.roadmap-grid p { margin: 0; color: var(--text); font-size: 13px; line-height: 1.58; }

.home-page .trial-media img,
.home-page .operations-visibility-media img {
  object-position: center;
}

.home-page .trial-media img { filter: saturate(.92) contrast(.98); }
.home-page .operations-visibility-media { border-radius: 8px; }
.home-page .operations-visibility-media img { aspect-ratio: 16 / 9; }

@media (max-width: 1100px) {
  .roadmap-heading { grid-template-columns: 1fr; gap: 24px; align-items: start; }
  .responsible-messaging-card { max-width: 760px; }
  .roadmap-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .roadmap-grid { grid-template-columns: 1fr; }
  .roadmap-grid article { min-height: 0; padding: 23px 21px; }
  .roadmap-grid h3 { margin-top: 8px; }
}

.future-solution-section {
  border-bottom: 1px solid rgba(23, 56, 74, .1);
  background: #f3f7f8;
}

.future-solution-heading {
  display: flex;
  gap: 28px;
  align-items: end;
  justify-content: space-between;
  margin-bottom: 28px;
}

.future-solution-heading > div { max-width: 780px; }
.future-solution-heading h2 { margin-bottom: 12px; }
.future-solution-heading p:last-child { margin: 0; color: var(--text); }
.future-solution-heading > .button { flex: 0 0 auto; }

.future-solution-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid rgba(23, 56, 74, .14);
  border-left: 1px solid rgba(23, 56, 74, .14);
}

.future-solution-grid article {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 15px;
  min-height: 214px;
  padding: 25px 21px;
  border-right: 1px solid rgba(23, 56, 74, .14);
  border-bottom: 1px solid rgba(23, 56, 74, .14);
  background: #fff;
}

.future-solution-grid article > span {
  display: grid;
  width: 34px;
  height: 32px;
  place-items: center;
  border-radius: 6px;
  color: #0d7064;
  background: #dff5f1;
  font-size: 10px;
  font-weight: 900;
}

.future-solution-grid h3 { margin: 3px 0 9px; font-size: 18px; }
.future-solution-grid p { margin: 0 0 18px; color: var(--text); font-size: 13px; line-height: 1.55; }
.future-solution-grid small { color: #557181; font-size: 10px; font-weight: 850; text-transform: uppercase; }

@media (max-width: 1100px) {
  .future-solution-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .future-solution-heading { align-items: flex-start; flex-direction: column; }
  .future-solution-grid { grid-template-columns: 1fr; }
  .future-solution-grid article { min-height: 0; }
}

.language-switch {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.language-switch-trigger {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  padding: 0 14px;
  border: 1px solid #d7dde3;
  border-radius: 8px;
  background: #fff;
  color: #2f3a45;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .02em;
  cursor: pointer;
  line-height: 1;
}

.language-switch-trigger:hover,
.language-switch.is-open .language-switch-trigger {
  border-color: #c5ced6;
  background: #f8fafb;
}

.language-switch-icon {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
}

.language-switch-menu {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 40;
  min-width: 148px;
  padding: 8px;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(23, 56, 74, .16);
}

.language-switch-option {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  padding: 0 12px;
  border-radius: 8px;
  color: #24323d;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}

.language-switch-option:hover {
  background: #f3f6f8;
}

.language-switch-option.is-active {
  color: #111827;
}

.language-switch-check {
  width: 14px;
  color: #111827;
  font-size: 13px;
  font-weight: 800;
  text-align: center;
}

.language-switch-option:not(.is-active) .language-switch-check {
  display: none;
}

.language-switch-option:not(.is-active) {
  padding-left: 34px;
}

.zh-site {
  font-family: Inter, "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", Arial, sans-serif;
}
.zh-site .button,
.zh-site .nav-links a,
.zh-site h1,
.zh-site h2,
.zh-site h3 { letter-spacing: 0; }

/* Chinese homepage growth layout */
.home-refresh {
  --gh-navy: #0c2638;
  --gh-navy-soft: #173d52;
  --gh-teal: #0d9f8d;
  --gh-mint: #72dfcf;
  --gh-coral: #ff8b72;
  --gh-ice: #eef7f8;
  --gh-line: rgba(21, 60, 78, .13);
  color: var(--gh-navy);
}

.home-refresh .section { padding: 98px 0; }

.gh-hero {
  position: relative;
  overflow: hidden;
  padding: 78px 0 0;
  background:
    linear-gradient(125deg, rgba(255,255,255,.96) 0%, rgba(243,250,250,.92) 47%, rgba(237,245,251,.9) 100%);
}

.gh-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(13, 159, 141, .045) 1px, transparent 1px),
    linear-gradient(rgba(13, 159, 141, .045) 1px, transparent 1px);
  background-size: 54px 54px;
  mask-image: linear-gradient(to bottom, #000 0%, transparent 78%);
}

.gh-hero::after {
  content: "";
  position: absolute;
  width: 520px;
  height: 520px;
  top: -260px;
  right: 6%;
  border: 1px solid rgba(13, 159, 141, .12);
  border-radius: 50%;
  box-shadow: 0 0 0 90px rgba(13, 159, 141, .025), 0 0 0 180px rgba(49, 95, 159, .02);
}

.gh-hero-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(390px, .82fr) minmax(580px, 1.18fr);
  gap: 38px;
  align-items: center;
  min-height: 590px;
}

.gh-hero-copy { padding: 8px 0 58px; }
.gh-hero-copy .kicker {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-height: 38px;
  margin-bottom: 18px;
  padding: 0 13px;
  border: 1px solid rgba(13, 159, 141, .25);
  border-radius: 5px;
  background: linear-gradient(110deg, rgba(15, 174, 152, .11), rgba(47, 141, 205, .055));
  box-shadow: 0 8px 20px rgba(12, 53, 72, .045);
  color: #086d68;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.4;
  letter-spacing: 0;
  text-transform: none;
}
.gh-hero-copy .kicker::before {
  content: "";
  width: 3px;
  height: 16px;
  flex: none;
  border-radius: 2px;
  background: linear-gradient(90deg, #0ac6a8, #268bd2);
}

.home-refresh .gh-hero h1 {
  max-width: 640px;
  margin-bottom: 28px;
  font-size: 39px;
  line-height: 1.25;
}

.gh-hero-title-line { display: block; }
.gh-hero-title-brand {
  margin-inline: .035em;
  color: #087d91;
  background: linear-gradient(100deg, #098d78, #137ab9);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.gh-hero-lead {
  max-width: 610px;
  margin-bottom: 36px;
  color: #466477;
  font-size: 17px;
  line-height: 1.75;
  text-wrap: balance;
}

.gh-hero-lead-term { white-space: nowrap; }

.gh-hero-actions { flex-wrap: wrap; }

.gh-hero-media { position: relative; min-height: 550px; margin-right: -74px; }
.gh-hero-image-shell {
  position: absolute;
  inset: 30px 0 20px 10px;
  overflow: hidden;
  border: 1px solid rgba(21, 60, 78, .11);
  border-radius: 8px 0 0 8px;
  background: #fff;
  box-shadow: 0 36px 80px rgba(20, 57, 78, .16);
}

.gh-hero-image-shell::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.55);
}

.gh-hero-image-shell img { width: 100%; height: 100%; object-fit: cover; object-position: 48% center; }
.gh-float-card {
  position: absolute;
  z-index: 2;
  min-width: 174px;
  padding: 14px 16px;
  border: 1px solid rgba(13, 159, 141, .18);
  border-radius: 7px;
  background: rgba(255,255,255,.93);
  backdrop-filter: blur(12px);
  box-shadow: 0 18px 44px rgba(12, 38, 56, .14);
}

.gh-float-card::before {
  content: "";
  position: absolute;
  width: 9px;
  height: 9px;
  top: 17px;
  left: -5px;
  border-radius: 50%;
  background: var(--gh-teal);
  box-shadow: 0 0 0 5px rgba(13,159,141,.12);
}

.gh-float-card span { display: block; color: #64808f; font-size: 10px; font-weight: 850; }
.gh-float-card b { display: block; margin-top: 3px; font-size: 14px; }
.gh-float-card-one { top: 6px; left: 52px; }
.gh-float-card-two { top: 46%; right: 16px; }
.gh-float-card-three { bottom: 0; left: 18%; }

.gh-proof-rail {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  width: 100%;
  max-width: none;
  padding: 0 max(22px, calc((100vw - 1160px) / 2));
  border-top: 1px solid rgba(76, 103, 148, .12);
  border-bottom: 1px solid rgba(76, 103, 148, .12);
  background:
    linear-gradient(90deg, rgba(50, 89, 150, .035) 1px, transparent 1px),
    linear-gradient(rgba(50, 89, 150, .035) 1px, transparent 1px),
    linear-gradient(105deg, #f6fbff, #f0f8fb 50%, #f5f4ff);
  background-size: 72px 72px, 72px 72px, auto;
}

.gh-proof-rail > div {
  position: relative;
  display: grid;
  min-height: 122px;
  place-items: center;
  padding: 20px 12px;
  text-align: center;
}

.gh-proof-rail > div:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 23px;
  right: 0;
  bottom: 23px;
  width: 1px;
  background: rgba(64, 99, 151, .15);
}

.gh-proof-rail b, .gh-proof-rail small { display: block; }
.gh-proof-rail b {
  margin-bottom: 5px;
  color: #102237;
  font-size: 34px;
  line-height: 1.15;
  white-space: nowrap;
}
.gh-proof-rail small { color: #637187; font-size: 15px; line-height: 1.4; white-space: nowrap; }

.gh-friction-section { background: #fff; }
.gh-friction-grid {
  display: grid;
  grid-template-columns: minmax(0, .82fr) minmax(540px, 1.18fr);
  gap: 84px;
  align-items: center;
}

.gh-friction-copy h2 { max-width: 510px; margin-bottom: 18px; font-size: clamp(35px, 3.5vw, 48px); line-height: 1.12; }
.gh-friction-copy > p:not(.kicker) { max-width: 530px; color: #56707f; line-height: 1.75; }
.gh-friction-list { border-top: 1px solid var(--gh-line); }
.gh-friction-list article {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 20px;
  align-items: center;
  padding: 24px 12px 24px 0;
  border-bottom: 1px solid var(--gh-line);
}

.gh-friction-list span { color: #84a0ae; font-size: 11px; font-weight: 900; }
.gh-friction-list h3 { margin-bottom: 5px; font-size: 20px; }
.gh-friction-list p { margin: 0; color: #617987; font-size: 14px; }

.gh-loop-section {
  overflow: hidden;
  border-top: 1px solid var(--gh-line);
  border-bottom: 1px solid var(--gh-line);
  background:
    linear-gradient(90deg, rgba(13,159,141,.04) 1px, transparent 1px),
    linear-gradient(rgba(13,159,141,.04) 1px, transparent 1px),
    #f4f9fa;
  background-size: 56px 56px;
}

.gh-center-heading { max-width: 820px; margin: 0 auto 36px; text-align: center; }
.gh-center-heading h2 { margin-bottom: 14px; font-size: clamp(36px, 4vw, 52px); line-height: 1.08; }
.gh-center-heading > p:last-child { max-width: 690px; margin-inline: auto; color: #567181; }
.gh-loop-visual {
  position: relative;
  overflow: hidden;
  max-width: 1080px;
  height: 420px;
  margin: 0 auto 28px;
  border: 1px solid rgba(21,60,78,.11);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 28px 70px rgba(20,57,78,.11);
}

.gh-loop-visual img { width: 100%; height: 100%; object-fit: cover; }
.gh-loop-pulse {
  position: absolute;
  inset: 20px;
  border: 1px solid rgba(13,159,141,.1);
  border-radius: 6px;
  pointer-events: none;
}

.gh-loop-steps {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--gh-line);
  border-left: 1px solid var(--gh-line);
  list-style: none;
}

.gh-loop-steps li {
  min-height: 162px;
  padding: 20px 17px;
  border-right: 1px solid var(--gh-line);
  border-bottom: 1px solid var(--gh-line);
  background: rgba(255,255,255,.88);
}

.gh-loop-steps span { color: var(--gh-teal); font-size: 10px; font-weight: 900; }
.gh-loop-steps h3 { margin: 9px 0 7px; font-size: 17px; }
.gh-loop-steps p { margin: 0; color: #6b8290; font-size: 12px; line-height: 1.55; }

.gh-capabilities-section { background: #fff; }
.gh-capability-heading {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(320px, .65fr);
  gap: 70px;
  align-items: end;
  margin-bottom: 36px;
}

.gh-capability-heading h2 { max-width: 730px; margin-bottom: 0; font-size: clamp(36px, 3.8vw, 50px); line-height: 1.1; }
.gh-capability-heading > p { margin: 0; color: #5f7887; line-height: 1.72; }
.gh-capability-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.gh-capability-card {
  position: relative;
  min-height: 414px;
  padding: 30px 28px;
  overflow: hidden;
  border: 1px solid var(--gh-line);
  border-radius: 8px;
  background: #f8fbfc;
  box-shadow: 0 18px 44px rgba(12,38,56,.06);
}

.gh-capability-card::after {
  content: "";
  position: absolute;
  width: 160px;
  height: 160px;
  right: -76px;
  bottom: -72px;
  border: 1px solid rgba(13,159,141,.13);
  border-radius: 50%;
  box-shadow: 0 0 0 34px rgba(13,159,141,.025);
}

.gh-capability-primary { color: #fff; border-color: #173c50; background: #102d3e; }
.gh-capability-primary::after { border-color: rgba(114,223,207,.24); box-shadow: 0 0 0 34px rgba(114,223,207,.035); }
.gh-capability-icon {
  display: grid;
  width: 54px;
  height: 54px;
  place-items: center;
  margin-bottom: 46px;
  border: 1px solid rgba(13,159,141,.18);
  border-radius: 7px;
  color: #087e70;
  background: #e1f7f3;
}

.gh-capability-primary .gh-capability-icon { color: #8ce8da; border-color: rgba(114,223,207,.25); background: rgba(114,223,207,.09); }
.gh-capability-icon svg { width: 27px; height: 27px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.gh-card-label { margin-bottom: 8px; color: var(--gh-teal); font-size: 11px; font-weight: 900; }
.gh-capability-primary .gh-card-label { color: #72dfcf; }
.gh-capability-card h3 { margin-bottom: 13px; font-size: 25px; }
.gh-capability-card > p:not(.gh-card-label) { color: #637d8b; font-size: 14px; line-height: 1.7; }
.gh-capability-primary > p:not(.gh-card-label) { color: #c4d5de; }
.gh-capability-card ul { display: flex; flex-wrap: wrap; gap: 7px; margin: 24px 0 0; padding: 0; list-style: none; }
.gh-capability-card li { padding: 6px 8px; border: 1px solid rgba(21,60,78,.11); border-radius: 4px; color: #536d7b; background: #fff; font-size: 11px; font-weight: 750; }
.gh-capability-primary li { color: #d9e8ed; border-color: rgba(255,255,255,.13); background: rgba(255,255,255,.055); }
.gh-feature-strip {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  margin-top: 22px;
  border: 1px solid var(--gh-line);
  background: #fff;
}

.gh-feature-strip span {
  min-height: 64px;
  display: grid;
  place-items: center;
  padding: 10px;
  border-right: 1px solid var(--gh-line);
  color: #4b6878;
  font-size: 12px;
  font-weight: 800;
  text-align: center;
}

.gh-feature-strip span:last-child { border-right: 0; }

.gh-scenarios-section { color: #fff; background: #0d2a3a; }
.gh-scenarios-layout { display: grid; grid-template-columns: minmax(0, .9fr) minmax(500px, 1.1fr); gap: 72px; align-items: center; }
.gh-scenarios-copy .kicker { color: #72dfcf; }
.gh-scenarios-copy h2 { max-width: 550px; margin-bottom: 17px; color: #fff; font-size: clamp(36px,3.8vw,50px); line-height: 1.1; }
.gh-scenarios-copy > p:not(.kicker) { max-width: 570px; color: #b9cbd5; }
.gh-scenario-tabs { margin-top: 30px; border-top: 1px solid rgba(255,255,255,.12); }
.gh-scenario-tabs article { display: grid; grid-template-columns: 40px minmax(0,1fr); gap: 16px; padding: 19px 0; border-bottom: 1px solid rgba(255,255,255,.12); }
.gh-scenario-tabs i { color: #72dfcf; font-size: 10px; font-style: normal; font-weight: 900; }
.gh-scenario-tabs h3 { margin-bottom: 4px; color: #fff; font-size: 17px; }
.gh-scenario-tabs p { margin: 0; color: #a9bfcb; font-size: 13px; }
.gh-scenarios-panel {
  overflow: hidden;
  padding: 26px;
  border: 1px solid rgba(114,223,207,.18);
  border-radius: 8px;
  color: var(--gh-navy);
  background: #f8fbfc;
  box-shadow: 0 34px 80px rgba(0,0,0,.24);
}

.gh-panel-top { display: flex; align-items: center; gap: 6px; padding-bottom: 19px; border-bottom: 1px solid var(--gh-line); }
.gh-panel-top span { width: 8px; height: 8px; border-radius: 50%; background: #ff8c77; }
.gh-panel-top span:nth-child(2) { background: #f5c453; }
.gh-panel-top span:nth-child(3) { background: #43c4a4; }
.gh-panel-top b { margin-left: auto; color: #68808d; font-size: 11px; }
.gh-panel-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; margin: 20px 0; }
.gh-panel-stats div { padding: 14px; border: 1px solid var(--gh-line); border-radius: 6px; background: #fff; }
.gh-panel-stats small, .gh-panel-stats strong { display: block; }
.gh-panel-stats small { color: #78909c; font-size: 10px; }
.gh-panel-stats strong { margin-top: 6px; font-size: 13px; }
.gh-panel-chart { height: 150px; display: flex; align-items: end; gap: 12px; padding: 22px 26px 0; border: 1px solid var(--gh-line); border-radius: 6px; background: linear-gradient(180deg,#fff,#eef7f8); }
.gh-panel-chart span { flex: 1; height: var(--bar); border-radius: 3px 3px 0 0; background: linear-gradient(180deg,#23baa5,#0c8f80); box-shadow: 0 6px 14px rgba(13,159,141,.16); }
.gh-panel-chart span:nth-child(2n) { background: linear-gradient(180deg,#68a8e7,#397bc1); }
.gh-panel-rows { margin-top: 15px; }
.gh-panel-rows p { display: grid; grid-template-columns: 10px 1fr auto; gap: 9px; align-items: center; margin: 0; padding: 12px 4px; border-bottom: 1px solid var(--gh-line); color: #506b7a; font-size: 12px; }
.gh-panel-rows p:last-child { border-bottom: 0; }
.gh-panel-rows i { width: 7px; height: 7px; border-radius: 50%; background: #1caf9b; }
.gh-panel-rows b { color: #178375; font-size: 10px; }

.gh-voices-section { background: #f5f9fa; }
.gh-voices-banner {
  position: relative;
  min-height: 438px;
  overflow: hidden;
  border-radius: 8px;
  color: #fff;
  box-shadow: 0 28px 70px rgba(12,38,56,.16);
}

.gh-voices-banner::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg,rgba(7,26,39,.94) 0%,rgba(7,26,39,.72) 36%,rgba(7,26,39,.08) 73%); }
.gh-voices-banner img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.gh-voices-banner-copy { position: relative; z-index: 1; max-width: 570px; padding: 70px 60px; }
.gh-voices-banner-copy .kicker { color: #72dfcf; }
.gh-voices-banner-copy h2 { color: #fff; font-size: clamp(36px,4vw,52px); line-height: 1.08; }
.gh-voices-banner-copy > p:last-child { color: #c4d4dc; line-height: 1.7; }
.gh-voice-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; margin-top: 18px; }
.gh-voice-grid blockquote { position: relative; min-height: 198px; margin: 0; padding: 28px; border: 1px solid var(--gh-line); border-radius: 8px; background: #fff; }
.gh-voice-grid blockquote > span { position: absolute; top: 13px; right: 20px; color: #cdece7; font: 700 52px/1 Georgia,serif; }
.gh-voice-grid p { position: relative; z-index: 1; margin: 22px 0 25px; color: #324f60; font-size: 15px; line-height: 1.72; }
.gh-voice-grid footer { color: #0d8e7e; font-size: 11px; font-weight: 850; }
.gh-voices-note { margin: 15px 0 0; color: #8095a0; font-size: 11px; text-align: center; }

.gh-trial-section { background: #fff; }
.gh-trial-panel {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0,1.1fr) minmax(380px,.9fr);
  gap: 60px;
  align-items: center;
  overflow: hidden;
  padding: 58px 64px;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(120deg,#0d2b3d 0%,#113e50 62%,#0b6f64 130%);
  box-shadow: 0 30px 70px rgba(12,38,56,.18);
}

.gh-trial-panel::after { content: ""; position: absolute; width: 360px; height: 360px; right: -170px; top: -170px; border: 1px solid rgba(114,223,207,.22); border-radius: 50%; box-shadow: 0 0 0 58px rgba(114,223,207,.035); }
.gh-trial-copy { position: relative; z-index: 1; }
.gh-trial-copy .kicker { color: #72dfcf; }
.gh-trial-copy h2 { max-width: 650px; color: #fff; font-size: clamp(35px,3.7vw,49px); line-height: 1.1; }
.gh-trial-copy > p:not(.kicker) { max-width: 610px; color: #c3d4dd; }
.gh-trial-secondary { color: #fff; border-color: rgba(255,255,255,.3); background: transparent; }
.gh-trial-summary { position: relative; z-index: 1; border-top: 1px solid rgba(255,255,255,.14); }
.gh-trial-summary > div { display: grid; grid-template-columns: 40px minmax(0,1fr); gap: 14px; align-items: center; padding: 17px 0; border-bottom: 1px solid rgba(255,255,255,.14); }
.gh-trial-summary > div > span { display: grid; width: 32px; height: 32px; place-items: center; border-radius: 50%; color: #0d635b; background: #84e4d5; font-size: 10px; font-weight: 900; }
.gh-trial-summary p, .gh-trial-summary b, .gh-trial-summary small { display: block; margin: 0; }
.gh-trial-summary b { color: #fff; font-size: 14px; }
.gh-trial-summary small { margin-top: 3px; color: #a9c1cd; font-size: 11px; }

.gh-faq-section { border-top: 1px solid var(--gh-line); background: #f7fafb; }
.gh-faq-layout { display: grid; grid-template-columns: minmax(0,.7fr) minmax(520px,1.3fr); gap: 80px; align-items: start; }
.gh-faq-intro { position: sticky; top: 110px; }
.gh-faq-intro h2 { max-width: 480px; font-size: clamp(34px,3.4vw,46px); line-height: 1.12; }
.gh-faq-intro > p:not(.kicker) { max-width: 430px; color: #607987; }
.home-refresh .faq-list details { border-radius: 7px; box-shadow: 0 12px 30px rgba(12,38,56,.04); }

@media (max-width: 1180px) {
  .gh-hero-grid { grid-template-columns: minmax(350px,.78fr) minmax(500px,1.22fr); }
  .gh-hero-media { margin-right: -28px; }
  .gh-proof-rail > div { padding: 20px 12px; }
  .gh-friction-grid { gap: 50px; }
  .gh-loop-steps { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .gh-scenarios-layout { gap: 46px; }
}

@media (max-width: 980px) {
  .home-refresh .section { padding: 78px 0; }
  .gh-hero { padding-top: 58px; }
  .gh-hero-grid { grid-template-columns: 1fr; min-height: 0; }
  .gh-hero-copy { max-width: 760px; padding-bottom: 0; }
  .gh-hero-media { min-height: 500px; margin: 0 -20px; }
  .gh-hero-image-shell { inset: 28px 0 18px; border-radius: 8px; }
  .gh-proof-rail b { font-size: 29px; }
  .gh-proof-rail small { font-size: 13px; }
  .gh-friction-grid, .gh-capability-heading, .gh-scenarios-layout, .gh-trial-panel, .gh-faq-layout { grid-template-columns: 1fr; }
  .gh-friction-grid, .gh-scenarios-layout, .gh-faq-layout { gap: 42px; }
  .gh-loop-visual { height: 350px; }
  .gh-capability-grid { grid-template-columns: 1fr; }
  .gh-capability-card { min-height: 0; }
  .gh-capability-icon { margin-bottom: 30px; }
  .gh-feature-strip { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .gh-feature-strip span:nth-child(3n) { border-right: 0; }
  .gh-feature-strip span:nth-child(-n+3) { border-bottom: 1px solid var(--gh-line); }
  .gh-scenarios-panel { max-width: 720px; }
  .gh-voice-grid { grid-template-columns: 1fr; }
  .gh-voice-grid blockquote { min-height: 0; }
  .gh-trial-panel { padding: 48px; }
  .gh-faq-intro { position: static; }
}

@media (max-width: 660px) {
  .home-refresh .section { padding: 64px 0; }
  .gh-hero { padding-top: 44px; }
  .home-refresh .gh-hero h1 { font-size: 39px; }
  .gh-hero-lead { font-size: 16px; }
  .gh-hero-actions { align-items: stretch; flex-direction: column; }
  .gh-hero-actions .button { width: 100%; }
  .gh-hero-media { min-height: 360px; margin: 8px -14px 0; }
  .gh-hero-image-shell { inset: 32px 0 20px; }
  .gh-float-card { min-width: 138px; padding: 10px 12px; }
  .gh-float-card span { font-size: 9px; }
  .gh-float-card b { font-size: 11px; }
  .gh-float-card-one { left: 15px; }
  .gh-float-card-two { right: 6px; }
  .gh-float-card-three { left: 10%; }
  .gh-proof-rail { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 0 14px; }
  .gh-proof-rail > div { min-height: 106px; padding: 18px 8px; }
  .gh-proof-rail > div:nth-child(2)::after { display: none; }
  .gh-proof-rail > div:nth-child(-n+2) { border-bottom: 1px solid rgba(64, 99, 151, .15); }
  .gh-proof-rail b { font-size: 27px; }
  .gh-proof-rail small { font-size: 12px; }
  .gh-friction-list article { grid-template-columns: 40px minmax(0,1fr); }
  .gh-center-heading { text-align: left; }
  .gh-loop-visual { height: 260px; margin-inline: -8px; }
  .gh-loop-steps { grid-template-columns: 1fr 1fr; }
  .gh-loop-steps li { min-height: 145px; }
  .gh-capability-heading { gap: 20px; }
  .gh-capability-card { padding: 25px 22px; }
  .gh-feature-strip { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .gh-feature-strip span, .gh-feature-strip span:nth-child(3n) { border-right: 1px solid var(--gh-line); border-bottom: 1px solid var(--gh-line); }
  .gh-feature-strip span:nth-child(2n) { border-right: 0; }
  .gh-feature-strip span:nth-last-child(-n+2) { border-bottom: 0; }
  .gh-scenarios-panel { padding: 18px; }
  .gh-panel-stats { grid-template-columns: 1fr; }
  .gh-panel-chart { height: 130px; padding-inline: 16px; }
  .gh-voices-banner { min-height: 500px; }
  .gh-voices-banner::after { background: linear-gradient(180deg,rgba(7,26,39,.92) 0%,rgba(7,26,39,.78) 58%,rgba(7,26,39,.22) 100%); }
  .gh-voices-banner img { object-position: 64% center; }
  .gh-voices-banner-copy { padding: 38px 26px; }
  .gh-trial-panel { padding: 36px 24px; gap: 38px; }
  .gh-trial-copy .action-row { align-items: stretch; flex-direction: column; }
  .gh-trial-copy .button { width: 100%; }
}

/* Chinese homepage premium media upgrade */
.gh-hero-image-shell {
  inset: 0;
  overflow: visible;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.gh-hero-image-shell::after { display: none; }

.gh-hero-image-shell .gh-hero-product-ui {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  filter: none;
}

.gh-hero-image-shell .gh-hero-product-logo {
  position: absolute;
  z-index: 2;
  top: 17.9%;
  left: 18.45%;
  width: 13.82%;
  height: auto;
  object-fit: contain;
  filter: none;
}
.gh-hero-caption {
  position: absolute;
  z-index: 2;
  right: 22px;
  bottom: 0;
  width: min(470px, 78%);
  margin: 0;
  padding: 14px 18px;
  border-left: 3px solid #20b39e;
  color: #d8e6eb;
  background: rgba(10, 34, 48, .94);
  box-shadow: 0 16px 40px rgba(7, 25, 37, .22);
  font-size: 12px;
  line-height: 1.55;
}

.gh-hero-caption span { margin-right: 8px; color: #7fe1d3; font-weight: 900; }

.gh-friction-media {
  position: relative;
  height: 430px;
  margin: 0;
  overflow: hidden;
  border: 1px solid rgba(21, 60, 78, .14);
  border-radius: 8px;
  background: #0b2231;
  box-shadow: 0 28px 68px rgba(12, 38, 56, .16);
}

.gh-friction-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 52%, rgba(7, 26, 39, .82) 100%);
  pointer-events: none;
}

.gh-friction-media img { width: 100%; height: 100%; object-fit: cover; }
.gh-friction-media figcaption {
  position: absolute;
  z-index: 1;
  right: 24px;
  bottom: 22px;
  left: 24px;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 20px;
  color: #fff;
}

.gh-friction-media figcaption b { font-size: 17px; }
.gh-friction-media figcaption span { max-width: 250px; color: #bdd0d9; font-size: 11px; text-align: right; }
.gh-friction-list-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 28px;
  border: 1px solid var(--gh-line);
}

.gh-friction-list-row article {
  min-height: 148px;
  padding: 24px;
  border-right: 1px solid var(--gh-line);
  border-bottom: 0;
  background: #fff;
}

.gh-friction-list-row article:last-child { border-right: 0; }

.gh-loop-visual {
  height: 438px;
  border-color: rgba(61, 113, 134, .3);
  background: #071c2b;
  box-shadow: 0 32px 76px rgba(7, 27, 41, .22);
}

.gh-loop-visual img { object-position: center; }
.gh-loop-pulse { border-color: rgba(105, 225, 208, .2); }

.gh-capability-grid { gap: 20px; }
.gh-capability-card,
.gh-capability-primary {
  min-height: 0;
  padding: 0;
  color: var(--gh-navy);
  border-color: rgba(21, 60, 78, .14);
  background: #fff;
  box-shadow: 0 22px 54px rgba(12, 38, 56, .1);
}

.gh-capability-card::before {
  content: "";
  position: absolute;
  z-index: 2;
  inset: 0 0 auto;
  height: 3px;
  background: linear-gradient(90deg, #11a691, #4b85d0);
}

.gh-capability-card::after { display: none; }
.gh-capability-media {
  position: relative;
  height: 226px;
  margin: 0;
  overflow: hidden;
  border-bottom: 1px solid rgba(21, 60, 78, .12);
  background: #dfe7ea;
}

.gh-capability-media::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  box-shadow: inset 0 -24px 40px rgba(8, 31, 45, .08);
}

.gh-capability-media img { width: 100%; height: 100%; object-fit: cover; object-position: center; transition: transform .35s ease; }
.gh-capability-card:hover .gh-capability-media img { transform: scale(1.025); }
.gh-capability-content { padding: 27px 26px 28px; }
.gh-capability-card .gh-card-label,
.gh-capability-primary .gh-card-label { color: #0d8f80; }
.gh-capability-card h3 { margin-bottom: 11px; font-size: 23px; }
.gh-capability-card > p:not(.gh-card-label),
.gh-capability-primary > p:not(.gh-card-label),
.gh-capability-content > p:not(.gh-card-label) { color: #617987; }
.gh-capability-content ul { display: flex; flex-wrap: wrap; gap: 7px; margin: 22px 0 0; padding: 0; list-style: none; }
.gh-capability-content li,
.gh-capability-primary .gh-capability-content li {
  padding: 6px 8px;
  color: #496675;
  border: 1px solid rgba(21, 60, 78, .12);
  border-radius: 4px;
  background: #f7fafb;
  font-size: 11px;
  font-weight: 750;
}

.gh-feature-strip {
  margin-top: 26px;
  border: 0;
  border-top: 1px solid var(--gh-line);
  border-bottom: 1px solid var(--gh-line);
}

.gh-feature-strip span {
  position: relative;
  border-right: 0;
  background: transparent;
}

.gh-feature-strip span::before {
  content: "";
  width: 6px;
  height: 6px;
  margin-right: 8px;
  border-radius: 50%;
  background: #16a892;
  box-shadow: 0 0 0 4px rgba(22, 168, 146, .1);
}

.gh-feature-strip span { display: flex; }

.gh-scenarios-media {
  position: relative;
  min-height: 500px;
  margin: 0;
  overflow: hidden;
  border: 1px solid rgba(114, 223, 207, .2);
  border-radius: 8px;
  background: #071d2c;
  box-shadow: 0 34px 82px rgba(0, 0, 0, .3);
}

.gh-scenarios-media::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, transparent 54%, rgba(6, 23, 35, .9) 100%);
}

.gh-scenarios-media img { width: 100%; height: 100%; min-height: 500px; object-fit: cover; object-position: 57% center; }
.gh-scenarios-media figcaption {
  position: absolute;
  z-index: 1;
  right: 28px;
  bottom: 25px;
  left: 28px;
  display: grid;
  gap: 5px;
}

.gh-scenarios-media figcaption span { color: #75dfd0; font-size: 10px; font-weight: 900; }
.gh-scenarios-media figcaption b { max-width: 460px; color: #fff; font-size: 18px; line-height: 1.45; }

.gh-voices-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(340px, .62fr);
  gap: 70px;
  align-items: end;
  margin-bottom: 34px;
}

.gh-voices-heading h2 { max-width: 720px; margin-bottom: 0; font-size: clamp(36px, 3.8vw, 50px); line-height: 1.08; }
.gh-voices-heading > p { margin: 0; color: #617987; line-height: 1.7; }
.gh-voices-banner { min-height: 470px; }
.gh-voices-banner-copy { max-width: 610px; padding: 76px 60px; }
.gh-voices-banner-copy h3 { margin: 0 0 24px; color: #fff; font-size: clamp(30px, 3.2vw, 43px); line-height: 1.2; }
.gh-voices-banner-copy > p:last-child { color: #7fe1d3; font-size: 12px; font-weight: 800; }
.gh-voice-grid blockquote { min-height: 220px; }
.gh-voice-grid blockquote > span { display: none; }
.gh-voice-grid blockquote header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 15px;
  border-bottom: 1px solid var(--gh-line);
}

.gh-voice-grid blockquote header span { color: #0d9484; font-size: 10px; font-weight: 900; }
.gh-voice-grid blockquote header b { color: #193d50; font-size: 12px; }
.gh-voice-grid blockquote p { margin-top: 22px; }

.gh-trial-panel {
  grid-template-columns: minmax(370px, .84fr) minmax(470px, 1.16fr);
  grid-template-areas: "copy media" "steps steps";
  gap: 0;
  align-items: stretch;
  padding: 0;
}

.gh-trial-panel::after { display: none; }
.gh-trial-copy { grid-area: copy; align-self: center; padding: 52px 42px 48px 56px; }
.gh-trial-media { grid-area: media; min-height: 430px; margin: 0; overflow: hidden; }
.gh-trial-media img { width: 100%; height: 100%; min-height: 430px; object-fit: cover; object-position: 56% center; }
.gh-trial-summary {
  grid-area: steps;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding: 0 36px;
  border-top: 1px solid rgba(255, 255, 255, .14);
  background: rgba(5, 24, 35, .38);
}

.gh-trial-summary > div { padding: 18px 20px; border-right: 1px solid rgba(255, 255, 255, .12); border-bottom: 0; }
.gh-trial-summary > div:last-child { border-right: 0; }

@media (max-width: 980px) {
  .gh-hero-caption { right: 14px; bottom: 2px; }
  .gh-friction-list-row { grid-template-columns: 1fr; }
  .gh-friction-list-row article { min-height: 0; border-right: 0; border-bottom: 1px solid var(--gh-line); }
  .gh-friction-list-row article:last-child { border-bottom: 0; }
  .gh-capability-media { height: 310px; }
  .gh-scenarios-media { max-width: 760px; }
  .gh-voices-heading { grid-template-columns: 1fr; gap: 16px; }
  .gh-trial-panel { grid-template-columns: 1fr; grid-template-areas: "copy" "media" "steps"; }
  .gh-trial-copy { padding: 48px; }
  .gh-trial-media, .gh-trial-media img { min-height: 380px; }
}

@media (max-width: 660px) {
  .gh-hero-image-shell { inset: 28px 0 18px; }
  .gh-hero-caption { right: 0; bottom: 0; width: 92%; padding: 11px 13px; font-size: 10px; }
  .gh-friction-media { height: 340px; }
  .gh-friction-media figcaption { align-items: start; flex-direction: column; }
  .gh-friction-media figcaption span { text-align: left; }
  .gh-loop-visual { height: 280px; }
  .gh-capability-media { height: 235px; }
  .gh-capability-content { padding: 24px 21px 26px; }
  .gh-feature-strip span,
  .gh-feature-strip span:nth-child(3n) { border-right: 0; }
  .gh-scenarios-media,
  .gh-scenarios-media img { min-height: 410px; }
  .gh-voices-banner { min-height: 560px; }
  .gh-voices-banner-copy { padding: 40px 26px; }
  .gh-voices-banner-copy h3 { font-size: 30px; }
  .gh-trial-copy { padding: 38px 24px; }
  .gh-trial-media, .gh-trial-media img { min-height: 280px; }
  .gh-trial-summary { grid-template-columns: 1fr; padding: 0 24px 18px; }
  .gh-trial-summary > div { border-right: 0; border-bottom: 1px solid rgba(255, 255, 255, .12); }
  .gh-trial-summary > div:last-child { border-bottom: 0; }
}

/* Crisp product interface visual for the Chinese homepage hero. */
.home-refresh .gh-hero-grid {
  grid-template-columns: minmax(360px, .83fr) minmax(0, 1.17fr);
  gap: 24px;
}

.home-refresh .gh-hero-media {
  min-height: 560px;
  margin-right: -32px;
}

.gh-demo {
  position: absolute;
  inset: 0;
  color: #1c3549;
  font-family: Arial, "Microsoft YaHei", sans-serif;
  letter-spacing: 0;
}

.gh-demo-window {
  position: absolute;
  inset: 58px 12px 30px 12px;
  overflow: hidden;
  border: 1px solid #d3e2e8;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 22px 48px rgba(19, 62, 82, .14);
}

.gh-demo-topbar {
  display: flex;
  height: 42px;
  align-items: center;
  gap: 12px;
  padding: 0 16px;
  border-bottom: 1px solid #e6edf0;
  background: #fbfdfd;
}

.gh-demo-window-dots { display: flex; gap: 5px; }
.gh-demo-window-dots i { width: 7px; height: 7px; border-radius: 50%; background: #f36b74; }
.gh-demo-window-dots i:nth-child(2) { background: #f4bd58; }
.gh-demo-window-dots i:nth-child(3) { background: #51c887; }
.gh-demo-topbar img { width: 112px; height: auto; }
.gh-demo-workspace { margin-left: auto; color: #758b99; font-size: 10px; }

.gh-demo-body {
  display: grid;
  grid-template-columns: 46px minmax(0, 25%) minmax(0, 46%) minmax(0, 1fr);
  height: calc(100% - 42px);
}

.gh-demo-sidebar {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 7px;
  padding-top: 15px;
  background: #102d41;
  color: #a9becb;
}

.gh-demo-sidebar > span {
  display: flex;
  width: 37px;
  height: 46px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  font-size: 16px;
  line-height: 1;
}

.gh-demo-sidebar > span small { margin-top: 5px; font-size: 8px; }
.gh-demo-sidebar .gh-demo-nav-current { background: #1e5c90; color: #fff; }
.gh-demo-list { overflow: hidden; border-right: 1px solid #e6edf0; background: #fff; }
.gh-demo-list-title { display: flex; height: 47px; align-items: center; justify-content: space-between; padding: 0 12px; }
.gh-demo-list-title b { font-size: 12px; }
.gh-demo-list-title span { color: #638297; font-size: 18px; }
.gh-demo-list-filter { display: flex; gap: 7px; padding: 0 12px 12px; color: #137e74; font-size: 9px; font-weight: 700; }
.gh-demo-list-filter span { color: #8094a0; font-weight: 400; }
.gh-demo-contact { display: flex; min-width: 0; height: 64px; align-items: center; gap: 8px; padding: 0 9px; border-top: 1px solid #f0f4f5; }
.gh-demo-contact.is-active { background: #eaf5f8; }
.gh-demo-contact img, .gh-demo-chat-head img, .gh-demo-profile-head img { width: 30px; height: 30px; flex: none; border-radius: 50%; object-fit: cover; }
.gh-demo-contact span { min-width: 0; flex: 1; }
.gh-demo-contact b, .gh-demo-contact small { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.gh-demo-contact b { font-size: 10px; }
.gh-demo-contact small { margin-top: 5px; color: #82939e; font-size: 9px; }
.gh-demo-contact i { align-self: start; margin-top: 15px; color: #a0adb6; font-size: 7px; font-style: normal; }

.gh-demo-chat { display: flex; min-width: 0; flex-direction: column; background: #fafcfd; }
.gh-demo-chat-head { display: flex; height: 49px; flex: none; align-items: center; gap: 8px; padding: 0 12px; border-bottom: 1px solid #e6edf0; background: #fff; }
.gh-demo-chat-head span { min-width: 0; }
.gh-demo-chat-head b, .gh-demo-chat-head small { display: block; white-space: nowrap; }
.gh-demo-chat-head b { font-size: 11px; }
.gh-demo-chat-head small { margin-top: 4px; color: #329885; font-size: 9px; }
.gh-demo-chat-head i { margin-left: auto; color: #6b8392; font-size: 20px; font-style: normal; }
.gh-demo-chat-flow { display: flex; min-height: 0; flex: 1; flex-direction: column; gap: 11px; padding: 19px 13px 9px; }
.gh-demo-message { max-width: 82%; padding: 10px 12px; border-radius: 8px; font-size: 10px; line-height: 1.52; }
.gh-demo-message.incoming { align-self: flex-start; background: #edf2f5; }
.gh-demo-message.outgoing { align-self: flex-end; background: #d9f4ed; }
.gh-demo-translation { max-width: 91%; padding: 9px 11px; border: 1px solid #cce0fb; border-radius: 7px; background: #f0f6ff; }
.gh-demo-translation span { color: #196fc1; font-size: 9px; font-weight: 700; }
.gh-demo-translation p { margin: 5px 0 0; font-size: 10px; line-height: 1.45; }
.gh-demo-note { padding: 7px 9px; border-radius: 6px; background: #fff6df; color: #725e37; font-size: 9px; }
.gh-demo-compose { display: flex; height: 43px; flex: none; align-items: center; justify-content: space-between; margin: 0 10px 10px; padding: 0 8px 0 11px; border: 1px solid #e3ebee; border-radius: 6px; background: #fff; color: #9dafba; font-size: 9px; }
.gh-demo-compose b { display: grid; width: 25px; height: 25px; place-items: center; border-radius: 4px; background: #1674d0; color: #fff; font-size: 11px; }

.gh-demo-profile { min-width: 0; padding: 14px 11px; background: #fff; }
.gh-demo-profile-head { display: flex; align-items: center; gap: 7px; padding-bottom: 17px; border-bottom: 1px solid #e8eef0; }
.gh-demo-profile-head b { overflow: hidden; font-size: 9px; white-space: nowrap; text-overflow: ellipsis; }
.gh-demo-profile-head span { margin-left: auto; padding: 4px 5px; border-radius: 3px; background: #e4f8ec; color: #178a64; font-size: 7px; white-space: nowrap; }
.gh-demo-profile-block { padding: 13px 0; border-bottom: 1px solid #edf1f3; }
.gh-demo-profile-block small, .gh-demo-profile-block b { display: block; }
.gh-demo-profile-block small { margin-bottom: 7px; color: #8295a1; font-size: 8px; }
.gh-demo-profile-block b { font-size: 9px; font-weight: 700; }
.gh-demo-profile-block em { display: block; margin-top: 6px; color: #178e83; font-size: 8px; font-style: normal; }
.gh-demo-chips { display: flex; flex-wrap: wrap; gap: 4px; }
.gh-demo-chips span { padding: 4px 5px; border-radius: 3px; background: #eaf1ff; color: #456aab; font-size: 8px; }
.gh-demo-progress { display: flex; gap: 4px; margin: 6px 0 8px; }
.gh-demo-progress i { height: 4px; flex: 1; border-radius: 5px; background: #d8e2e8; }
.gh-demo-progress i:nth-child(-n+2) { background: #19a995; }

.gh-demo-callout {
  position: absolute;
  z-index: 2;
  display: flex;
  height: 49px;
  align-items: center;
  gap: 8px;
  padding: 6px 13px 6px 7px;
  border: 1px solid #d7e9e9;
  border-radius: 7px;
  background: #fff;
  box-shadow: 0 13px 29px rgba(20, 63, 79, .15);
  color: #153c4d;
  font-size: 13px;
  font-weight: 800;
  white-space: nowrap;
}

.gh-demo-callout span { display: grid; width: 34px; height: 34px; flex: none; place-items: center; border-radius: 5px; background: #dff8f0; color: #0d9785; font-size: 17px; }
.gh-demo-callout-chat { top: 13px; left: 0; }
.gh-demo-callout-routing { top: 13px; right: 18px; }
.gh-demo-callout-translate { top: 51%; right: 18px; }
.gh-demo-callout-leads { right: 0; bottom: 7px; }
.gh-demo-callout-chat::after, .gh-demo-callout-routing::after, .gh-demo-callout-translate::after, .gh-demo-callout-leads::after {
  content: "";
  position: absolute;
  width: 27px;
  height: 2px;
  background: #26bfa9;
  transform-origin: left center;
}
.gh-demo-callout-chat::after { left: 46px; bottom: -9px; transform: rotate(55deg); }
.gh-demo-callout-routing::after { left: 18px; bottom: -9px; transform: rotate(125deg); }
.gh-demo-callout-translate::after { left: -26px; top: 24px; transform: rotate(-17deg); }
.gh-demo-callout-leads::after { left: -23px; top: 22px; transform: rotate(16deg); }

@media (min-width: 1501px) {
  .home-refresh .gh-hero-media {
    width: calc(100% + 82px);
    margin-right: -82px;
  }
}

@media (min-width: 981px) and (max-width: 1500px) {
  .home-refresh .gh-hero-media {
    width: calc(100% + 18px);
    margin-left: -18px;
  }
}

@media (max-width: 1180px) {
  .home-refresh .gh-hero-grid { grid-template-columns: minmax(350px, .77fr) minmax(0, 1.23fr); gap: 20px; }
  .home-refresh .gh-hero-media { margin-right: 0; }
  .gh-demo-window { right: 4px; left: 4px; }
}

@media (max-width: 980px) {
  .home-refresh .gh-hero-grid { grid-template-columns: 1fr; }
  .home-refresh .gh-hero-media { min-height: 560px; margin: 0; }
  .gh-demo-window { right: 12px; left: 12px; }
}

@media (max-width: 660px) {
  .home-refresh .gh-hero-media { min-height: 310px; margin: 8px -8px 0; }
  .gh-demo-window { inset: 42px 2px 39px; border-radius: 7px; }
  .gh-demo-topbar { height: 31px; gap: 7px; padding: 0 8px; }
  .gh-demo-topbar img { width: 79px; }
  .gh-demo-window-dots { gap: 3px; }
  .gh-demo-window-dots i { width: 5px; height: 5px; }
  .gh-demo-workspace { font-size: 7px; }
  .gh-demo-body { grid-template-columns: 28px minmax(0, 35%) minmax(0, 1fr); height: calc(100% - 31px); }
  .gh-demo-sidebar { gap: 3px; padding-top: 8px; }
  .gh-demo-sidebar > span { width: 24px; height: 31px; font-size: 12px; }
  .gh-demo-sidebar > span small { margin-top: 2px; font-size: 6px; }
  .gh-demo-profile { display: none; }
  .gh-demo-list-title { height: 30px; padding: 0 5px; }
  .gh-demo-list-title b { font-size: 8px; }
  .gh-demo-list-title span { font-size: 13px; }
  .gh-demo-list-filter { gap: 4px; padding: 0 5px 6px; font-size: 7px; }
  .gh-demo-contact { height: 44px; gap: 4px; padding: 0 4px; }
  .gh-demo-contact:nth-child(n+5) { display: none; }
  .gh-demo-contact img { width: 22px; height: 22px; }
  .gh-demo-contact b { font-size: 7px; }
  .gh-demo-contact small { margin-top: 3px; font-size: 6px; }
  .gh-demo-contact i { display: none; }
  .gh-demo-chat-head { height: 32px; gap: 5px; padding: 0 6px; }
  .gh-demo-chat-head img { width: 21px; height: 21px; }
  .gh-demo-chat-head b { font-size: 7px; }
  .gh-demo-chat-head small { margin-top: 1px; font-size: 6px; }
  .gh-demo-chat-head i { font-size: 13px; }
  .gh-demo-chat-flow { gap: 5px; padding: 7px 6px 3px; }
  .gh-demo-message { padding: 5px 6px; font-size: 6px; line-height: 1.3; }
  .gh-demo-translation { padding: 5px 6px; }
  .gh-demo-translation span, .gh-demo-translation p { font-size: 6px; }
  .gh-demo-translation p { margin-top: 2px; }
  .gh-demo-note { display: none; }
  .gh-demo-compose { height: 24px; margin: 0 5px 5px; padding: 0 4px; font-size: 6px; }
  .gh-demo-compose b { width: 16px; height: 16px; font-size: 8px; }
  .gh-demo-callout { height: 33px; gap: 5px; padding: 3px 6px 3px 3px; font-size: 8px; }
  .gh-demo-callout span { width: 24px; height: 24px; font-size: 11px; }
  .gh-demo-callout-chat, .gh-demo-callout-routing { top: 2px; }
  .gh-demo-callout-routing { right: 0; }
  .gh-demo-callout-translate { top: auto; right: auto; bottom: 0; left: 0; }
  .gh-demo-callout-leads { right: 0; bottom: 0; }
  .gh-demo-callout::after { display: none; }
}

.home-refresh .gh-hero-media {
  display: flex;
  width: calc(100% + 80px);
  min-height: 560px;
  margin: 0 -66px 0 -14px;
  align-items: center;
}

.gh-hero-unified {
  display: block;
  width: 100%;
  height: auto;
  max-width: none;
}

@media (min-width: 981px) {
  .home-refresh .gh-hero-grid {
    width: min(1240px, calc(100% - 44px));
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.04fr);
  }

  .home-refresh .gh-hero h1 {
    font-size: clamp(31px, 2.86vw, 39px);
  }

  .gh-hero-title-main {
    margin-top: 8px;
    font-size: 1.18em;
  }
}

@media (min-width: 1181px) {
  .home-refresh .gh-hero-media { transform: translateX(-32px); }
}

@media (min-width: 1501px) {
  .home-refresh .gh-hero-media {
    width: calc(100% + 180px);
    margin-right: -166px;
  }
}

@media (max-width: 1180px) {
  .home-refresh .gh-hero-media {
    width: calc(100% + 32px);
    margin: 0 -32px 0 0;
  }
}

@media (max-width: 980px) {
  .home-refresh .gh-hero-media {
    width: 100%;
    min-height: 0;
    margin: 0;
  }
}

/* Chinese homepage: product capabilities followed by one customer journey. */
.gh-story-intro { padding-block: 68px 0; background: #fff; }
.gh-story-intro-top { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .72fr); gap: 10px 60px; align-items: end; }
.gh-story-intro-top .kicker { grid-column: 1 / -1; margin: 0 0 5px; }
.gh-story-intro-top > p:last-child { max-width: 445px; margin: 0 0 3px; color: #557080; font-size: 15px; line-height: 1.75; }
.gh-story-intro h2,
.gh-next-heading h2,
.gh-next-flow-copy h2,
.gh-next-deal-copy h2,
.gh-next-relationship-copy h2,
.gh-next-oversight h2,
.gh-next-scenarios h2,
.gh-next-voices h2,
.gh-next-trial h2 { margin: 0; color: #102c3c; font-size: clamp(32px, 3.4vw, 46px); line-height: 1.18; }
.gh-story-progress { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 38px; border-top: 1px solid #d8e6e8; border-bottom: 1px solid #d8e6e8; }
.gh-story-progress > div { display: flex; align-items: center; gap: 16px; padding: 18px 25px; color: #17394b; font-size: 16px; font-weight: 800; }
.gh-story-progress > div:first-child { padding-left: 0; }
.gh-story-progress > div + div { border-left: 1px solid #d8e6e8; }
.gh-story-progress b { color: #149b8a; font-size: 12px; }

.gh-next-product { padding-block: 78px 91px; background: #f1f8f9; }
.gh-next-heading { display: grid; grid-template-columns: 1fr 390px; align-items: end; gap: 58px; margin-bottom: 37px; }
.gh-next-heading .kicker { margin-bottom: 16px; }
.gh-next-heading > p { margin: 0 0 3px; color: #557080; font-size: 16px; line-height: 1.8; }
.gh-capability-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-bottom: 39px; border-top: 1px solid #cbdfe3; border-bottom: 1px solid #cbdfe3; }
.gh-capability-grid > div { min-height: 116px; padding: 17px 27px 19px 0; }
.gh-capability-grid > div:nth-child(3n+2), .gh-capability-grid > div:nth-child(3n+3) { padding-left: 26px; border-left: 1px solid #cbdfe3; }
.gh-capability-grid > div:nth-child(n+4) { border-top: 1px solid #cbdfe3; }
.gh-capability-grid span { display: block; margin-bottom: 7px; color: #168c81; font-size: 11px; font-weight: 800; }
.gh-capability-grid h3 { margin: 0 0 5px; color: #16384a; font-size: 18px; line-height: 1.3; }
.gh-capability-grid p { margin: 0; color: #617a87; font-size: 12px; line-height: 1.55; }
.gh-product-preview-label { display: flex; align-items: baseline; gap: 17px; margin: 0 0 14px; color: #17394b; font-size: 14px; font-weight: 800; }
.gh-product-preview-label span { color: #66818d; font-size: 12px; font-weight: 400; }
.gh-next-app { overflow: hidden; border: 1px solid #cbdae3; border-radius: 7px; background: #fff; box-shadow: 0 25px 65px rgba(26, 69, 86, .12); }
.gh-next-app-bar { display: flex; height: 52px; align-items: center; gap: 30px; padding: 0 19px; border-bottom: 1px solid #e0e9ee; background: #fff; color: #748998; font-size: 11px; }
.gh-next-app-bar b { display: flex; align-items: center; gap: 7px; color: #0f2e40; font-size: 16px; }
.gh-next-app-bar > img { width: 112px; height: 33px; object-fit: contain; object-position: left center; }
.gh-next-logo-dot { display: block; width: 20px; height: 20px; border: 5px solid #12a995; border-right-color: #2b78d4; border-radius: 50%; }
.gh-next-app-bar strong { margin-left: auto; color: #188570; font-size: 11px; }
.gh-next-app-body { display: grid; grid-template-columns: 92px 235px minmax(290px, 1fr) 218px; min-height: 467px; }
.gh-next-app-nav { display: flex; flex-direction: column; gap: 8px; padding: 20px 10px; background: #102a3d; color: #adbfca; font-size: 11px; }
.gh-next-app-nav b { margin: 0 0 14px 4px; color: #fff; font-size: 11px; }
.gh-next-app-nav span { padding: 9px 10px; border-radius: 4px; }
.gh-next-app-nav .is-current { color: #fff; background: #1968b5; }
.gh-next-app-nav small { margin: auto 0 0 5px; color: #7fa0b1; font-size: 10px; }
.gh-next-app-list { border-right: 1px solid #e3ebf0; background: #fff; }
.gh-next-app-list-head { display: flex; justify-content: space-between; padding: 24px 14px 11px; color: #102f40; font-size: 13px; }
.gh-next-app-list-head small { color: #0e9e8d; font-size: 10px; }
.gh-next-app-filters { display: flex; gap: 11px; padding: 0 14px 17px; border-bottom: 1px solid #e3ebf0; color: #8395a2; font-size: 10px; }
.gh-next-app-filters .is-current { color: #118e85; font-weight: 800; }
.gh-next-app-person { display: flex; min-width: 0; gap: 9px; align-items: center; padding: 14px 10px; border-bottom: 1px solid #eff3f5; }
.gh-next-app-person.is-current { background: #e9f6f7; }
.gh-next-app-person i,
.gh-next-profile-id i,
.gh-next-routing-result i,
.gh-next-customer-name i { display: grid; flex: none; place-items: center; border-radius: 50%; background: #d2eaf4; color: #176d91; font-size: 10px; font-style: normal; font-weight: 850; }
.gh-next-app-person i { width: 33px; height: 33px; }
.gh-next-app-person > img { width: 33px; height: 33px; flex: none; border-radius: 50%; object-fit: cover; }
.gh-next-app-person:nth-of-type(3) i { background: #f5e6d5; color: #956437; }
.gh-next-app-person:nth-of-type(4) i { background: #e8e2f6; color: #7453aa; }
.gh-next-app-person > div { min-width: 0; }
.gh-next-app-person b, .gh-next-app-person small { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.gh-next-app-person b { color: #193849; font-size: 11px; }
.gh-next-app-person small { max-width: 135px; margin-top: 5px; color: #788e9b; font-size: 10px; }
.gh-next-app-person em { align-self: flex-start; margin-left: auto; color: #a1afb8; font-size: 9px; font-style: normal; white-space: nowrap; }
.gh-next-app-chat { display: flex; min-width: 0; flex-direction: column; background: #f9fbfc; }
.gh-next-app-chat-head { display: flex; justify-content: space-between; align-items: center; min-height: 65px; padding: 12px 20px; border-bottom: 1px solid #e3ebf0; background: #fff; }
.gh-next-app-chat-head b, .gh-next-app-chat-head small { display: block; }
.gh-next-app-chat-head b { font-size: 13px; }
.gh-next-app-chat-head small { margin-top: 4px; color: #19917e; font-size: 10px; }
.gh-next-app-chat-head > span { color: #728c9b; font-size: 10px; }
.gh-next-app-messages { display: flex; flex: 1; flex-direction: column; align-items: flex-start; gap: 14px; padding: 32px 24px 14px; }
.gh-next-app-messages > div { max-width: 86%; padding: 10px 13px; border-radius: 7px; font-size: 11px; line-height: 1.6; }
.gh-next-app-messages .inbound { background: #e8edf1; color: #244254; }
.gh-next-app-messages .gh-next-translation { border: 1px solid #cbdffc; background: #f0f6ff; color: #2b548b; }
.gh-next-translation b { display: block; margin-bottom: 4px; color: #1673d3; font-size: 10px; }
.gh-next-translation p { margin: 0; }
.gh-next-app-messages .outbound { align-self: flex-end; background: #dbf3ee; color: #185b53; }
.gh-next-app-messages .gh-next-internal { max-width: 100%; background: #fff5e4; color: #8b6238; font-size: 10px; }
.gh-next-app-compose { display: flex; justify-content: space-between; align-items: center; min-height: 43px; margin: 0 16px 16px; padding: 8px 8px 8px 12px; border: 1px solid #dfe8ed; border-radius: 5px; background: #fff; color: #9eacb5; font-size: 10px; }
.gh-next-app-compose b { padding: 6px 10px; border-radius: 3px; background: #1975cf; color: #fff; }
.gh-next-app-profile { padding: 22px 16px; border-left: 1px solid #e3ebf0; background: #fff; color: #193849; font-size: 11px; }
.gh-next-app-profile > b { display: block; margin-bottom: 25px; }
.gh-next-profile-id { display: flex; align-items: center; gap: 10px; padding-bottom: 20px; border-bottom: 1px solid #e7edf0; }
.gh-next-profile-id i { width: 42px; height: 42px; }
.gh-next-profile-id > img { width: 42px; height: 42px; flex: none; border-radius: 50%; object-fit: cover; }
.gh-next-profile-id strong, .gh-next-profile-id small { display: block; }
.gh-next-profile-id small { margin-top: 4px; color: #188e7e; font-size: 10px; }
.gh-next-app-profile dl { margin: 11px 0 0; }
.gh-next-app-profile dt { margin-top: 13px; color: #8ba0aa; font-size: 10px; }
.gh-next-app-profile dd { margin: 3px 0 0; font-weight: 750; }
.gh-next-profile-note { margin-top: 22px; padding: 13px; background: #edf8f6; color: #507b7b; font-size: 10px; }
.gh-next-profile-note strong { display: block; margin-top: 6px; color: #1b5654; }
.gh-next-product-foot { display: flex; justify-content: center; gap: 38px; margin-top: 20px; color: #4e6e7e; font-size: 12px; }
.gh-next-product-foot span::before { content: ""; display: inline-block; width: 6px; height: 6px; margin-right: 8px; border-radius: 50%; background: #159c8d; vertical-align: middle; }

.gh-next-flow { padding-block: 91px; background: #fff; }
.gh-next-flow-grid,
.gh-next-relationship-grid,
.gh-next-deal-grid { display: grid; grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr); gap: 90px; align-items: center; }
.gh-next-flow-copy .kicker,
.gh-next-deal-copy .kicker,
.gh-next-relationship-copy .kicker { margin-bottom: 18px; }
.gh-next-flow-copy p:not(.kicker),
.gh-next-deal-copy p:not(.kicker),
.gh-next-relationship-copy p:not(.kicker) { max-width: 520px; margin: 19px 0 0; color: #567181; font-size: 16px; line-height: 1.82; }
.gh-next-flow-copy ul { display: grid; gap: 10px; margin: 26px 0 0; padding: 0; list-style: none; color: #315568; font-size: 14px; font-weight: 700; }
.gh-next-flow-copy li::before { content: ""; display: inline-block; width: 6px; height: 6px; margin-right: 12px; border-radius: 50%; background: #169e8c; vertical-align: middle; }
.gh-next-routing { padding: 0 24px 24px; border: 1px solid #d5e3e9; border-radius: 6px; background: #f8fbfc; box-shadow: 0 18px 42px rgba(15, 55, 75, .09); }
.gh-next-routing-top { display: flex; justify-content: space-between; padding: 20px 0; border-bottom: 1px solid #dfe8ec; font-size: 14px; }
.gh-next-routing-top span { color: #159486; font-size: 11px; }
.gh-next-routing-row { display: grid; grid-template-columns: 85px 1fr auto; align-items: center; gap: 10px; margin-top: 24px; padding: 16px 18px; border: 1px solid #dfe7eb; background: #fff; }
.gh-next-routing-row small { color: #158f85; font-size: 11px; }
.gh-next-routing-row strong { color: #1b3848; font-size: 13px; }
.gh-next-routing-row em { color: #a57038; font-size: 10px; font-style: normal; }
.gh-next-routing-rule { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin: 20px 0 0 37px; padding: 16px 18px; border-left: 2px solid #17a99a; background: #eaf7f5; }
.gh-next-routing-rule span { margin-right: 7px; color: #528082; font-size: 11px; }
.gh-next-routing-rule b { padding: 6px 10px; border: 1px solid #c6e2df; background: #fff; color: #216b67; font-size: 11px; }
.gh-next-routing-arrow { margin: 5px 0 5px 39px; color: #13a18f; font-size: 24px; }
.gh-next-routing-result { display: flex; align-items: center; gap: 12px; margin-left: 37px; padding: 16px 18px; border: 1px solid #cfe0ec; background: #fff; }
.gh-next-routing-result i { width: 36px; height: 36px; }
.gh-next-routing-result > img { width: 36px; height: 36px; flex: none; border-radius: 50%; object-fit: cover; }
.gh-next-routing-result small, .gh-next-routing-result b { display: block; }
.gh-next-routing-result small { color: #8aa0aa; font-size: 10px; }
.gh-next-routing-result b { margin-top: 3px; color: #1d3e52; font-size: 13px; }
.gh-next-routing-result strong { margin-left: auto; color: #168d78; font-size: 11px; }
.gh-next-routing-bottom { display: flex; gap: 20px; margin: 21px 0 0 38px; color: #587482; font-size: 11px; }
.gh-next-routing-bottom span::before { content: "✓"; margin-right: 6px; color: #12a48d; }

.gh-next-deal { padding-block: 92px; background: #edf6f6; }
.gh-next-deal-grid { grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr); }
.gh-deal-ui { overflow: hidden; border: 1px solid #d0e0e5; border-radius: 6px; background: #fff; box-shadow: 0 18px 42px rgba(15, 55, 75, .1); }
.gh-deal-ui-top { display: flex; justify-content: space-between; gap: 20px; padding: 18px 22px; border-bottom: 1px solid #e3ecee; color: #18384a; font-size: 13px; }
.gh-deal-ui-top span { color: #829aa5; font-size: 11px; }
.gh-deal-ui-main { padding: 23px 25px 25px; }
.gh-deal-client { display: flex; align-items: center; gap: 11px; }
.gh-deal-client img, .gh-next-customer-name img { width: 43px; height: 43px; flex: none; border-radius: 50%; object-fit: cover; }
.gh-deal-client strong, .gh-deal-client small { display: block; }
.gh-deal-client strong { color: #15384a; font-size: 14px; }
.gh-deal-client small { margin-top: 4px; color: #8197a3; font-size: 11px; }
.gh-deal-client em { margin-left: auto; padding: 6px 8px; background: #e5f3f9; color: #226c9b; font-size: 10px; font-style: normal; white-space: nowrap; }
.gh-deal-stages { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 5px; margin-top: 28px; }
.gh-deal-stages span { min-width: 0; padding: 9px 5px; background: #f0f3f5; color: #8296a0; font-size: 10px; text-align: center; white-space: nowrap; }
.gh-deal-stages .is-done { background: #e0f2ed; color: #137c66; }
.gh-deal-stages .is-current { background: #1a9a89; color: #fff; font-weight: 800; }
.gh-deal-content { display: grid; gap: 0; margin-top: 22px; border-top: 1px solid #e3ecee; }
.gh-deal-content > div { display: grid; grid-template-columns: 100px 1fr; gap: 10px; padding: 12px 0; border-bottom: 1px solid #e3ecee; }
.gh-deal-content small { color: #8aa0a9; font-size: 11px; }
.gh-deal-content b { color: #24495a; font-size: 11px; }
.gh-deal-next { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 13px; margin-top: 18px; padding: 14px; border-left: 3px solid #1ca793; background: #edf8f5; }
.gh-deal-next span { color: #158877; font-size: 10px; font-weight: 800; }
.gh-deal-next strong { color: #204f50; font-size: 11px; }
.gh-deal-next small { margin-left: auto; color: #608681; font-size: 10px; }
.gh-story-proof { display: grid; gap: 7px; margin-top: 27px; padding: 18px 0 0 19px; border-left: 3px solid #e0a85d; }
.gh-story-proof b { color: #17384a; font-size: 15px; }
.gh-story-proof span { color: #5c7884; font-size: 13px; }

.gh-next-relationship { padding-block: 106px; background: #f6f9fd; }
.gh-next-relationship-grid { grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr); }
.gh-next-relationship-copy .text-link { display: inline-block; margin-top: 26px; }
.gh-next-customer-ui { overflow: hidden; border: 1px solid #d4e1e8; border-radius: 6px; background: #fff; box-shadow: 0 18px 42px rgba(15, 55, 75, .09); }
.gh-next-customer-top { display: flex; justify-content: space-between; padding: 18px 23px; border-bottom: 1px solid #e4ebef; color: #1e4356; font-size: 13px; }
.gh-next-customer-top span { color: #8ba0aa; font-size: 11px; }
.gh-next-customer-main { padding: 24px 26px 26px; }
.gh-next-customer-name { display: flex; align-items: center; gap: 13px; }
.gh-next-customer-name i { width: 48px; height: 48px; background: #ede7db; color: #956539; }
.gh-next-customer-name b, .gh-next-customer-name small { display: block; }
.gh-next-customer-name b { color: #17394b; font-size: 16px; }
.gh-next-customer-name small { margin-top: 4px; color: #8297a2; font-size: 11px; }
.gh-next-customer-name > span { margin-left: auto; padding: 6px 8px; background: #e5f5eb; color: #168460; font-size: 10px; }
.gh-next-customer-tabs { display: flex; gap: 26px; margin-top: 26px; border-bottom: 1px solid #e1e9ee; color: #879ba6; font-size: 11px; }
.gh-next-customer-tabs > * { display: block; padding-bottom: 11px; }
.gh-next-customer-tabs b { border-bottom: 2px solid #177cce; color: #176bbb; }
.gh-next-timeline { display: grid; gap: 0; margin: 18px 0 0 9px; border-left: 1px solid #cfdfe6; }
.gh-next-timeline > div { display: flex; gap: 16px; padding: 0 0 17px; transform: translateX(-5px); }
.gh-next-timeline i { width: 9px; height: 9px; margin-top: 4px; flex: none; border: 2px solid #fff; border-radius: 50%; background: #19a78f; box-shadow: 0 0 0 1px #19a78f; }
.gh-next-timeline b, .gh-next-timeline small { display: block; }
.gh-next-timeline b { color: #234656; font-size: 11px; }
.gh-next-timeline small { margin-top: 4px; color: #91a2ad; font-size: 10px; }
.gh-next-customer-task { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 12px 14px; border: 1px solid #d9e6f5; background: #f3f8fe; color: #2b638e; font-size: 11px; }
.gh-next-customer-task span { color: #7994ac; }
.gh-next-customer-task small { margin-left: auto; color: #7994ac; font-size: 10px; }

.home-refresh .gh-next-oversight { padding: 58px 0 52px; background: #eaf4f2; }
.gh-next-oversight-inner { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); column-gap: 76px; row-gap: 30px; }
.gh-next-oversight-intro { align-self: center; }
.gh-next-oversight h2 { color: #123547; font-size: clamp(36px, 3.5vw, 48px); line-height: 1.18; }
.gh-next-oversight h2 span { color: #0d867b; }
.gh-next-oversight-detail { align-self: center; }
.gh-next-oversight-detail > p { max-width: 490px; margin: 0; color: #45616c; font-size: 16px; line-height: 1.65; }
.gh-next-oversight-promise { margin: 18px 0 0; padding: 0; border-top: 1px solid #bfd8d5; list-style: none; }
.gh-next-oversight-promise li { display: grid; grid-template-columns: 33px minmax(0, 1fr); gap: 15px; padding: 9px 0; border-bottom: 1px solid #bfd8d5; }
.gh-next-oversight-promise li > b { padding-top: 3px; color: #0e877b; font-size: 14px; font-weight: 800; }
.gh-next-oversight-promise strong { display: block; color: #153f4d; font-size: 17px; line-height: 1.3; }
.gh-next-oversight-promise p { margin: 3px 0 0; color: #57737c; font-size: 13px; line-height: 1.4; }
.gh-next-oversight-footnote { grid-column: 1 / -1; display: grid; grid-template-columns: 250px minmax(0, 1fr); align-items: center; gap: 28px; padding: 17px 23px; border-top: 1px solid #bfd8d5; border-bottom: 1px solid #bfd8d5; border-left: 3px solid #0e8c7d; background: rgba(255, 255, 255, .28); }
.gh-next-oversight-footnote b { color: #0c726d; font-size: 21px; line-height: 1.35; }
.gh-next-oversight-signals { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: center; color: #234f58; font-size: 17px; font-weight: 700; }
.gh-next-oversight-signals span { text-align: center; }
.gh-next-oversight-signals span + span { border-left: 1px solid #bfd8d5; }

.gh-next-scenarios { padding-block: 94px 100px; background: #f6f8fa; }
.gh-next-scenarios-head { max-width: 800px; margin: 0 auto 43px; text-align: center; }
.gh-next-scenarios-head .kicker { margin-bottom: 13px; }
.gh-next-scenarios-head h2 { color: #123547; font-size: clamp(34px, 3.3vw, 46px); }
.gh-next-scenarios-head > p:last-child { margin: 17px 0 0; color: #607b89; font-size: 16px; line-height: 1.7; }
.gh-next-scenarios-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.gh-next-scenarios-grid a { display: flex; min-width: 0; flex-direction: column; color: inherit; text-decoration: none; }
.gh-next-scenarios-grid img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 10; margin-bottom: 18px; border-radius: 6px; object-fit: cover; }
.gh-next-scenarios-grid a > span { align-self: flex-start; padding: 4px 9px; border-radius: 4px; background: #dfefec; color: #0b7971; font-size: 11px; font-weight: 800; }
.gh-next-scenarios-grid h3 { margin: 13px 0 9px; color: #173448; font-size: 20px; line-height: 1.4; }
.gh-next-scenarios-grid p { margin: 0 0 12px; color: #5b7481; font-size: 13px; line-height: 1.7; }
.gh-next-scenarios-grid small { color: #72909a; font-size: 11px; line-height: 1.5; }
.gh-next-scenarios-grid em { display: flex; align-items: center; gap: 6px; margin-top: auto; padding-top: 16px; color: #117f76; font-size: 13px; font-style: normal; font-weight: 800; }
.gh-next-scenarios-grid em b { font-size: 19px; font-weight: 400; line-height: 1; }
.gh-next-scenarios-grid a:hover h3, .gh-next-scenarios-grid a:focus-visible h3 { color: #087c72; }
.gh-next-scenarios-more { display: flex; width: fit-content; align-items: center; gap: 9px; margin: 36px auto 0; color: #0a786f; font-size: 14px; font-weight: 800; }
.gh-next-scenarios-more span { font-size: 19px; font-weight: 400; }

.gh-next-voices { overflow: hidden; padding-block: 88px 96px; background: #f2f6f9; }
.gh-next-voices-head { display: flex; justify-content: space-between; align-items: end; gap: 28px; }
.gh-next-voices-head .kicker { margin-bottom: 12px; }
.gh-next-voices-head h2 { font-size: clamp(32px, 3.2vw, 43px); }
.gh-review-subtitle { margin: 15px 0 0; color: #587080; font-size: 17px; line-height: 1.65; }
.gh-review-marquee { width: min(1230px, calc(100% - 44px)); margin: 32px auto 0; overflow-x: auto; padding: 6px 0 18px; scrollbar-width: thin; scrollbar-color: #9ac4cd transparent; }
.gh-review-track, .gh-review-set { display: flex; width: max-content; }
.gh-review-set { flex: none; gap: 20px; padding-right: 20px; }
.gh-review-card { position: relative; display: flex; width: 390px; min-height: 400px; flex: none; flex-direction: column; margin: 0; padding: 30px 32px 27px; border: 1px solid #dce5ee; border-radius: 7px; background: #fff; box-shadow: 0 16px 32px rgba(29, 57, 88, .08); }
.gh-review-card::after { content: "“"; position: absolute; top: 10px; right: 26px; color: #e1ebef; font-family: Georgia, serif; font-size: 72px; line-height: 1; }
.gh-review-stars { color: #f59e0b; font-size: 22px; font-weight: 800; line-height: 1; white-space: nowrap; }
.gh-review-card > p { margin: 28px 0; color: #293f50; font-size: 16px; line-height: 1.75; }
.gh-review-card footer { display: flex; align-items: center; gap: 14px; margin-top: auto; padding-top: 20px; border-top: 1px solid #e5edf1; }
.gh-review-avatar { display: grid; width: 54px; height: 54px; flex: none; place-items: center; border-radius: 50%; background: #dcefea; color: #117a70; font-size: 21px; font-weight: 850; }
.gh-review-card:nth-child(3n+2) .gh-review-avatar { background: #e2e9f8; color: #366baa; }
.gh-review-card:nth-child(3n) .gh-review-avatar { background: #f7ead9; color: #a96932; }
.gh-review-card footer b, .gh-review-card footer small { display: block; }
.gh-review-card footer b { color: #183647; font-size: 18px; line-height: 1.3; }
.gh-review-card footer small { margin-top: 5px; color: #647d8a; font-size: 14px; line-height: 1.35; }
.gh-review-marquee.is-ready { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 26px, #000 calc(100% - 26px), transparent); mask-image: linear-gradient(90deg, transparent, #000 26px, #000 calc(100% - 26px), transparent); }
.gh-review-marquee.is-ready .gh-review-track { animation: gh-review-scroll 120s linear infinite; will-change: transform; backface-visibility: hidden; }
@keyframes gh-review-scroll { to { transform: translate3d(-50%, 0, 0); } }

.gh-next-trial { padding-block: 76px 80px; background: #10394a; color: #fff; }
.gh-next-trial-grid { max-width: 860px; }
.gh-next-trial-copy { text-align: center; }
.gh-next-trial .kicker { color: #82ded0; }
.gh-next-trial h2 { max-width: 760px; margin-inline: auto; color: #fff; font-size: clamp(36px, 3.5vw, 50px); line-height: 1.23; }
.gh-next-trial-brand { color: #82ded0; }
.gh-next-trial-copy > p:not(.kicker) { max-width: 680px; margin: 22px auto 26px; color: #c3d6de; font-size: 16px; line-height: 1.8; }
.gh-next-trial-actions { display: inline-grid; gap: 11px; }
.gh-next-trial-actions > small { color: #9fc6cb; font-size: 12px; line-height: 1.45; }
.gh-next-trial .action-row { justify-content: center; gap: 16px; }
.gh-next-trial .action-row .primary { min-height: 50px; padding-inline: 24px; }
.gh-next-trial-contact { border-color: rgba(255,255,255,.18); color: #cbdde3; background: transparent; font-weight: 700; }
.gh-next-trial-contact:hover { border-color: rgba(255,255,255,.35); color: #fff; background: rgba(255,255,255,.06); }

@media (max-width: 1080px) {
  .gh-next-app-body { grid-template-columns: 72px 205px minmax(255px,1fr) 170px; }
  .gh-next-flow-grid, .gh-next-deal-grid, .gh-next-relationship-grid { gap: 45px; }
  .gh-next-scenarios-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 24px; }
}
@media (max-width: 850px) {
  .gh-story-intro-top, .gh-next-heading, .gh-next-flow-grid, .gh-next-deal-grid, .gh-next-relationship-grid { grid-template-columns: 1fr; gap: 28px; }
  .gh-story-intro-top .kicker { grid-column: auto; }
  .gh-capability-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gh-capability-grid > div:nth-child(n) { padding-left: 0; border-left: 0; }
  .gh-capability-grid > div:nth-child(even) { padding-left: 22px; border-left: 1px solid #cbdfe3; }
  .gh-capability-grid > div:nth-child(n+3) { border-top: 1px solid #cbdfe3; }
  .gh-next-heading > p { max-width: 690px; }
  .gh-next-app { overflow-x: auto; }
  .gh-next-app-bar, .gh-next-app-body { min-width: 800px; }
  .gh-next-relationship-grid { gap: 36px; }
  .gh-next-oversight-inner { grid-template-columns: 1fr; gap: 32px; }
  .gh-next-oversight-intro { align-self: start; }
  .gh-next-oversight-detail { max-width: 600px; }
  .gh-next-oversight-footnote { grid-column: auto; }
}
@media (max-width: 600px) {
  .gh-next-product, .gh-next-flow, .gh-next-deal, .gh-next-relationship, .gh-next-oversight, .gh-next-scenarios, .gh-next-voices, .gh-next-trial { padding-block: 66px; }
  .gh-story-intro { padding-top: 66px; }
  .gh-story-intro h2, .gh-next-heading h2, .gh-next-flow-copy h2, .gh-next-deal-copy h2, .gh-next-relationship-copy h2, .gh-next-oversight h2, .gh-next-scenarios h2, .gh-next-voices h2, .gh-next-trial h2 { font-size: 31px; }
  .gh-capability-grid { grid-template-columns: 1fr; }
  .gh-capability-grid > div:nth-child(n) { min-height: 0; padding: 15px 0; border-left: 0; }
  .gh-capability-grid > div + div { border-top: 1px solid #cbdfe3; }
  .gh-product-preview-label { display: block; }
  .gh-product-preview-label span { display: block; margin-top: 4px; }
  .gh-story-progress > div { display: grid; gap: 5px; padding: 13px; font-size: 12px; }
  .gh-story-progress > div:first-child { padding-left: 0; }
  .gh-next-app { overflow: hidden; }
  .gh-next-app-bar, .gh-next-app-body { min-width: 0; }
  .gh-next-app-bar { height: 45px; gap: 12px; padding-inline: 10px; }
  .gh-next-app-bar > img { width: 95px; height: 30px; }
  .gh-next-app-bar > span { font-size: 9px; }
  .gh-next-app-bar > strong { display: none; }
  .gh-next-app-body { grid-template-columns: 91px minmax(0,1fr); min-height: 412px; }
  .gh-next-app-nav, .gh-next-app-profile, .gh-next-app-filters { display: none; }
  .gh-next-app-list-head { display: block; padding: 13px 5px; font-size: 9px; }
  .gh-next-app-list-head small { display: block; margin-top: 3px; font-size: 8px; }
  .gh-next-app-person { gap: 4px; min-height: 58px; padding: 7px 4px; }
  .gh-next-app-person > img { width: 22px; height: 22px; }
  .gh-next-app-person b { font-size: 8px; }
  .gh-next-app-person small { max-width: 53px; font-size: 7px; }
  .gh-next-app-person em { display: none; }
  .gh-next-app-chat-head { min-height: 49px; padding: 8px; }
  .gh-next-app-chat-head b { font-size: 10px; }
  .gh-next-app-chat-head small, .gh-next-app-chat-head > span { font-size: 8px; }
  .gh-next-app-messages { gap: 7px; padding: 14px 7px 7px; }
  .gh-next-app-messages > div { padding: 7px 8px; font-size: 8px; }
  .gh-next-translation b { font-size: 8px; }
  .gh-next-app-messages .gh-next-internal { font-size: 7px; }
  .gh-next-app-compose { min-height: 34px; margin: 0 6px 8px; padding: 5px; font-size: 7px; }
  .gh-next-app-compose b { padding: 5px; }
  .gh-next-routing { padding-inline: 15px; }
  .gh-next-routing-row { grid-template-columns: 1fr; }
  .gh-next-routing-rule, .gh-next-routing-result, .gh-next-routing-arrow, .gh-next-routing-bottom { margin-left: 0; }
  .gh-deal-ui-main { padding: 17px; }
  .gh-deal-client { flex-wrap: wrap; }
  .gh-deal-client em { margin-left: 0; }
  .gh-deal-stages { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gh-deal-content > div { grid-template-columns: 82px 1fr; }
  .gh-deal-next small { margin-left: 0; }
  .gh-next-customer-main { padding-inline: 16px; }
  .gh-next-customer-name { flex-wrap: wrap; }
  .gh-next-customer-name > span { margin-left: 0; }
  .gh-next-customer-task small { margin-left: 0; }
  .gh-next-oversight-inner { gap: 26px; }
  .gh-next-oversight-detail > p { font-size: 15px; }
  .gh-next-oversight-footnote { display: block; padding: 20px 18px; }
  .gh-next-oversight-signals { margin-top: 12px; font-size: 12px; }
  .gh-next-scenarios-grid { grid-template-columns: 1fr; gap: 36px; }
  .gh-next-scenarios-grid img { aspect-ratio: 16 / 9; }
  .gh-next-voices-head { align-items: flex-start; flex-direction: column; }
  .gh-review-card { width: 300px; min-height: 450px; padding: 24px; }
  .gh-review-card > p { font-size: 15px; }
  .gh-review-marquee.is-ready .gh-review-track { animation-duration: 160s; }
  .gh-next-trial-actions { display: grid; width: 100%; }
  .gh-next-trial .action-row { align-items: stretch; flex-direction: column; }
  .gh-next-trial .button { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .gh-review-marquee.is-ready { overflow-x: auto; }
  .gh-review-marquee.is-ready .gh-review-track { animation: none; }
}

/* Chinese homepage feature gallery and customer-journey art. */
.gh-next-product { padding-block: 86px 94px; background: #f5f8fb; }
.gh-next-product .container { max-width: 1200px; }
.gh-next-heading { display: block; max-width: 960px; margin: 0 auto 42px; text-align: center; }
.gh-next-heading .kicker { margin: 0 0 14px; color: #087f77; }
.gh-next-heading h2 { font-size: clamp(34px, 3.3vw, 44px); }
.gh-next-heading > p:last-child { max-width: 760px; margin: 15px auto 0; color: #5b7181; font-size: 16px; line-height: 1.7; }
.gh-capability-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin: 0; border: 0; }
.gh-capability { display: flex; min-width: 0; min-height: 198px; align-items: center; gap: 13px; padding: 15px; border: 1px solid #dce7ee; border-radius: 8px; background: #fff; box-shadow: 0 12px 26px rgba(31, 66, 88, .055); }
.gh-capability > div { min-width: 0; }
.gh-feature-art { display: block; width: 139px; height: 139px; flex: 0 0 139px; border-radius: 5px; background-image: url("assets/home-zh-feature-vignettes-v3.png"); background-size: 300% 200%; background-repeat: no-repeat; }
.gh-feature-art-1 { background-position: 0 0; }
.gh-feature-art-2 { background-position: 50% 0; }
.gh-feature-art-3 { background-position: 100% 0; }
.gh-feature-art-4 { background-position: 0 100%; }
.gh-feature-art-5 { background-position: 50% 100%; }
.gh-feature-art-6 { background-position: 100% 100%; }
.gh-capability h3 { margin: 0 0 10px; color: #162d3e; font-size: 18px; line-height: 1.35; }
.gh-capability p { margin: 0; color: #607789; font-size: 13px; line-height: 1.65; }

.gh-story-intro, .gh-next-flow, .gh-next-deal, .gh-next-relationship { background: #0f1b2b; color: #fff; }
.gh-story-intro { padding-block: 82px 0; }
.gh-story-intro-top { display: block; max-width: 930px; margin: auto; text-align: center; }
.gh-story-intro-top .kicker { margin: 0 0 20px; color: #79ddd0; }
.gh-story-intro h2 { color: #fff; font-size: clamp(38px, 3.8vw, 52px); line-height: 1.2; }
.gh-story-intro h2 span { color: #91e8d9; }
.gh-story-intro-top > p:last-child { max-width: 720px; margin: 23px auto 0; color: #b1c3d0; font-size: 17px; line-height: 1.75; }
.gh-story-progress { position: relative; max-width: 1040px; margin: 55px auto 0; border: 0; }
.gh-story-progress::before { content: ""; position: absolute; top: 10px; left: 16.666%; right: 16.666%; height: 1px; background: rgba(114, 221, 203, .38); }
.gh-story-progress > div { position: relative; justify-content: center; gap: 12px; padding: 37px 15px 31px; border: 0; color: #e8f2f4; }
.gh-story-progress > div::before { content: ""; position: absolute; top: 3px; left: 50%; width: 14px; height: 14px; transform: translateX(-50%); border: 2px solid #72ddcb; border-radius: 50%; background: #0f1b2b; box-shadow: 0 0 0 5px rgba(114, 221, 203, .1); }
.gh-story-progress > div + div { border: 0; }
.gh-story-progress b { color: #72ddcb; font-size: 23px; font-weight: 750; line-height: 1; }
.gh-story-progress span { color: #f3fbfb; font-size: 18px; font-weight: 750; line-height: 1.2; }
.gh-next-flow, .gh-next-deal, .gh-next-relationship { padding-block: 26px; border-top: 1px solid rgba(217, 237, 244, .12); }
.gh-next-flow-grid, .gh-next-deal-grid, .gh-next-relationship-grid { grid-template-columns: minmax(0, .86fr) minmax(0, 1.14fr); gap: 56px; }
.gh-next-flow-copy .kicker, .gh-next-deal-copy .kicker, .gh-next-relationship-copy .kicker { color: #72ddcb; }
.gh-next-flow-copy h2, .gh-next-deal-copy h2, .gh-next-relationship-copy h2 { color: #fff; font-size: clamp(34px, 3.15vw, 44px); }
.gh-next-flow-copy p:not(.kicker), .gh-next-deal-copy p:not(.kicker), .gh-next-relationship-copy p:not(.kicker) { color: #b9c9d5; font-size: 16px; line-height: 1.85; }
.gh-next-flow-copy ul { color: #d6e8ed; font-size: 13px; }
.gh-next-flow-copy li::before { background: #67d7c7; }
.gh-next-relationship-copy .text-link { color: #83e1d5; }
.gh-story-proof { border-color: #65d7c5; }
.gh-story-proof b { color: #f2fafb; }
.gh-story-proof span { color: #b1c7d1; }
.gh-story-visual { min-width: 0; margin: 0; }
.gh-story-visual img { display: block; width: 100%; height: auto; mask-image: linear-gradient(to right, transparent, #000 6%, #000 94%, transparent), linear-gradient(to bottom, transparent, #000 6%, #000 94%, transparent); mask-composite: intersect; }
.gh-next-flow-copy .kicker, .gh-next-deal-copy .kicker, .gh-next-relationship-copy .kicker { color: #72ddcb; }
.gh-story-capabilities { display: flex; flex-wrap: wrap; gap: 9px; max-width: 520px; margin: 25px 0 0; padding: 0; list-style: none; }
.gh-story-capabilities li { display: inline-flex; align-items: center; gap: 8px; min-height: 35px; padding: 6px 12px 6px 10px; border: 1px solid rgba(103, 215, 199, .36); border-radius: 18px; background: #173137; color: #d5efea; font-size: 13px; font-weight: 700; line-height: 1.3; white-space: nowrap; }
.gh-story-capabilities li::before { content: "✓"; display: inline-block; position: static; width: auto; height: auto; flex: none; margin: 0; border: 0; border-radius: 0; background: none; color: #72ddcb; font-size: 14px; font-weight: 800; line-height: 1; }
.gh-next-flow-copy ul.gh-story-capabilities { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 25px; }
.gh-story-result { display: grid; gap: 10px; max-width: 530px; margin-top: 34px; padding: 5px 0 5px 20px; border-left: 3px solid #72ddcb; }
.gh-story-result > strong { display: flex; flex-wrap: wrap; align-items: baseline; gap: 5px 13px; color: #fff; font-size: 20px; line-height: 1.35; }
.gh-story-result > strong em { color: #72ddcb; font-size: clamp(38px, 3.3vw, 48px); font-style: normal; font-variant-numeric: tabular-nums; font-weight: 800; line-height: 1; text-shadow: 0 0 22px rgba(114, 221, 203, .22); }
.gh-story-result > small { display: block; color: #b9cdd2; font-size: 14px; line-height: 1.65; }

/* Crisp illustrative UI for the Chinese customer journey. */
.gh-ui-scene { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1fr); align-items: center; gap: 15px; min-height: 455px; padding: 18px 0; color: #183047; font-size: 12px; }
.gh-ui-surface { min-width: 0; border: 1px solid #dce6ef; border-radius: 8px; background: #fff; box-shadow: 0 18px 48px rgba(0, 7, 23, .28); }
.gh-ui-avatar { display: block; width: 39px; height: 39px; flex: none; border-radius: 50%; background-image: url("assets/home-zh-journey-portraits.png"); background-repeat: no-repeat; background-size: 200% 200%; background-color: #c6d8e6; }
.gh-avatar-chen { background-position: 0 0; }
.gh-avatar-mia { background-position: 100% 0; }
.gh-avatar-man { background-position: 0 100%; }
.gh-avatar-woman { background-position: 100% 100%; }
.gh-ui-panel-head, .gh-ui-inline-head { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.gh-ui-panel-head strong, .gh-ui-inline-head strong { color: #132a40; font-size: 16px; }
.gh-ui-panel-head small, .gh-ui-inline-head small { color: #6e8498; font-size: 10px; white-space: nowrap; }
.gh-ui-person { display: flex; align-items: center; gap: 10px; min-width: 0; }
.gh-ui-person > span { display: grid; min-width: 0; gap: 4px; }
.gh-ui-person b { color: #102b40; font-size: 13px; }
.gh-ui-person small { color: #72889c; font-size: 10px; }
.gh-ui-inbox { display: flex; flex-direction: column; min-height: 418px; overflow: hidden; }
.gh-ui-inbox .gh-ui-panel-head { padding: 18px 17px 15px; }
.gh-ui-account-tabs { display: flex; gap: 4px; padding: 0 11px 15px; }
.gh-ui-account-tabs span { flex: 1; padding: 7px 3px; border: 1px solid #e1eaf1; border-radius: 5px; background: #f5f8fb; color: #607789; font-size: 10px; text-align: center; white-space: nowrap; }
.gh-ui-account-tabs .is-active { border-color: #aac9f4; background: #e9f2ff; color: #176ac7; font-weight: 800; }
.gh-ui-contact { display: flex; align-items: center; gap: 9px; min-width: 0; min-height: 68px; padding: 9px 12px; border-top: 1px solid #ecf1f5; }
.gh-ui-contact.is-selected { background: #edf5ff; }
.gh-ui-contact > span { display: grid; min-width: 0; gap: 5px; }
.gh-ui-contact b { color: #1b3044; font-size: 12px; }
.gh-ui-contact small { overflow: hidden; color: #637b90; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.gh-ui-contact em { align-self: flex-start; margin-left: auto; color: #8fa2b1; font-size: 9px; font-style: normal; white-space: nowrap; }
.gh-ui-inbox-foot { display: flex; gap: 14px; margin-top: auto; padding: 13px 16px; border-top: 1px solid #e8eef3; color: #57738a; font-size: 10px; }
.gh-ui-intake-stack, .gh-ui-deal-stack, .gh-ui-retention-stack { display: flex; flex-direction: column; gap: 13px; min-width: 0; }
.gh-ui-inquiry { padding: 16px; }
.gh-ui-inquiry p { margin: 13px 0 0; padding: 10px 11px; border-radius: 5px; background: #f0f4f8; color: #294055; font-size: 13px; line-height: 1.5; }
.gh-ui-translation { padding: 15px; }
.gh-ui-translation p { margin: 13px 0 10px; color: #36536c; font-size: 11px; line-height: 1.45; }
.gh-ui-translation p span, .gh-ui-translation > div:last-child span { display: block; margin-bottom: 4px; color: #7b90a3; font-size: 9px; font-weight: 700; }
.gh-ui-translation > div:last-child { padding: 10px 11px; border-radius: 5px; background: #eef5ff; }
.gh-ui-translation > div:last-child b { color: #195ca6; font-size: 12px; line-height: 1.45; }
.gh-ui-assignment, .gh-ui-task, .gh-ui-reply { border: 1px solid #398ce7; border-radius: 8px; background: #1768ca; box-shadow: 0 18px 42px rgba(1, 18, 47, .3); color: #fff; }
.gh-ui-assignment { display: flex; align-items: center; gap: 12px; min-height: 80px; padding: 12px 15px; }
.gh-ui-assignment > span { display: grid; gap: 4px; }
.gh-ui-assignment small { color: #d1e7ff; font-size: 10px; }
.gh-ui-assignment b { color: #fff; font-size: 13px; }
.gh-ui-assignment > strong { margin-left: auto; padding: 5px 8px; border: 1px solid rgba(255,255,255,.36); border-radius: 4px; color: #fff; font-size: 10px; white-space: nowrap; }
.gh-ui-lead, .gh-ui-customer { min-height: 366px; padding: 17px; }
.gh-ui-lead-person { padding-bottom: 18px; border-bottom: 1px solid #e5ecf2; }
.gh-ui-lead-person .gh-ui-avatar { width: 51px; height: 51px; }
.gh-ui-lead-person b { font-size: 16px; }
.gh-ui-lead-section { display: grid; gap: 8px; margin: 15px 0; padding: 14px; border-radius: 5px; background: #f0f5fa; }
.gh-ui-lead-section small { color: #6e8699; font-size: 10px; }
.gh-ui-lead-section strong { color: #15334d; font-size: 14px; }
.gh-ui-lead-section span { color: #5e778d; font-size: 11px; }
.gh-ui-lead-row { display: flex; justify-content: space-between; gap: 10px; padding: 11px 0; border-top: 1px solid #e8eef3; color: #647b90; font-size: 11px; }
.gh-ui-lead-row b { color: #244158; font-size: 11px; text-align: right; }
.gh-ui-conversation { padding: 16px; }
.gh-ui-mini-chat { display: grid; gap: 8px; margin: 14px 0; }
.gh-ui-mini-chat span, .gh-ui-mini-chat b { max-width: 88%; padding: 9px 11px; border-radius: 6px; font-size: 11px; font-weight: 500; line-height: 1.4; }
.gh-ui-mini-chat span { background: #eff3f7; color: #31495e; }
.gh-ui-mini-chat b { justify-self: end; background: #e8f2ff; color: #1b5eaa; }
.gh-ui-file { display: flex; align-items: center; gap: 10px; padding: 10px; border: 1px solid #e4ebf1; border-radius: 5px; background: #f8fafc; }
.gh-ui-file i { display: grid; width: 34px; height: 38px; flex: none; place-items: center; border-radius: 4px; background: #dbeaff; color: #2166b4; font-size: 24px; font-style: normal; }
.gh-ui-file span { display: grid; gap: 3px; }
.gh-ui-file b { color: #1b3348; font-size: 11px; }
.gh-ui-file small { color: #7c90a3; font-size: 10px; }
.gh-ui-quick-reply { display: flex; justify-content: space-between; margin-top: 11px; color: #6d8295; font-size: 10px; }
.gh-ui-quick-reply strong { color: #236cac; font-size: 10px; }
.gh-ui-task { display: grid; gap: 9px; padding: 16px; }
.gh-ui-task > span { display: flex; justify-content: space-between; color: #d6eaff; font-size: 11px; }
.gh-ui-task > span b { padding: 3px 7px; border-radius: 4px; background: rgba(255,255,255,.16); color: #fff; font-size: 10px; }
.gh-ui-task > strong { color: #fff; font-size: 15px; }
.gh-ui-task > small { color: #d6eaff; font-size: 10px; }
.gh-ui-customer { min-height: 394px; }
.gh-ui-customer-tags { display: flex; gap: 7px; margin-top: 15px; }
.gh-ui-customer-tags span { padding: 5px 8px; border-radius: 4px; background: #eaf6f2; color: #23725f; font-size: 10px; font-weight: 700; }
.gh-ui-customer-tags span + span { background: #eef3fa; color: #4a7199; }
.gh-ui-timeline { margin-top: 17px; padding-top: 14px; border-top: 1px solid #e8eef3; }
.gh-ui-timeline > strong { display: block; margin-bottom: 9px; color: #18344d; font-size: 12px; }
.gh-ui-timeline > div { display: flex; gap: 10px; align-items: center; min-height: 47px; }
.gh-ui-timeline i { width: 8px; height: 8px; flex: none; border-radius: 50%; background: #2b7ccd; }
.gh-ui-timeline span { display: grid; gap: 2px; }
.gh-ui-timeline b { color: #29495f; font-size: 11px; }
.gh-ui-timeline small { color: #7a8ea0; font-size: 10px; }
.gh-ui-segment { padding: 15px; }
.gh-ui-segment-option { display: flex; align-items: center; gap: 8px; margin-top: 9px; padding: 8px; border: 1px solid #e5ebf1; border-radius: 5px; color: #667b8d; }
.gh-ui-segment-option.is-active { border-color: #b9d2ed; background: #edf5ff; color: #205685; }
.gh-ui-segment-option span { display: grid; width: 16px; height: 16px; flex: none; place-items: center; border: 1px solid #bac8d2; border-radius: 3px; font-size: 10px; }
.gh-ui-segment-option.is-active span { border-color: #2c7bc7; background: #2c7bc7; color: #fff; }
.gh-ui-segment-option b { font-size: 11px; }
.gh-ui-update { display: grid; gap: 5px; padding: 13px 15px; border: 1px solid #bfdad1; border-radius: 8px; background: #ebf7f2; box-shadow: 0 12px 30px rgba(0, 7, 23, .2); }
.gh-ui-update small { color: #4d8475; font-size: 10px; }
.gh-ui-update strong { color: #195e4b; font-size: 13px; }
.gh-ui-update span { color: #5e8c80; font-size: 10px; }
.gh-ui-reply { display: grid; gap: 13px; padding: 14px; }
.gh-ui-reply .gh-ui-person b { color: #fff; font-size: 12px; }
.gh-ui-reply .gh-ui-person small { color: #d5eaff; }
.gh-ui-reply-next { display: flex; justify-content: space-between; gap: 7px; padding-top: 10px; border-top: 1px solid rgba(255,255,255,.27); color: #d9eaff; font-size: 10px; }
.gh-ui-reply-next span { color: #fff; font-weight: 700; white-space: nowrap; }

.home-refresh .gh-next-product { padding: 80px 0 86px; }
.home-refresh .gh-story-intro { padding: 70px 0 0; }
.home-refresh .gh-next-flow,
.home-refresh .gh-next-deal,
.home-refresh .gh-next-relationship { padding: 32px 0; }
.gh-story-intro .container,
.gh-next-flow-grid,
.gh-next-deal-grid,
.gh-next-relationship-grid { width: min(1260px, calc(100% - 56px)); }
.gh-story-progress { margin-top: 48px; }
.gh-story-visual img { transform: none; }

.home-refresh .gh-section-kicker { display: inline-flex; align-items: center; gap: 10px; margin-top: 0; font-size: 16px; font-weight: 850; line-height: 1.35; letter-spacing: 0; text-transform: none; }
.home-refresh .gh-section-kicker::before,
.home-refresh .gh-section-kicker::after { content: ""; width: 24px; height: 1px; flex: 0 0 24px; background: currentColor; opacity: .65; }

@media (max-width: 1100px) {
  .gh-capability { min-height: 180px; gap: 8px; padding: 10px; }
  .gh-feature-art { width: 112px; height: 112px; flex-basis: 112px; }
  .gh-capability h3 { font-size: 16px; }
  .gh-capability p { font-size: 12px; }
  .gh-next-flow-grid, .gh-next-deal-grid, .gh-next-relationship-grid { gap: 25px; }
  .gh-story-visual img { transform: none; }
  .gh-ui-scene { gap: 10px; }
  .gh-ui-inbox .gh-ui-panel-head { padding-inline: 12px; }
  .gh-ui-account-tabs { padding-inline: 7px; }
  .gh-ui-contact { padding-inline: 8px; }
}
@media (max-width: 850px) {
  .gh-capability-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gh-capability { min-height: 156px; }
  .gh-next-flow-grid, .gh-next-deal-grid, .gh-next-relationship-grid { grid-template-columns: 1fr; gap: 15px; }
  .gh-story-visual { width: 100%; max-width: 700px; margin: auto; }
  .gh-ui-scene { grid-template-columns: minmax(0, .95fr) minmax(0, 1fr); }
  .gh-next-flow, .gh-next-deal, .gh-next-relationship { padding-block: 55px; }
  .home-refresh .gh-next-flow, .home-refresh .gh-next-deal, .home-refresh .gh-next-relationship { padding: 46px 0; }
}
@media (max-width: 600px) {
  .home-refresh .gh-next-product { padding: 66px 0; }
  .gh-next-heading { margin-bottom: 31px; text-align: left; }
  .gh-next-heading h2 { font-size: 31px; }
  .gh-next-heading > p:last-child { font-size: 14px; }
  .gh-capability-grid { grid-template-columns: 1fr; gap: 11px; }
  .gh-capability { min-height: 129px; padding: 9px; }
  .gh-feature-art { width: 112px; height: 112px; flex-basis: 112px; }
  .gh-capability h3 { margin-bottom: 6px; font-size: 16px; }
  .gh-capability p { font-size: 12px; }
  .home-refresh .gh-story-intro { padding-top: 62px; }
  .gh-story-intro-top { text-align: left; }
  .gh-story-intro h2 { font-size: 31px; }
  .gh-story-intro h2 span { display: block; }
  .gh-story-intro-top > p:last-child { font-size: 14px; }
  .gh-story-progress { margin-top: 36px; }
  .gh-story-progress > div { gap: 6px; padding: 30px 5px 22px; text-align: center; }
  .gh-story-progress b { font-size: 16px; }
  .gh-story-progress span { font-size: 12px; }
  .gh-next-flow-copy h2, .gh-next-deal-copy h2, .gh-next-relationship-copy h2 { font-size: 30px; }
  .gh-next-flow-copy p:not(.kicker), .gh-next-deal-copy p:not(.kicker), .gh-next-relationship-copy p:not(.kicker) { font-size: 14px; }
  .gh-story-capabilities { gap: 7px; }
  .gh-story-capabilities li { gap: 7px; font-size: 12px; white-space: normal; }
  .gh-story-capabilities li::before { font-size: 13px; }
  .gh-story-result > strong { font-size: 17px; }
  .gh-story-result > strong em { font-size: 38px; }
  .gh-ui-scene { grid-template-columns: 1fr; gap: 13px; min-height: 0; padding: 16px 0 0; }
  .gh-ui-inbox { min-height: 0; }
  .gh-ui-contact { min-height: 62px; }
  .gh-ui-lead, .gh-ui-customer { min-height: 0; }
  .gh-ui-inquiry p { font-size: 12px; }
}



/* English copy needs a clear image gutter and wrapping in the compact proof rail. */
.en-site .gh-hero-media {
  width: 100%;
  margin-inline: 0;
  transform: none;
}

@media (min-width: 981px) {
  .en-site .gh-hero h1 {
    font-size: 36px;
    line-height: 1.22;
  }

  .en-site .gh-hero-title-main { font-size: 1.13em; }

  .en-site .gh-hero-media {
    width: calc(100% + 80px);
    margin-left: -46px;
  }
}

@media (min-width: 1320px) {
  .en-site .gh-hero-media {
    width: calc(100% + 130px);
    margin-left: -77px;
  }
}

.en-site .gh-proof-rail small {
  max-width: 240px;
  margin-inline: auto;
  white-space: normal;
}

.en-site .gh-next-oversight-signals {
  display: block;
  text-align: center;
}

@media (min-width: 981px) {
  .en-site .gh-next-trial h2 {
    max-width: 860px;
    font-size: 44px;
  }
}

@media (max-width: 660px) {
  .en-site .gh-proof-rail b,
  .en-site .gh-proof-rail small { white-space: normal; }
  .en-site .gh-proof-rail b { font-size: 23px; line-height: 1.18; }
  .en-site .gh-proof-rail small { max-width: 165px; font-size: 11px; line-height: 1.4; }
  .en-site .gh-proof-rail > div { min-height: 128px; padding-inline: 10px; }
  .en-site .gh-hero-title-main { font-size: 1.08em; }
}

.gh-home-nav {
  position: relative;
  display: flex;
  align-items: center;
  height: 70px;
}
.gh-home-nav > a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
}
.gh-home-nav > a::after {
  content: "";
  width: 6px;
  height: 6px;
  margin-top: -3px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg);
  transition: transform .18s ease;
}
.gh-home-nav-menu {
  position: absolute;
  top: calc(100% - 2px);
  left: 50%;
  z-index: 50;
  width: min(460px, calc(100vw - 48px));
  padding: 8px 10px;
  border: 1px solid #e0eaeb;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 16px 36px rgba(12, 38, 56, .12);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translate(-50%, 6px);
  transition: opacity .18s ease, transform .18s ease, visibility .18s;
}
.gh-home-nav-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.gh-home-nav-item {
  display: flex;
  flex-wrap: wrap;
  align-content: center;
  justify-content: center;
  column-gap: 7px;
  min-height: 72px;
  padding: 8px 6px;
  color: #183344;
  text-align: center;
  text-decoration: none;
}
.home-page #features,
.home-page #growth-loop,
.home-page #customer-voices {
  scroll-margin-top: 88px;
}
.gh-home-nav-item + .gh-home-nav-item { border-left: 1px solid #e8eff0; }
.gh-home-nav-item:hover { background: #f4f9f8; }
.gh-home-nav-item b {
  display: inline;
  color: #159988;
  font-size: 14px;
  line-height: 1.4;
  font-variant-numeric: tabular-nums;
}
.gh-home-nav-item strong { font-size: 15px; line-height: 1.4; }
.gh-home-nav-item small { flex-basis: 100%; margin-top: 4px; color: #71808d; font-size: 12px; font-weight: 450; line-height: 1.4; white-space: nowrap; }
html[lang="en"] .gh-home-nav-menu { width: min(560px, calc(100vw - 48px)); }
html[lang="en"] .gh-home-nav-item small { white-space: normal; }
.gh-home-nav:hover > a::after,
.gh-home-nav:focus-within > a::after { transform: rotate(225deg); }
.gh-home-nav:hover .gh-home-nav-menu,
.gh-home-nav:focus-within .gh-home-nav-menu {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translate(-50%, 0);
}
@media (max-width: 1100px) {
  .gh-home-nav { display: block; height: auto; }
  .gh-home-nav > a {
    display: flex;
    padding: 11px 12px;
    border-radius: 8px;
  }
  .gh-home-nav > a:hover { background: #eef8f6; }
  .gh-home-nav > a::after,
  .gh-home-nav-menu { display: none; }
}