* {
  box-sizing:border-box}
html {
  scroll-behavior:smooth;
  scroll-padding-top:2rem}
body.marketing {
  margin:0;
  background:#faf7ef;
  color:#101615;
  font-family:Arial,Helvetica,system-ui,sans-serif;
  line-height:1.5}
a {
  color:inherit}
button,select {
  font:inherit}
a:focus-visible,button:focus-visible,summary:focus-visible,select:focus-visible {
  outline:3px solid #087e48;
  outline-offset:5px}
h1,h2,h3,p {
  margin:0}
h1,h2 {
  letter-spacing:-.045em;
  line-height:1.06;
  white-space:pre-line}
h1 {
  font-size:clamp(2.7rem,5.5vw,5.8rem)}
h2 {
  font-size:clamp(2rem,4.1vw,4.2rem)}
h3 {
  font-size:1.5rem;
  letter-spacing:-.025em;
  line-height:1.2}
p {
  font-size:1.12rem}
img {
  max-width:100%;
  display:block}
main {
  max-width:1600px;
  margin:auto;
  padding:0 24px}
.section {
  max-width:1280px;
  margin:0 auto;
  padding:64px 24px}
.site-header {
  max-width:1600px;
  margin:auto;
  display:flex;
  align-items:center;
  gap:32px;
  padding:26px 48px}
.wordmark {
  display:inline-flex;
  align-items:center;
  gap:8px;
  text-decoration:none;
  font-size:1.85rem;
  font-weight:750;
  letter-spacing:-.06em;
  white-space:nowrap}
.wordmark img {
  object-fit:contain;
  flex-shrink:0}
.site-header nav {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:30px;
  flex:1}
.site-header nav a,.sign-in {
  text-decoration:none;
  font-size:.95rem}
.site-header nav a:hover,.footer-links a:hover {
  text-decoration:underline}
.header-actions {
  display:flex;
  align-items:center;
  gap:22px}
.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  background:#05df70;
  color:#07130d;
  padding:15px 26px;
  border-radius:100px;
  text-decoration:none;
  font-weight:600;
  border:1px solid transparent;
  line-height:1.3;
  text-align:center;
  transition:background .15s}
.button:hover {
  background:#3be37a}
.audience-menu {
  position:relative}
.audience-menu summary {
  cursor:pointer;
  list-style:none;
  white-space:nowrap;
  font-size:.95rem}
.audience-menu summary::-webkit-details-marker {
  display:none}
.audience-menu summary::after {
  content:'⌄';
  padding-left:8px}
.audience-menu[open] summary::after {
  content:'⌃'}
.dropdown {
  position:absolute;
  top:calc(100% + 14px);
  left:-20px;
  min-width:180px;
  background:white;
  border-radius:12px;
  padding:10px;
  box-shadow:0 12px 40px #10161520;
  z-index:5}
.dropdown a {
  display:block;
  padding:10px;
  border-radius:6px}
.dropdown a:hover {
  background:#edf9ec}
.mk-hero {
  position:relative;
  isolation:isolate;
  min-height:650px;
  overflow:hidden;
  border-radius:28px;
  display:flex;
  align-items:center;
  padding:64px 6%;
  color:white;
  background:#203c2c}
.hero-photo {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 47%;
  z-index:-2}
.mk-hero::before {
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,#07130dd9 0%,#07130d90 35%,#07130d1a 67%);
  z-index:-1}
.hero-copy {
  max-width:590px;
  width:53%}
.hero-copy h1 {
  max-width:540px}
.hero-copy p {
  margin-top:28px;
  font-size:1.25rem;
  max-width:460px}
.hero-copy .button {
  margin-top:30px}
.hero-conversation {
  position:absolute;
  right:5%;
  top:8%;
  width:31%;
  max-width:360px;
  display:grid;
  gap:14px}
.hero-conversation .avatar {
  box-shadow:0 0 0 2px #ffffffe6,0 0 14px 4px #ffffff70}
@keyframes hero-message-appear {
  from {
    opacity:0;
    transform:translateY(14px) scale(.96)}
  to {
    opacity:1;
    transform:translateY(0) scale(1)}
}
@media(prefers-reduced-motion:no-preference) {
  .hero-conversation> * {
    animation:hero-message-appear .225s cubic-bezier(.22,1,.36,1) both;
    transform-origin:left center}
  .hero-conversation> :nth-child(1) {
    animation-delay:.15s}
  .hero-conversation> :nth-child(2) {
    animation-delay:.75s}
  .hero-conversation> :nth-child(3) {
    animation-delay:1.4s}
  .hero-conversation> :nth-child(4) {
    animation-delay:1.7s}
}
.hero-person-message {
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0}
.hero-conversation .hero-person-message .question {
  margin-left:0;
  max-width:none}
.hero-conversation .hero-person-avatar {
  position:relative;
  overflow:hidden;
  padding:0;
  background:#e2f7d7}
.hero-conversation .hero-person-avatar img {
  position:absolute;
  width:256px;
  max-width:none;
  height:171px;
  top:-60px;
  left:-86px}
.hero-conversation .hero-person-avatar--man img {
  top:-58px;
  left:-139px}
.hero-time-divider {
  justify-self:center;
  margin:0;
  padding:5px 12px;
  border-radius:20px;
  background:#203c2cdd;
  color:white;
  font-size:.85rem;
  line-height:1.4}
.bubble {
  padding:15px 18px;
  background:#fff;
  border-radius:15px;
  color:#101615;
  line-height:1.4;
  font-size:1rem;
  box-shadow:0 4px 18px #00000008}
.bubble.question {
  background:#e2f7d7;
  margin-left:35px}
.assistant-message {
  display:flex;
  align-items:center;
  gap:10px}
.avatar {
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 46px;
  width:46px;
  height:46px;
  border-radius:50%;
  background:#3be37a;
  padding:5px}
.avatar img {
  width:100%;
  height:auto;
  object-fit:contain}
.intro {
  text-align:center;
  padding-top:70px;
  padding-bottom:30px;
  max-width:1150px}
.intro p {
  margin-top:20px;
  font-size:1.3rem}
.feature {
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  gap:80px}
.feature p {
  font-size:1.3rem;
  max-width:480px;
  margin-top:24px}
.chat-panel {
  background:linear-gradient(120deg,#dff3d7,#edf8e7);
  border-radius:28px;
  padding:32px}
.chat-card {
  max-width:430px;
  background:#ffffffd9;
  border-radius:22px;
  padding:24px;
  margin:auto}
.chat-heading {
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:24px}
.chat-heading>span:last-child {
  margin-left:auto}
.chat-heading .avatar {
  width:34px;
  height:34px;
  flex-basis:34px}
.chat-card>.bubble {
  margin-bottom:20px}
.list-card {
  background:white;
  padding:18px;
  border-radius:14px;
  flex:1;
  box-shadow:0 3px 20px #153a1510}
.list-card ul {
  padding:0;
  list-style:none;
  margin:12px 0 0}
.list-card li+li {
  margin-top:5px}
.list-card li span {
  font-size:1.3rem;
  margin-right:8px}
.audiences {
  padding-top:20px}
.audiences>h2 {
  text-align:center;
  font-size:clamp(2rem,3.4vw,3.4rem);
  margin-bottom:32px}
.audience-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px}
.audience-card {
  background:#fffaf4;
  border:1px solid #10161509;
  border-radius:22px;
  overflow:hidden;
  display:flex;
  flex-direction:column}
.audience-card>img {
  width:100%;
  height:auto;
  aspect-ratio:1.48;
  object-fit:cover}
.audience-card>div {
  padding:26px;
  flex:1;
  display:flex;
  flex-direction:column}
.audience-card p {
  margin-top:10px;
  font-size:1.04rem}
.audience-card a {
  color:#087d44;
  margin-top:auto;
  padding-top:24px;
  text-underline-offset:4px}
.how {
  padding-top:10px}
.how>h2 {
  text-align:center;
  font-size:clamp(2rem,3.5vw,3rem)}
.how ol {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:32px;
  list-style:none;
  counter-reset:steps;
  padding:0;
  margin:38px 0 0}
.how li {
  counter-increment:steps}
.how li::before {
  content:counter(steps,decimal-leading-zero);
  display:block;
  color:#147440;
  font-size:1rem;
  font-weight:700;
  margin-bottom:14px}
.how p {
  margin-top:12px;
  font-size:1.05rem}
.closing-banner {
  display:flex;
  align-items:center;
  gap:6%;
  background:#101615;
  color:#fff;
  border-radius:28px;
  padding:36px 7%;
  margin:10px 0 0}
.brand-disc {
  background:#05df70;
  aspect-ratio:1;
  border-radius:50%;
  width:230px;
  flex:0 0 230px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px}
.brand-disc img {
  width:100%;
  height:auto;
  object-fit:contain;
  transform:none}
.closing-banner h2 {
  font-size:clamp(1.8rem,3.3vw,3.6rem)}
.closing-banner .button {
  margin-top:24px}
.image-note {
  font-size:.75rem;
  color:#68736d;
  text-align:right;
  margin-top:10px}
.site-footer {
  max-width:1600px;
  margin:auto;
  padding:40px 48px;
  display:flex;
  align-items:center;
  gap:30px;
  flex-wrap:wrap}
.footer-links {
  display:flex;
  gap:20px;
  flex-wrap:wrap;
  margin-left:auto}
.footer-links a {
  font-size:.9rem;
  text-decoration:none}
.language-form {
  width:100%;
  display:flex;
  align-items:center;
  gap:12px;
  justify-content:flex-end;
  font-size:.9rem}
.language-form select,.language-form button {
  background:transparent;
  border:1px solid #a9b4ab;
  border-radius:8px;
  padding:9px 12px;
  color:#101615}
.language-form button {
  cursor:pointer}
.site-footer small {
  width:100%;
  color:#5e6962;
  font-size:.8rem}
.skip-link {
  position:fixed;
  top:-100px;
  left:15px;
  z-index:20;
  background:white;
  padding:12px}
.skip-link:focus {
  top:15px}
.audience-hero {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px;
  align-items:center;
  padding-top:48px}
.audience-hero h1 {
  font-size:clamp(2.5rem,4.5vw,4.5rem)}
.audience-hero p:not(.eyebrow) {
  margin:24px 0}
.eyebrow {
  color:#087d44;
  font-weight:600;
  margin-bottom:20px}
.audience-hero>img {
  width:100%;
  height:520px;
  object-fit:cover;
  border-radius:26px}
.audience-detail {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px;
  align-items:center}
.audience-detail ul {
  padding-left:22px;
  font-size:1.2rem}
.audience-detail li+li {
  margin-top:20px}
.example-chat {
  display:flex;
  align-items:center;
  gap:15px;
  background:#dff3d7;
  border-radius:26px;
  padding:40px}
.mk-doc {
  max-width:900px;
  padding:60px 28px 80px}
.mk-doc h1 {
  font-size:clamp(2.4rem,5vw,4rem)}
.mk-updated {
  color:#68736d;
  font-size:.95rem;
  margin-top:18px}
.legal-intro {
  font-size:1.25rem!important;
  margin-top:30px!important}
.mk-doc h2 {
  font-size:1.55rem;
  letter-spacing:-.02em;
  line-height:1.25;
  margin-top:42px}
.mk-doc p {
  margin-top:14px;
  font-size:1.05rem;
  line-height:1.8;
  overflow-wrap:anywhere}
.mk-doc a {
  color:#087d44}
.legal-links {
  padding-left:20px;
  line-height:2}

@media(min-width:1400px) {
  .mk-hero {
  min-height:750px}
.hero-photo {
  object-position:center 45%}
}

@media(max-width:1050px) {
  .site-header {
  padding:22px 28px;
  gap:20px}
.site-header nav {
  gap:16px}
.sign-in {
  display:none}
.header-actions .button {
  font-size:.9rem;
  padding:12px 18px}
.feature {
  gap:35px}
.section {
  padding-left:8px;
  padding-right:8px}
.chat-panel {
  padding:20px}
.closing-banner {
  padding:32px 4%}
.brand-disc {
  width:190px;
  flex-basis:190px}
.footer-links {
  margin-left:0}
.site-footer {
  padding:30px}
.hero-copy {
  width:60%}
.hero-conversation {
  right:3%;
  width:33%}
.audience-card>div {
  padding:20px}
}

@media(max-width:760px) {
  main {
  padding:0 14px}
.site-header {
  flex-wrap:wrap;
  padding:18px;
  gap:16px}
.wordmark {
  font-size:1.6rem}
.wordmark img {
  width:44px;
  height:auto}
.site-header nav {
  order:3;
  flex-basis:100%;
  justify-content:space-between;
  gap:15px}
.header-actions {
  margin-left:auto}
.header-actions .button {
  padding:12px 16px;
  font-size:.83rem;
  gap:8px}
.mk-hero {
  min-height:780px;
  flex-direction:column;
  gap:36px;
  align-items:flex-start;
  padding:34px 26px;
  border-radius:22px}
.hero-photo {
  object-position:60% center}
.mk-hero::before {
  background:linear-gradient(180deg,#07130dbf 0%,#07130d70 42%,#07130d00 65%)}
.hero-copy {
  width:100%;
  max-width:450px}
.hero-copy h1 {
  font-size:clamp(2.6rem,10vw,4rem)}
.hero-copy p {
  font-size:1.05rem;
  margin-top:20px;
  max-width:340px}
.hero-copy .button {
  margin-top:22px}
.hero-conversation {
  position:relative;
  top:auto;
  right:auto;
  margin-top:auto;
  max-width:none;
  width:100%}
.hero-conversation .question {
  margin-left:auto;
  max-width:85%}
.hero-conversation .assistant-message {
  max-width:90%}
.section {
  padding:45px 8px}
.intro {
  padding-bottom:10px}
.intro p,.feature p {
  font-size:1.12rem}
.feature {
  grid-template-columns:1fr;
  gap:30px}
.feature h2 {
  white-space:normal}
.chat-panel {
  padding:24px 16px}
.audience-grid {
  grid-template-columns:1fr;
  gap:24px}
.audiences>h2 {
  text-align:left}
.audience-card>img {
  aspect-ratio:1.6}
.audience-card>div {
  padding:24px}
.how ol {
  grid-template-columns:1fr;
  gap:28px}
.how h2 {
  text-align:left}
.closing-banner {
  gap:24px;
  align-items:flex-start;
  flex-direction:column;
  padding:28px;
  border-radius:22px}
.brand-disc {
  width:140px;
  flex-basis:auto;
  padding:15px}
.closing-banner h2 {
  font-size:2rem}
.site-footer {
  padding:30px 22px;
  gap:24px}
.footer-links {
  width:100%;
  gap:14px 20px}
.language-form {
  justify-content:flex-start;
  flex-wrap:wrap}
.image-note {
  text-align:left;
  font-size:.7rem}
.audience-hero,.audience-detail {
  grid-template-columns:1fr;
  gap:28px}
.audience-hero>img {
  height:auto;
  aspect-ratio:1.2}
.audience-detail {
  padding-top:0}
.mk-doc {
  padding:35px 24px 60px}
.mk-doc h2 {
  font-size:1.4rem}
.mk-doc p {
  font-size:1rem}
}

@media(prefers-reduced-motion:reduce) {
  html {
  scroll-behavior:auto}
.button {
  transition:none}
}

/* Keep the chevron clear of the select edge on every platform. */
.language-form select {
  appearance: none;
  -webkit-appearance: none;
  padding-right: 44px;
  background-image: linear-gradient(45deg, transparent 50%, #273e31 50%), linear-gradient(135deg, #273e31 50%, transparent 50%);
  background-position: calc(100% - 21px) center, calc(100% - 16px) center;
  background-size: 5px 5px;
  background-repeat: no-repeat;
}
.audience-menu summary {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.audience-menu summary::after,
.audience-menu[open] summary::after {
  content: '';
  padding: 0;
  width: 7px;
  height: 7px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: translateY(-2px) rotate(45deg);
  flex: 0 0 7px;
}
.audience-menu[open] summary::after {
  transform: translateY(2px) rotate(225deg);
}
.deletion-form { display: grid; gap: 24px; margin-top: 32px; }
.deletion-form label { display: block; font-weight: 600; margin-bottom: 8px; }
.deletion-form input[type=email], .deletion-form textarea {
  width: 100%; padding: 14px 16px; border: 1px solid #8d9d90;
  border-radius: 12px; font: inherit; background: white; color: #101615;
}
.deletion-form textarea { resize: vertical; }
.deletion-form .field-hint { font-size: .9rem; line-height: 1.5; color: #536358; margin-top: 8px; }
.deletion-form .button { cursor: pointer; justify-self: start; font: inherit; font-weight: 600; }
.form-trap { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.form-status { padding: 18px; border-radius: 12px; }
.form-status.success { background: #e0f4df; }
.form-status.error { background: #fff0e9; color: #8c281a; }
.deletion-form input:focus-visible, .deletion-form textarea:focus-visible { outline: 3px solid #087e48; outline-offset: 3px; }
