/* Hey Jude consumer experience styles.
   Consolidated, maintained source for the B2C page.
   Global and shared UI components remain in main.css and components.css. */

.mapped-hero {
  background: var(--site-bg);
  min-height: 82svh;
}

.mapped-hero .container {
  padding-top: clamp(118px,13vh,172px);
  padding-bottom: clamp(45px,6vh,75px);
}

.mapped-hero .hero-actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 9px;
  margin: 0 0 29px;
}

.map-primary-btn {
  display: inline-flex;
  align-items: center;
  gap: 13px;
  background: var(--cta-orange);
  color: white !important;
  border-radius: 999px;
  padding: 15px 27px;
  font-weight: 800;
  font-size: 16px;
  transition: transform .2s,background .2s;
}

.map-primary-btn:hover {
  background: var(--cta-orange-hover);
  transform: translateY(-2px);
}

.map-micro-note {
  font-size: 12px;
  color: var(--hj-muted);
}

.mapped-hero p {
  color: var(--site-text-soft) !important;
  font-weight: 400 !important;
}

.map-status {
  font-size: 11px !important;
  letter-spacing: .095em !important;
  font-weight: 800 !important;
  color: #0083aa !important;
  line-height: 1.5 !important;
  text-transform: uppercase;
  margin: 0 0 18px !important;
}

.mapped-intro .container {
  max-width: 1280px;
}

.mapped-intro p:not(.map-status) {
  max-width: 780px;
  margin-left: auto;
  margin-right: auto;
}

.mapped-new-section {
  background: #f8fbfd;
}

.mapped-new-section .container,.mapped-reviews .container {
  max-width: 1280px;
}

.mapped-left {
  margin-left: 0;
  text-align: left;
}

.mapped-benefit-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 22px;
  margin-top: 35px;
}

.mapped-benefit-card {
  border: 1px solid #dbe5ec;
  background: white;
  border-radius: 22px;
  overflow: hidden;
  display: grid;
  grid-template-columns: 37% 63%;
}

.mapped-benefit-art {
  position: relative;
  min-height: 290px;
  background: radial-gradient(circle at 60% 35%,rgba(0,174,239,.2),transparent 52%),#e9f7fe;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.map-visual-label {
  font-size: 11px;
  font-weight: 800;
  text-align: center;
  letter-spacing: .08em;
  color: #45798e;
  max-width: 145px;
}


.mapped-benefit-body {
  padding: 25px;
}

.mapped-benefit-body h3 {
  font-weight: 800;
  font-size: 1.35rem;
}

.mapped-benefit-value {
  font-weight: 800;
  color: #0097d1;
  font-size: 1.12rem;
  line-height: 1.3;
}

.mapped-benefit-body p {
  line-height: 1.6;
}

.mapped-benefit-rule {
  font-size: .9rem;
  color: #606d76;
}

.mapped-text-link {
  font-weight: 800;
  color: #008cc5;
  text-decoration: underline;
  text-underline-offset: 4px;
}

.mapped-process {
  border: 1px dashed #9dc4d4;
  border-radius: 22px;
  padding: 34px;
  margin-top: 28px;
  background: white;
  max-width: 920px;
}

.mapped-process h3 {
  font-weight: 800;
}

.mapped-section-heading {
  max-width: 850px;
  margin: 0 auto 18px;
  text-align: center;
}

.mapped-section-heading .mapped-left {
  text-align: center;
  margin-left: auto;
}

.mapped-subheading {
  font-weight: 800;
}

.mapped-assistant-tail {
  max-width: 900px;
  margin: 0 auto;
  text-align: center;
  padding-bottom: 35px;
}

.mapped-assistant-tail>p {
  font-size: 1.1rem;
  line-height: 1.6;
}

.mapped-nick {
  text-align: left;
  margin: 55px auto 0;
  border: 1px dashed #9dc4d4;
  background: #f5fbff;
  border-radius: 24px;
  padding: 30px;
}

.mapped-nick h3 {
  font-weight: 800;
}

.mapped-steps {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 16px;
  margin-top: 35px;
}

.mapped-step-card {
  width: auto;
  max-width: none;
  min-width: 0;
  padding: 23px;
}

.mapped-step-card h3 {
  font-size: clamp(1.25rem,2vw,1.8rem);
  max-width: none;
}

.mapped-step-card p {
  font-size: .96rem;
}

.mapped-section-actions {
  text-align: center;
  margin-top: 35px;
}

.mapped-reviews {
  background: white;
}

.mapped-review-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 18px;
  margin-top: 38px;
}

.mapped-review-card {
  position: relative;
  width: auto;
  max-width: none;
  left: auto;
  top: auto;
  right: auto;
  min-height: 210px;
  padding: 25px;
}

.mapped-faq-list {
  max-width: 930px;
  margin: 35px auto 0;
}

.mapped-faq-item {
  background: #fff;
  border: 1px solid #e1e9ee;
  border-radius: 14px;
  margin-bottom: 10px;
}

.mapped-faq-item summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  cursor: pointer;
  list-style: none;
  padding: 21px;
  font-weight: 800;
  font-size: 1.06rem;
}

.mapped-faq-item summary::-webkit-details-marker {
  display: none;
}

.mapped-faq-item[open] summary i {
  transform: rotate(45deg);
}

.mapped-faq-item summary i {
  color: #0097d1;
  transition: transform .2s;
}

.mapped-faq-answer {
  padding: 0 21px 20px;
  max-width: 860px;
  line-height: 1.7;
}

.mapped-faq-help {
  text-align: center;
  margin-top: 24px;
}

.mapped-download {
  background: #f5fbff !important;
}

.mapped-store-note {
  margin-top: 16px;
  color: #6b737c;
}

.site-footer {
  padding-top: 65px;
}

body.theme-dark .mapped-hero,body.theme-dark .mapped-new-section,body.theme-dark .mapped-download {
  background: #222 !important;
}

body.theme-dark .mapped-benefit-card,body.theme-dark .mapped-process,body.theme-dark .mapped-nick,body.theme-dark .mapped-faq-item {
  background: #2b2b2b;
  color: #eee;
  border-color: #555;
}

body.theme-dark .mapped-benefit-art {
  background: #263842;
}

.theme-dark .map-status {
  color: #69ceec !important;
}

.theme-dark .map-micro-note,.theme-dark .mapped-store-note {
  color: #bbb;
}

body.theme-dark .mapped-benefit-rule,body.theme-dark .mapped-faq-answer p {
  color: #d0d0d0 !important;
}

.theme-dark .mapped-benefit-value {
  color: #5ccfff;
}

@media (max-width:991px) {
.mapped-benefit-grid {
  grid-template-columns: 1fr;
}
}

@media (max-width:991px) {
.mapped-steps {
  grid-template-columns: repeat(2,minmax(0,1fr));
}
}

@media (max-width:991px) {
.mapped-review-grid {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding-bottom: 18px;
}
}

@media (max-width:991px) {
.mapped-review-card {
  flex: 0 0 min(82vw,340px);
  scroll-snap-align: start;
}
}

@media (max-width:991px) {
.mapped-hero .container {
  padding-top: 145px;
}
}

@media (max-width:991px) {
.mapped-hero p {
  color: var(--site-text-soft) !important;
}
}

@media (max-width:600px) {
.mapped-hero {
  min-height: 90svh;
}
}

@media (max-width:600px) {
.mapped-hero .container {
  padding-top: 135px;
}
}

@media (max-width:600px) {
.mapped-benefit-card {
  grid-template-columns: 1fr;
}
}

@media (max-width:600px) {
.mapped-benefit-art {
  min-height: 125px;
}
}

@media (max-width:600px) {
.mapped-steps {
  grid-template-columns: 1fr;
}
}

@media (max-width:600px) {
.mapped-benefit-body {
  padding: 22px;
}
}

@media (max-width:600px) {
.mapped-new-section {
  padding: 68px 0;
}
}

@media (max-width:600px) {
.mapped-process {
  padding: 22px;
}
}

@media (max-width:600px) {
.mapped-nick {
  padding: 22px;
}
}

@media (max-width:600px) {
.mapped-hero .hero-actions {
  margin-bottom: 22px;
}
}

@media (max-width:600px) {
.map-primary-btn {
  width: min(100%,310px);
  justify-content: center;
}
}

@media (max-width:600px) {
.mapped-faq-item summary {
  padding: 17px;
}
}

.mapped-benefit-story .section-title {
  text-align: center;
}

.mapped-benefit-story .section-subtitle {
  text-align: center;
  margin: 0 auto 2rem;
}

.mapped-benefit-story .how-step-text-card h3 {
  max-width: none;
  font-size: clamp(1.8rem,2.8vw,2.8rem);
  margin-bottom: .55rem;
}

.mapped-benefit-story .how-step-text-card p {
  margin: 0 0 .65rem;
  font-size: clamp(.94rem,1.06vw,1.08rem);
  line-height: 1.5;
}

.mapped-benefit-story .how-step-text-card .mapped-benefit-value {
  font-weight: 800;
  color: var(--hj-blue-dark);
  font-size: 1.16rem;
}

.mapped-benefit-story .how-step-text-card .mapped-benefit-rule {
  font-size: .88rem;
}

.mapped-benefit-story .mapped-text-link {
  display: inline-flex;
  gap: .5rem;
  align-items: center;
  margin-top: 1rem;
}

.mapped-benefit-story .how-step-text-card .demo-btn {
  margin-top: .6rem;
}

.mapped-benefit-story .how-steps-column {
  gap: 12vh;
}

.mapped-assistant-simple .mapped-assistant-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 18px;
  margin: 2rem 0 3rem;
}

.mapped-assistant-example {
  width: auto;
  max-width: none;
  padding: 28px;
}

.mapped-assistant-example h3 {
  font-size: clamp(1.45rem,2.5vw,2.1rem);
  max-width: none;
  line-height: 1.13;
}

.mapped-original-reviews .trust-scroll-copy .section-title {
  text-align: left;
}

.mapped-original-reviews .trust-scroll-card.card-3 {
  top: 38%;
}

.mapped-original-reviews .trust-scroll-card.card-5 {
  top: 67%;
}

body.theme-dark .mapped-benefit-story .mapped-benefit-value {
  color: #5ccfff;
}

@media (max-width:991.98px) {
.mapped-benefit-story .how-steps-column {
  gap: 48px;
}
}

@media (max-width:991.98px) {
.mapped-assistant-simple .mapped-assistant-grid {
  grid-template-columns: repeat(2,minmax(0,1fr));
}
}

@media (max-width:991.98px) {
.mapped-original-reviews .trust-scroll-card {
  flex: 0 0 300px;
  width: 300px;
}
}

@media (max-width:600px) {
.mapped-assistant-simple .mapped-assistant-grid {
  grid-template-columns: 1fr;
  gap: 14px;
}
}

@media (max-width:600px) {
.mapped-assistant-example {
  padding: 22px;
}
}

@media (max-width:600px) {
.mapped-benefit-story .how-step-text-card h3 {
  font-size: clamp(1.7rem,7vw,2.2rem);
}
}

@media (max-width:600px) {
.mapped-original-reviews .trust-scroll-card {
  flex: 0 0 280px;
  width: 280px;
}
}

.mapped-assistant-story .section-title {
  text-align: center;
}

.mapped-assistant-story .section-subtitle {
  text-align: center;
  margin: 0 auto 1.4rem;
}

.mapped-assistant-story .mapped-subheading {
  text-align: center;
  margin-bottom: 2.1rem;
}

.mapped-assistant-story .how-steps-column {
  gap: 12vh;
}

.mapped-assistant-story .how-step-text-card h3 {
  max-width: none;
  font-size: clamp(1.8rem,2.8vw,2.8rem);
  line-height: 1.08;
}

.mapped-assistant-story .mapped-assistant-tail {
  margin-top: 1.5rem;
}

.mapped-assistant-story .how-squiggle-progress {
  stroke: url(#assistantSquiggleGradient);
}

@media (max-width:991.98px) {
.mapped-assistant-story .how-steps-column {
  gap: 48px;
}
}

@media (max-width:991.98px) {
.mapped-assistant-story .how-story-wrap {
  min-height: auto;
}
}

@media (max-width:600px) {
.mapped-assistant-story .how-step-text-card h3 {
  font-size: clamp(1.7rem,7vw,2.2rem);
}
}

.mapped-assistant-story .how-step-text-card h3.assistant-long-heading {
  font-size: clamp(1.5rem, 2.25vw, 2.2rem);
  line-height: 1.14;
}

@media (max-width: 600px) {
.mapped-assistant-story .how-step-text-card h3.assistant-long-heading {
  font-size: clamp(1.45rem, 6vw, 1.9rem);
}
}

.mapped-assistant-checklist {
  position: relative;
  padding: 100px 0 84px;
  background: #fff !important;
  overflow: clip;
}

.mapped-assistant-checklist > .container {
  max-width: 1280px;
}

.assistant-checklist-stage {
  position: relative;
  height: auto !important;
  min-height: 0 !important;
}

.assistant-checklist-frame {
  position: relative !important;
  top: auto !important;
  display: grid;
  grid-template-columns: minmax(0,.95fr) minmax(0,1.05fr);
  align-items: center;
  gap: clamp(28px,5vw,88px);
}

.assistant-checklist-intro {
  position: relative;
  align-self: center;
}

.assistant-checklist-intro .section-title {
  font-size: clamp(2.35rem,4.1vw,4.5rem);
  line-height: 1.02;
  margin-bottom: 25px;
  max-width: 590px;
}

.assistant-checklist-intro .section-subtitle {
  text-align: left;
  font-size: clamp(1.05rem,1.18vw,1.18rem);
  line-height: 1.7;
  margin: 0;
  max-width: 520px;
}

.assistant-paper-wrap {
  position: relative;
  padding: 26px 18px 34px 10px;
  isolation: isolate;
}

.assistant-circle {
  position: absolute;
  display: block;
  pointer-events: none;
  z-index: -1;
  height: auto;
  opacity: .56 !important;
  filter: saturate(1.15) contrast(1.03);
}

.assistant-circle-blue {
  width: clamp(170px,17vw,240px) !important;
  left: -64px !important;
  right: auto !important;
  top: auto !important;
  bottom: -58px !important;
  transform: rotate(-17deg) !important;
  opacity: .40 !important;
  filter: none !important;
  z-index: -1 !important;
}

.assistant-paper {
  position: relative;
  z-index: 1;
  background: #fff !important;
  color: #1f2b32 !important;
  border: 1px solid rgba(39,54,61,.12);
  border-radius: 5px 12px 7px 10px;
  box-shadow: 0 4px 7px rgba(31,41,47,.045), 0 20px 38px rgba(31,41,47,.09), 10px 25px 50px rgba(31,41,47,.06);
  padding: clamp(25px,3vw,46px);
  transform: rotate(2.3deg);
  border-top-color: rgba(39,54,61,.12) !important;
}

.assistant-paper::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  z-index: 0;
  opacity: .55;
  background-image: repeating-linear-gradient(17deg, rgba(39,48,56,.013) 0 1px, transparent 1px 5px), repeating-linear-gradient(103deg, rgba(39,48,56,.011) 0 1px, transparent 1px 7px), radial-gradient(circle at 15% 22%,rgba(31,43,50,.035) 0 .6px,transparent 1px),radial-gradient(circle at 72% 63%,rgba(31,43,50,.028) 0 .7px,transparent 1.2px);
  background-size: auto,auto,13px 17px,19px 23px;
}

.assistant-paper > * {
  position: relative;
  z-index: 1;
}

.assistant-paper-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  border-bottom: 1px solid rgba(30,62,82,.14);
  padding-bottom: 19px;
}

.assistant-paper-top h3 {
  margin: 0;
  font-size: clamp(1.38rem,2.05vw,2rem);
  font-weight: 800;
  letter-spacing: -.025em;
  line-height: 1.17;
  color: #1f2b32 !important;
}

.assistant-task-list {
  list-style: none;
  padding: 0;
  margin: 7px 0 0;
}

.assistant-task {
  --draw: 0;
  padding: clamp(17px,1.85vw,25px) 0;
  border-bottom: 1px solid rgba(30,62,82,.12);
}

.assistant-task-toggle {
  display: flex;
  width: 100%;
  align-items: flex-start;
  gap: 16px;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.assistant-task-toggle:focus-visible {
  outline: 2px solid #E87722;
  outline-offset: 6px;
  border-radius: 4px;
}

.assistant-task-toggle:hover .assistant-task-box {
  border-color: #E87722;
}

.assistant-task-toggle .assistant-task-writing {
  pointer-events: none;
}

.assistant-followup {
  max-width: 520px;
  margin: 22px 0 23px;
  font-size: clamp(1.05rem,1.18vw,1.18rem);
  line-height: 1.7;
  color: var(--site-text-soft);
}

.assistant-intro-cta {
  margin-top: 0;
}

body.theme-dark .assistant-followup {
  color: #c9c9c9 !important;
}

.assistant-task:last-child {
  border-bottom: 0;
}

.assistant-task-box {
  display: grid;
  place-items: center;
  flex: 0 0 29px;
  width: 29px;
  height: 29px;
  margin-top: 1px;
  border: 2px solid #b0bac0;
  border-radius: 6px;
  background: #fff;
  transition: border-color .23s ease,background .23s ease,transform .28s cubic-bezier(.2,1.8,.3,1);
}

.assistant-task-box svg {
  width: 23px;
  height: 23px;
  overflow: visible;
}

.assistant-task-box path {
  fill: none;
  stroke: #E87722;
  stroke-width: 4;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 32;
  stroke-dashoffset: 32;
  transition: stroke-dashoffset .34s cubic-bezier(.21,.75,.35,1);
}

.assistant-task-copy {
  display: block;
  flex: 1;
  min-width: 0;
  font-size: clamp(1rem,1.3vw,1.24rem);
  line-height: 1.36;
  font-weight: 650;
}

.assistant-task-writing {
  position: relative;
  display: inline;
  color: #1f2b32 !important;
  background-image: linear-gradient(1.2deg, rgba(240,100,43,.94), rgba(240,100,43,.94)), linear-gradient(-.9deg, rgba(240,100,43,.42), rgba(240,100,43,.42));
  background-position: left 54%, left calc(54% + 1.5px);
  background-size: 0 2.5px, 0 1.2px;
  background-repeat: no-repeat;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
  transition: background-size .48s cubic-bezier(.19,.8,.28,1),color .28s ease;
}

.assistant-task.is-complete .assistant-task-writing {
  background-size: 100% 2.5px, 98% 1.2px;
  color: #76838a !important;
}

.assistant-task.is-complete .assistant-task-box {
  border-color: #E87722;
  background: #fff4ee;
  transform: rotate(-5deg) scale(1.05);
}

.assistant-task.is-complete .assistant-task-box path {
  stroke-dashoffset: 0;
}



body.theme-dark .mapped-assistant-checklist {
  background: #222222 !important;
}

body.theme-dark .assistant-checklist-intro .section-title {
  color: #fff !important;
}

body.theme-dark .assistant-checklist-intro .section-subtitle {
  color: #c9c9c9 !important;
}

body.theme-dark .assistant-paper {
  background: #fff !important;
  color: #1f2b32 !important;
}

body.theme-dark .assistant-paper-top h3 {
  color: #1f2b32 !important;
}

body.theme-dark .assistant-task-writing {
  color: #1f2b32 !important;
}

body.theme-dark .assistant-task.is-complete .assistant-task-writing {
  color: #76838a !important;
}

body.theme-dark .mapped-assistant-tail {
  color: #f1f1f1 !important;
}

body.theme-dark .mapped-assistant-tail p,body.theme-dark .mapped-assistant-tail h3 {
  color: #f1f1f1 !important;
}

@media (max-width:991.98px) {
.assistant-checklist-frame {
  gap: 24px;
}
}

@media (max-width:991.98px) {
.assistant-checklist-intro .section-title {
  font-size: clamp(2.1rem,4.3vw,3.1rem);
}
}

@media (max-width:991.98px) {
.assistant-checklist-intro .section-subtitle {
  font-size: 1rem;
}
}

@media (max-width:991.98px) {
.assistant-paper {
  padding: 22px;
}
}

@media (max-width:991.98px) {
.assistant-task-copy {
  font-size: 1rem;
}
}

@media (max-width:991.98px) {
.assistant-task {
  gap: 11px;
}
}

@media (max-width:700px) {
.mapped-assistant-checklist {
  padding: 68px 0 65px;
}
}

@media (max-width:700px) {
.assistant-checklist-frame {
  display: block;
}
}

@media (max-width:700px) {
.assistant-checklist-intro {
  margin-bottom: 28px;
}
}

@media (max-width:700px) {
.assistant-checklist-intro .section-title {
  font-size: clamp(2rem,7.6vw,2.7rem);
  margin-bottom: 15px;
}
}

@media (max-width:700px) {
.assistant-checklist-intro .section-subtitle {
  font-size: .98rem;
  line-height: 1.56;
}
}

@media (max-width:700px) {
.assistant-paper-wrap {
  padding: 10px 8px 21px 4px;
}
}

@media (max-width:700px) {
.assistant-circle-blue {
  top: auto;
  right: -14px;
  width: 130px !important;
  left: -22px !important;
  bottom: -33px !important;
  opacity: .35 !important;
}
}

@media (max-width:700px) {
.assistant-paper {
  transform: rotate(1.55deg);
  padding: 19px 19px 15px;
}
}

@media (max-width:700px) {
.assistant-paper-top {
  padding-bottom: 11px;
}
}

@media (max-width:700px) {
.assistant-paper-top h3 {
  font-size: 1.35rem;
}
}

@media (max-width:700px) {
.assistant-task {
  padding: 13px 0;
}
}

@media (max-width:700px) {
.assistant-task-toggle {
  gap: 11px;
}
}

@media (max-width:700px) {
.assistant-task-box {
  flex-basis: 24px;
  width: 24px;
  height: 24px;
}
}

@media (max-width:700px) {
.assistant-task-box svg {
  width: 20px;
  height: 20px;
}
}

@media (max-width:700px) {
.assistant-task-copy {
  font-size: clamp(.94rem,3.8vw,1.08rem);
  line-height: 1.31;
}
}

@media (max-width:700px) {

}

@media (max-width:380px) {
.assistant-checklist-intro .section-title {
  font-size: 1.95rem;
}
}

@media (max-width:380px) {
.assistant-paper {
  padding: 16px 14px;
}
}

@media (max-width:380px) {
.assistant-task-copy {
  font-size: .92rem;
}
}

@media (prefers-reduced-motion:reduce) {
.assistant-task-box,.assistant-task-box path,.assistant-task-writing {
  transition: none !important;
}
}

@media (max-width:420px) {
.assistant-circle-blue {
  right: 5px;
  bottom: -20px;
  width: 75px;
}
}

.assistant-paper::after {
  position: absolute;
  z-index: 2;
  left: -1px;
  right: -1px;
  top: -9px;
  height: 15px;
  pointer-events: none;
  background: #fff;
  clip-path: polygon(0 40%, 3% 28%, 6% 43%, 9% 20%, 12% 38%, 15% 26%, 18% 40%, 21% 18%, 24% 36%, 27% 22%, 30% 39%, 33% 26%, 36% 43%, 39% 23%, 42% 37%, 45% 24%, 48% 41%, 51% 25%, 54% 38%, 57% 21%, 60% 41%, 63% 25%, 66% 36%, 69% 22%, 72% 42%, 75% 24%, 78% 39%, 81% 22%, 84% 37%, 87% 25%, 90% 41%, 93% 22%, 96% 37%, 100% 30%, 100% 100%, 0 100%);
  display: none !important;
  content: none !important;
}

body.theme-dark .assistant-paper::after {
  background: #fff !important;
}

:root {
  --hj-refine-blue: #00AEEF;
  --hj-refine-orange: #E87722;
  --hj-v12-orange: #E87722;
  --hj-v14-blue: #00AEEF;
  --hj-v14-green: #51F690;
  --hj-v14-orange: #E87722;
}

body:not(.theme-dark) .mapped-hero, body:not(.theme-dark) .mapped-intro,
body:not(.theme-dark) .mapped-benefit-story,body:not(.theme-dark) .mapped-assistant-checklist,
body:not(.theme-dark) .works-refined,body:not(.theme-dark) .mapped-original-reviews,
body:not(.theme-dark) .faq-refined,body:not(.theme-dark) .download-refined,
body:not(.theme-dark) .site-footer {
  background: #fff !important;
}

.mapped-hero h1 {
  max-width: 990px;
  margin-bottom: 18px;
}

.mapped-hero > .container > p {
  max-width: 660px;
  margin: 0 auto 25px !important;
  font-size: clamp(1.05rem,1.45vw,1.25rem);
  line-height: 1.55;
}

.mapped-hero .hero-demo {
  max-width: 980px;
}

.mapped-intro {
  padding: 48px 0 60px !important;
}

.mapped-intro .intro-compact-layout {
  grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr);
  gap: clamp(32px,6vw,100px);
  align-items: start;
  display: block;
  max-width: 1280px;
  text-align: left;
}

.mapped-intro h2 {
  text-align: left;
  max-width: 900px;
  font-size: clamp(2.2rem, 3.5vw, 3.8rem);
  line-height: 1.05;
  margin: 0 0 22px;
}

.mapped-intro .intro-compact-copy {
  max-width: 940px;
  display: grid;
  grid-template-columns: minmax(0, 1.8fr) minmax(210px, .9fr);
  column-gap: clamp(25px, 4vw, 70px);
  align-items: start;
}

.mapped-intro .intro-compact-copy p {
  max-width: none;
  text-align: left;
  margin: 0;
  font-size: clamp(1rem, 1.22vw, 1.19rem);
  line-height: 1.65;
}

.mapped-intro .intro-compact-copy .demo-btn {
  justify-self: start;
  grid-column: 1 / -1;
  margin-top: 23px;
}

.mapped-benefit-story .benefit-pill-cta {
  margin-top: 18px;
  display: inline-flex;
  max-width: 100%;
  font-size: 14px;
  padding: 11px 19px;
  line-height: 1.35;
  text-align: center;
  white-space: normal;
}

.jude-story {
  max-width: none;
  margin: 0;
  border: 1px solid rgba(0,174,239,.16);
  border-radius: 25px;
  background: #fff;
  display: grid;
  grid-template-columns: minmax(230px,.72fr) minmax(0,1.28fr);
  gap: clamp(30px,5vw,80px);
  padding: clamp(32px,4.4vw,70px);
  box-shadow: 0 14px 36px rgba(20,43,62,.04);
}

.jude-story h3 {
  font-size: clamp(2.05rem,3vw,3.5rem);
  line-height: 1.08;
  letter-spacing: -.025em;
  margin: 0;
}

.jude-story-body p {
  font-size: clamp(1.02rem,1.16vw,1.19rem);
  line-height: 1.7;
  margin: 0 0 18px;
  color: #51606b;
}

.jude-story-body p:last-child {
  margin-bottom: 0;
}

body.theme-dark .jude-story {
  background: #292929;
  border-color: #444;
}

body.theme-dark .jude-story-body p {
  color: #c9c9c9;
}

.works-refined {
  background: #fff;
  padding: clamp(75px, 8vw, 116px) 0;
}

.works-refined .section-title {
  max-width: 780px;
  margin-bottom: clamp(28px, 3vw, 42px);
}

.works-refined .mapped-steps {
  margin: 0;
  border-top: 1px solid #dce6eb;
  border-bottom: 1px solid #dce6eb;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  border: 0 !important;
}

.works-refined .works-step {
  position: relative;
  background: transparent;
  padding: 35px 24px 40px 0;
  min-width: 0;
  border: 0;
  box-shadow: none;
}

.works-refined .works-step:not(:last-child) {
  border-right: 1px solid #dce6eb;
  margin-right: 24px;
}


.works-step-title {
  font-size: clamp(1.2rem,1.7vw,1.65rem);
  font-weight: 800;
  line-height: 1.14;
  margin: 0 0 12px;
  letter-spacing: -.015em;
  color: #171717;
}

.works-refined .works-step p {
  color: #56636b;
  margin: 0;
  max-width: 540px;
  font-size: clamp(.98rem, 1.1vw, 1.12rem);
  line-height: 1.6;
}

.works-refined .mapped-section-actions {
  text-align: left;
  margin-top: 30px;
}

body.theme-dark .works-refined {
  background: #222 !important;
}

body.theme-dark .works-refined .mapped-steps,body.theme-dark .works-refined .works-step:not(:last-child) {
  border-color: #464646;
}

body.theme-dark .works-step-title {
  color: #fff;
}

body.theme-dark .works-step p {
  color: #c7c7c7;
}

.faq-refined {
  background: #fff;
  padding: clamp(78px,8vw,112px) 0;
}

.faq-refined .container {
  max-width: 1280px;
}

.faq-refined .section-title {
  max-width: 780px;
  margin: 0 0 33px;
}

.faq-refined .mapped-faq-list {
  max-width: none;
  width: 100%;
  margin: 0;
}

.faq-refined .mapped-faq-item {
  border: 1px solid #e5e9ec;
  border-radius: 16px;
  background: #fff;
  margin-bottom: 10px;
  overflow: hidden;
}

.faq-refined .mapped-faq-item summary {
  padding: 22px 25px;
  font-size: 1.08rem;
  cursor: pointer;
}

.faq-refined .mapped-faq-item[open] {
  border-color: #b5dfe9;
}

.faq-refined .mapped-faq-answer {
  padding: 0 25px 22px;
  max-width: 900px;
}

.faq-refined .mapped-faq-help {
  text-align: left;
  margin-top: 25px;
}

body.theme-dark .faq-refined {
  background: #222 !important;
}

body.theme-dark .faq-refined .mapped-faq-item {
  background: #2b2b2b;
  border-color: #484848;
}

.download-refined {
  padding: clamp(85px,10vw,145px) 0 !important;
  border-top: 1px solid #e8edf0;
  background: #fff !important;
  overflow: hidden;
}

.download-refined .container {
  max-width: 1000px;
  text-align: center;
}

.download-refined h2 {
  font-size: clamp(2.8rem,5vw,5.1rem);
  line-height: 1.02;
  margin-bottom: 22px;
}

.download-refined p {
  font-size: clamp(1.05rem,1.5vw,1.25rem);
  line-height: 1.6;
  max-width: 720px;
  margin: 0 auto 27px;
}

.download-refined .mapped-download-anchor {
  background: var(--cta-orange);
  padding: 14px 27px;
}

.download-refined .mapped-download-anchor:hover {
  background: var(--cta-orange-hover);
}

.download-store-badges {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 24px;
}

.download-store-badges a {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
}

.download-store-badges img {
  height: 46px;
  width: auto;
  object-fit: contain;
}

body.theme-dark .download-refined {
  background: #222 !important;
  border-color: #444;
}

@media (min-width:992px) {
.mapped-original-reviews.trust-scroll-section {
  min-height: 205vh;
}
}

@media (min-width:992px) {
.mapped-original-reviews .trust-scroll-visual,.mapped-original-reviews .trust-scroll-copy-wrap {
  min-height: 195vh;
}
}

@media (min-width:992px) {
.mapped-original-reviews .trust-scroll-card.card-1 {
  top: 5%;
  left: 1%;
  right: auto;
}
}

@media (min-width:992px) {
.mapped-original-reviews .trust-scroll-card.card-2 {
  top: 19%;
  right: 2%;
  left: auto;
}
}

@media (min-width:992px) {
.mapped-original-reviews .trust-scroll-card.card-3 {
  top: 33%;
  left: 1%;
  right: auto;
}
}

@media (min-width:992px) {
.mapped-original-reviews .trust-scroll-card.card-4 {
  top: 47%;
  right: 2%;
  left: auto;
}
}

@media (min-width:992px) {
.mapped-original-reviews .trust-scroll-card.card-5 {
  top: 61%;
  left: 1%;
  right: auto;
}
}

@media (min-width:992px) {
.mapped-original-reviews .trust-scroll-card.card-6 {
  top: 75%;
  right: 2%;
  left: auto;
}
}

@media (min-width:992px) {
.mapped-original-reviews .trust-scroll-card {
  width: min(365px,42vw);
}
}

@media (max-width:991.98px) {
.mapped-intro .intro-compact-layout {
  grid-template-columns: 1fr;
  gap: 20px;
}
}

@media (max-width:991.98px) {
.works-refined .mapped-steps {
  grid-template-columns: repeat(2,minmax(0,1fr));
}
}

@media (max-width:991.98px) {
.works-refined .works-step {
  padding: 27px 20px 30px 0;
  border-bottom: 1px solid #dce6eb;
}
}

@media (max-width:991.98px) {
.works-refined .works-step:not(:last-child) {
  margin-right: 0;
}
}

@media (max-width:991.98px) {
.works-refined .works-step:nth-child(2) {
  border-right: 0;
  margin-left: 20px;
}
}

@media (max-width:991.98px) {
.works-refined .works-step:nth-child(4) {
  margin-left: 20px;
}
}

@media (max-width:991.98px) {
.works-refined .works-step:nth-child(n/**/+3) {
  border-bottom: 0;
}
}

@media (max-width:991.98px) {
.jude-story {
  grid-template-columns: 1fr;
  gap: 18px;
}
}

@media (max-width:700px) {
.mapped-hero {
  min-height: 0;
  padding-bottom: 5px;
}
}

@media (max-width:700px) {
.mapped-hero .container {
  padding-top: 128px;
  padding-bottom: 45px;
}
}

@media (max-width:700px) {
.mapped-hero h1 {
  font-size: clamp(2.35rem,9vw,3.35rem);
}
}

@media (max-width:700px) {
.mapped-hero > .container > p {
  font-size: 1.07rem;
  line-height: 1.5;
  margin-bottom: 19px !important;
}
}

@media (max-width:700px) {
.mapped-hero .hero-actions {
  margin-bottom: 22px;
}
}

@media (max-width:700px) {
.mapped-intro {
  padding: 52px 0 60px !important;
}
}

@media (max-width:700px) {
.mapped-intro .intro-compact-copy p {
  font-size: 1rem;
  line-height: 1.58;
}
}

@media (max-width:700px) {
.jude-story {
  padding: 26px 22px;
}
}

@media (max-width:700px) {
.works-refined {
  padding: 72px 0;
}
}

@media (max-width:700px) {
.works-refined .section-title {
  margin-bottom: 28px;
}
}

@media (max-width:700px) {
.works-refined .mapped-steps {
  grid-template-columns: 1fr;
}
}

@media (max-width:700px) {
.works-refined .works-step,.works-refined .works-step:not(:last-child),.works-refined .works-step:nth-child(2),.works-refined .works-step:nth-child(4) {
  margin: 0;
  border-right: 0;
  border-bottom: 1px solid #dce6eb;
  padding: 24px 0;
}
}

@media (max-width:700px) {
.works-refined .works-step:last-child {
  border-bottom: 0;
}
}

@media (max-width:700px) {

}

@media (max-width:700px) {
.faq-refined {
  padding: 72px 0;
}
}

@media (max-width:700px) {
.faq-refined .mapped-faq-item summary {
  padding: 18px;
  font-size: 1.02rem;
}
}

@media (max-width:700px) {
.faq-refined .mapped-faq-answer {
  padding: 0 18px 18px;
}
}

@media (max-width:700px) {
.download-refined {
  padding: 80px 0 !important;
}
}

@media (max-width:700px) {
.download-refined h2 {
  font-size: clamp(2.5rem,10vw,3.7rem);
}
}

@media (max-width:700px) {
.download-store-badges img {
  height: 41px;
}
}

.mapped-intro .intro-compact-copy p:nth-child(2) {
  font-weight: 700;
  color: #2a5464;
}

body.theme-dark .mapped-intro .intro-compact-copy p:nth-child(2) {
  color: #9de1f7 !important;
}

.mapped-benefit-story .how-step-text-card .mapped-benefit-value,
body.theme-dark .mapped-benefit-story .how-step-text-card .mapped-benefit-value,
.mapped-benefit-value, body.theme-dark .mapped-benefit-value {
  color: var(--hj-v12-orange) !important;
}

/* How It Works: static glass cards. No hover fill or hover movement. */
.works-refined .works-step,
.works-refined .works-step:not(:last-child),
.works-refined .works-step:nth-child(2),
.works-refined .works-step:nth-child(4) {
  display: block;
  width: 100%;
  max-width: none;
  min-width: 0;
  height: 100%;
  margin: 0;
  padding: clamp(26px, 3vw, 40px);
  border: 1px solid rgba(227,227,227,.72);
  border-radius: 22px;
  background: rgba(244,244,244,.56);
  box-shadow: 0 8px 23px rgba(0,0,0,.05);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  position: relative;
  overflow: hidden;
}

.works-refined .works-step-title {
  font-size: clamp(1.5rem, 2.15vw, 2.15rem);
  letter-spacing: -.025em;
  margin: 0 0 14px;
}
body.theme-dark .works-refined .works-step {
  background: rgba(26,26,26,.60) !important;
  border-color: rgba(255,255,255,.10) !important;
  box-shadow: 0 8px 23px rgba(0,0,0,.16) !important;
}


@media (max-width: 991.98px) {
.mapped-intro .intro-compact-copy {
  max-width: 800px;
  grid-template-columns: 1fr;
  gap: 12px;
}
}

@media (max-width: 991.98px) {
.mapped-intro .intro-compact-copy .demo-btn {
  margin-top: 11px;
}
}



@media (max-width: 700px) {
.mapped-intro {
  padding: 38px 0 50px !important;
}
}

@media (max-width: 700px) {
.mapped-intro h2 {
  font-size: clamp(2rem, 8vw, 2.7rem);
  margin-bottom: 17px;
}
}

@media (max-width: 700px) {
.mapped-intro .intro-compact-copy p {
  font-size: 1rem;
  line-height: 1.6;
}
}

@media (max-width: 700px) {
.works-refined .mapped-steps {
  grid-template-columns: 1fr;
  gap: 14px;
}
}

@media (max-width: 700px) {
.works-refined .works-step,.works-refined .works-step:not(:last-child),.works-refined .works-step:nth-child(2),.works-refined .works-step:nth-child(4) {
  padding: 24px;
  border: 1px solid rgba(227,227,227,.72);
  border-radius: 20px;
}
}

@media (max-width: 700px) {

}

@media (max-width: 700px) {
.works-refined .works-step-title {
  font-size: 1.5rem;
}
}



@media (prefers-reduced-motion: reduce) {
.works-refined .works-step {
  transition: none;
}
}

.cloud-hero {
  position: relative;
  display: block;
  background: #c8eaff !important;
  padding: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: hidden !important;
  isolation: isolate;
  padding-bottom: 0 !important;
}

body:not(.theme-dark) .cloud-hero {
  background: #c8eaff !important;
}

.cloud-hero .cloud-hero-sky {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: linear-gradient(147deg,#86ceff 1%,#a4e9ed 35%,#a3f0c7 73%,#e9fff3 100%) !important;
  overflow: hidden;
}

.cloud-hero .cloud-bank {
  position: absolute;
  pointer-events: none;
  width: 100%;
}

.cloud-bank-a {
  height: 56%;
  top: 17%;
  left: -13%;
  opacity: .95;
  background: radial-gradient(ellipse 17% 24% at 18% 77%, #fff 50%, transparent 98%),
    radial-gradient(ellipse 22% 34% at 29% 69%, #fff 53%, transparent 98%),
    radial-gradient(ellipse 23% 36% at 39% 80%, #fff 57%, transparent 100%),
    radial-gradient(ellipse 16% 26% at 52% 92%, #fff 55%, transparent 100%);
  filter: blur(26px);
}

.cloud-bank-b {
  height: 58%;
  top: 14%;
  left: 18%;
  opacity: .93;
  background: radial-gradient(ellipse 25% 37% at 69% 80%, #fff 45%, transparent 99%),
    radial-gradient(ellipse 21% 30% at 83% 65%, #fff 49%, transparent 100%),
    radial-gradient(ellipse 17% 30% at 100% 86%, #fff 58%, transparent 100%);
  filter: blur(30px);
}

.cloud-bank-c {
  height: 40%;
  bottom: 0;
  left: 0;
  opacity: .95;
  background: linear-gradient(0deg,#fff 0%,rgba(255,255,255,.90) 32%,rgba(255,255,255,0) 100%);
}

.cloud-hero .cloud-hero-content {
  text-align: center;
  position: relative;
  z-index: 3;
  padding-top: clamp(145px,17vh,205px) !important;
  padding-bottom: 0 !important;
}

.cloud-hero h1 {
  line-height: 1.03;
  margin: 0 auto 18px !important;
  font-weight: 900;
  letter-spacing: -.042em;
  color: #151515 !important;
  max-width: 900px;
  font-size: clamp(3rem,5.4vw,5.7rem);
}

.cloud-hero h1 .accent {
  color: #121c26 !important;
}

.cloud-hero .cloud-hero-content > p {
  max-width: 615px;
  margin: 0 auto 24px !important;
  line-height: 1.5;
  color: #324956 !important;
  font-weight: 500 !important;
  font-size: clamp(1.04rem,1.3vw,1.17rem);
}

.cloud-hero .hero-actions {
  margin: 0 auto !important;
  display: flex;
  align-items: center;
  justify-content: center;
}

.cloud-hero-cta {
  background: #E87722 !important;
  color: white !important;
  border-radius: 999px !important;
  border: 0 !important;
  padding: 13px 25px !important;
  min-height: 49px;
  font-size: 15px;
  font-weight: 800;
  box-shadow: 0 9px 22px rgba(212,87,28,.14);
}

.cloud-hero-cta:hover {
  background: var(--cta-orange-hover) !important;
  transform: translateY(-2px);
}

.cloud-hero-visual {
  pointer-events: none;
  position: relative !important;
  bottom: auto !important;
  left: auto !important;
  transform: none !important;
  margin: clamp(15px,3.2vw,42px) auto -6px;
  width: min(690px,78vw) !important;
  z-index: 2;
}

.cloud-hero-visual img {
  object-fit: contain;
  width: 100%;
  height: auto;
  display: block;
  filter: drop-shadow(0 26px 40px rgba(15,91,114,.16));
}

.cloud-hero-bottom {
  position: absolute;
  inset: auto 0 0;
  height: 12%;
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(0deg,rgba(255,255,255,.96),transparent);
}

.hero-interactive-section {
  background: #fff !important;
  padding: 68px 0 84px !important;
  overflow: visible;
}

.hero-interactive-section .container {
  max-width: 1140px;
}

.hero-interactive-title {
  font-size: clamp(1.7rem,2.5vw,2.5rem);
  font-weight: 800;
  letter-spacing: -.025em;
  text-align: center;
  margin: 0 0 25px;
  color: #181818;
}

.hero-interactive-section .hero-demo {
  position: relative;
  max-width: 960px;
  margin: 0 auto;
}

.hero-interactive-section .chat-shell {
  max-width: 900px;
}

body.theme-dark .cloud-hero {
  background: #173d44 !important;
}

body.theme-dark .cloud-hero .cloud-hero-sky {
  background: linear-gradient(155deg,#15374b 0%,#155c66 48%,#20735c 100%) !important;
}

body.theme-dark .cloud-bank-a,body.theme-dark .cloud-bank-b {
  opacity: .23;
  filter: blur(40px);
}

body.theme-dark .cloud-bank-c {
  background: linear-gradient(0deg,#222,transparent);
}

body.theme-dark .cloud-hero-bottom {
  background: linear-gradient(0deg,#222,transparent);
}

body.theme-dark .cloud-hero h1,body.theme-dark .cloud-hero h1 .accent {
  color: #fff !important;
}

body.theme-dark .cloud-hero .cloud-hero-content > p {
  color: #e4edf2 !important;
}

body.theme-dark .hero-interactive-section {
  background: #222 !important;
}

body.theme-dark .hero-interactive-title {
  color: #fff !important;
}

@media (max-width:991.98px) {
.cloud-hero {
  height: auto !important;
  min-height: 0 !important;
}
}

@media (max-width:991.98px) {
.cloud-hero .cloud-hero-content {
  padding-top: 145px !important;
}
}

@media (max-width:991.98px) {
.cloud-hero h1 {
  font-size: clamp(2.9rem,6.6vw,4.1rem);
}
}

@media (max-width:991.98px) {
.cloud-hero-visual {
  bottom: -10%;
  width: min(650px,92vw) !important;
  margin-top: 35px;
}
}

@media (max-width:600px) {
.cloud-hero {
  height: min(790px, 100svh);
  min-height: 690px;
}
}

@media (max-width:600px) {
.cloud-hero .cloud-hero-content {
  padding-left: 20px !important;
  padding-right: 20px !important;
  padding-top: 130px !important;
}
}

@media (max-width:600px) {
.cloud-hero h1 {
  max-width: 420px;
  margin-bottom: 16px !important;
  font-size: clamp(2.35rem,10vw,3.2rem) !important;
}
}

@media (max-width:600px) {
.cloud-hero .cloud-hero-content > p {
  font-size: 1.01rem;
  line-height: 1.43;
  max-width: 390px;
  margin-bottom: 19px !important;
}
}

@media (max-width:600px) {
.cloud-hero-cta {
  padding: 12px 23px !important;
}
}

@media (max-width:600px) {
.cloud-hero-visual {
  bottom: -18%;
  width: min(540px,114vw) !important;
  margin-top: 32px;
  margin-left: 50%;
  transform: translateX(-50%) !important;
}
}

@media (max-width:600px) {
.cloud-bank-a,.cloud-bank-b {
  filter: blur(18px);
}
}

@media (max-width:600px) {
.hero-interactive-section {
  padding: 52px 0 65px !important;
}
}

@media (max-width:600px) {
.hero-interactive-title {
  font-size: 1.75rem;
  max-width: 320px;
  margin: 0 auto 20px;
}
}

@media (max-width:380px) {
.cloud-hero {
  min-height: 675px;
  height: 735px;
}
}

@media (max-width:380px) {
.cloud-hero .cloud-hero-content {
  padding-top: 122px !important;
}
}

@media (max-width:380px) {
.cloud-hero h1 {
  font-size: 2.25rem;
}
}

@media (max-width:380px) {
.cloud-hero-visual {
  width: 440px;
  bottom: -20%;
}
}

@media (prefers-reduced-motion:reduce) {
.cloud-hero-cta {
  transition: none !important;
}
}

body:not(.theme-dark) .cloud-hero, .cloud-hero {
  background: #b7f2f0 !important;
}

.cloud-hero .cloud-hero-sky::before {
  content: "";
  position: absolute;
  inset: -18% -12%;
  background: radial-gradient(ellipse 37% 27% at 16% 34%,rgba(0,156,255,.38),transparent 85%),radial-gradient(ellipse 34% 35% at 78% 24%,rgba(74,237,153,.60),transparent 88%),radial-gradient(ellipse 45% 30% at 65% 77%,rgba(0,174,239,.23),transparent 95%);
  filter: blur(42px);
  animation: hjSkyMove 18s ease-in-out infinite alternate;
  transform-origin: center;
}

.cloud-hero .cloud-bank-a {
  height: 55%;
  top: 26%;
  opacity: .73;
  filter: blur(36px);
}

.cloud-hero .cloud-bank-b {
  height: 56%;
  top: 22%;
  opacity: .67;
  filter: blur(38px);
}

.cloud-hero .cloud-bank-c {
  height: 25%;
  bottom: 0;
  opacity: .35;
  background: linear-gradient(0deg,rgba(255,255,255,.5),transparent);
}

@keyframes hjSkyMove {0%{transform:translate3d(-2%,0,0) scale(1)}100%{transform:translate3d(3%,2%,0) scale(1.08)}}

.hero-interactive-section.hero-v14-overlap {
  position: relative;
  z-index: 5;
  margin-top: clamp(-215px,-16vw,-125px);
  padding: 0 0 clamp(45px,6vw,88px) !important;
  background: transparent !important;
  isolation: isolate;
  overflow: visible !important;
}

.hero-v14-overlap::before {
  content: "";
  position: absolute;
  inset: clamp(110px,14vw,175px) 0 0;
  z-index: -1;
  background: #fff;
  pointer-events: none;
}

.hero-v14-overlap .container {
  max-width: 1180px;
}

.hero-v14-overlap .hero-interactive-title {
  position: relative;
  margin: 0 auto 22px;
  line-height: 1.12;
  color: #17272e;
  font-size: clamp(1.65rem,2.7vw,2.7rem);
}

.hero-v14-overlap .hero-demo {
  position: relative;
  max-width: 990px;
  z-index: 2;
  transform: translateY(var(--hero-chat-offset,36px));
  opacity: var(--hero-chat-opacity,.72);
  transition: transform .13s linear,opacity .13s linear;
}

.hero-v14-overlap .chat-shell {
  background: rgba(255,255,255,.96);
  box-shadow: 0 25px 65px rgba(21,86,103,.15);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-radius: 24px;
}

.hero-membership-bridge {
  max-width: 990px;
  margin: clamp(62px,8vw,112px) auto 0;
  padding: 0 4px 0;
  border: 0;
  background: transparent;
}

.hero-membership-bridge h2 {
  font-size: clamp(1.7rem,2.5vw,2.5rem);
  line-height: 1.12;
  letter-spacing: -.025em;
  margin: 0 0 15px;
  font-weight: 800;
  text-align: left;
}

.hero-membership-bridge .intro-compact-copy {
  display: block;
  max-width: 900px;
}

.hero-membership-bridge .intro-compact-copy p {
  max-width: 880px;
  font-size: clamp(1rem,1.13vw,1.12rem);
  line-height: 1.65;
  color: #52616b;
  margin: 0 0 13px;
  text-align: left;
}

.hero-membership-bridge .intro-compact-copy p:nth-child(2) {
  font-weight: 750;
  color: #172b33;
}

.hero-membership-bridge .intro-compact-copy .demo-btn {
  margin-top: 13px;
}

.mapped-benefit-story .how-step-text-card .mapped-benefit-value,.mapped-benefit-value {
  color: #172024 !important;
}

body.theme-dark .mapped-benefit-story .how-step-text-card .mapped-benefit-value,body.theme-dark .mapped-benefit-value {
  color: #fff !important;
}

@media (min-width:1080px) {
.works-refined .mapped-steps {
  grid-template-columns: repeat(4,minmax(0,1fr)) !important;
  gap: 15px !important;
}
}

@media (min-width:1080px) {
.works-refined .works-step {
  padding: 25px 21px !important;
}
}

@media (min-width:1080px) {
.works-refined .works-step-title {
  font-size: clamp(1.25rem,1.55vw,1.65rem) !important;
}
}

@media (min-width:1080px) {
.works-refined .works-step p {
  font-size: .96rem !important;
}
}

@media (min-width:1080px) {

}

.faq-refined .mapped-faq-item .mapped-faq-answer {
  overflow: hidden;
  will-change: height,opacity;
}

.faq-refined .mapped-faq-item summary:focus-visible {
  outline: 2px solid #00AEEF;
  outline-offset: -4px;
  border-radius: 14px;
}

body.theme-dark .cloud-hero .cloud-hero-sky::before {
  opacity: .50;
}

body.theme-dark .hero-v14-overlap::before {
  background: #222;
}

body.theme-dark .hero-v14-overlap .hero-interactive-title {
  color: #fff !important;
}

body.theme-dark .hero-membership-bridge h2 {
  color: #fff !important;
}

body.theme-dark .hero-membership-bridge p {
  color: #cbd3d6 !important;
}

body.theme-dark .hero-membership-bridge .intro-compact-copy p:nth-child(2) {
  color: #fff !important;
}

@media (max-width:991.98px) {
.hero-interactive-section.hero-v14-overlap {
  margin-top: -120px;
}
}

@media (max-width:991.98px) {
.hero-v14-overlap::before {
  top: 100px;
}
}

@media (max-width:991.98px) {
.hero-v14-overlap .hero-interactive-title {
  max-width: 580px;
}
}

@media (max-width:600px) {
.hero-interactive-section.hero-v14-overlap {
  margin-top: -66px;
  padding-bottom: 50px !important;
}
}

@media (max-width:600px) {
.hero-v14-overlap::before {
  top: 50px;
}
}

@media (max-width:600px) {
.hero-v14-overlap .hero-interactive-title {
  font-size: clamp(1.6rem,6.8vw,2.05rem);
  margin-bottom: 16px;
  max-width: 320px;
}
}

@media (max-width:600px) {
.hero-v14-overlap .hero-demo {
  transform: none !important;
  opacity: 1 !important;
}
}

@media (max-width:600px) {
.hero-v14-overlap .chat-shell {
  border-radius: 20px;
}
}

@media (max-width:600px) {
.hero-membership-bridge {
  margin-top: 55px;
  padding: 0 5px;
}
}

@media (max-width:600px) {
.hero-membership-bridge h2 {
  font-size: clamp(1.75rem,7vw,2.25rem);
}
}

@media (max-width:600px) {
.hero-membership-bridge .intro-compact-copy p {
  font-size: 1rem;
  line-height: 1.58;
}
}



@media (prefers-reduced-motion:reduce) {
.cloud-hero .cloud-hero-sky::before {
  animation: none !important;
}
}

@media (prefers-reduced-motion:reduce) {
.hero-v14-overlap .hero-demo {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}
}

@media (prefers-reduced-motion:reduce) {
.faq-refined .mapped-faq-answer {
  will-change: auto !important;
}
}

body.theme-dark .hero-interactive-section.hero-v14-overlap {
  background: transparent !important;
}

.hero-cover-sequence {
  position: relative;
  isolation: isolate;
  background: #ffffff;
}

.hero-cover-sequence > .cloud-hero {
  position: sticky !important;
  top: 0;
  z-index: 0;
  height: 100svh !important;
  min-height: 710px !important;
  max-height: none;
  overflow: hidden !important;
  background: #c8eaff !important;
}

body:not(.theme-dark) .hero-cover-sequence .cloud-hero .cloud-hero-sky,
.hero-cover-sequence .cloud-hero .cloud-hero-sky {
  background: linear-gradient(180deg, #94d6fc 0%, #b9e6ff 30%, #e3f5ff 69%, #ffffff 100%) !important;
}

.hero-cover-sequence .cloud-hero .cloud-hero-sky::before {
  display: none !important;
}

.hero-cover-sequence .cloud-hero .cloud-hero-sky .cloud-hero-photo {
  position: absolute;
  inset: -4% -3%;
  pointer-events: none;
  background-image: url("../assets/clouds-soft-v15.jpg");
  background-size: cover;
  background-position: center 43%;
  opacity: .125;
  mix-blend-mode: screen;
  filter: blur(2.2px) saturate(.78);
  animation: hjV15CloudDrift 34s ease-in-out infinite alternate;
}

@keyframes hjV15CloudDrift {
  from { transform:translate3d(-1.2%,0,0) scale(1.045); }
  to   { transform:translate3d(1.2%,-1%,0) scale(1.07); }
}

.hero-cover-sequence .cloud-hero .cloud-bank-a {
  height: 56%;
  top: 17%;
  left: -13%;
  opacity: .66;
  filter: blur(26px);
}

.hero-cover-sequence .cloud-hero .cloud-bank-b {
  height: 58%;
  top: 14%;
  left: 18%;
  opacity: .63;
  filter: blur(30px);
}

.hero-cover-sequence .cloud-hero .cloud-bank-c {
  opacity: .16;
}

.hero-cover-sequence .cloud-hero .cloud-hero-bottom {
  display: none !important;
}

.hero-cover-sequence .cloud-hero-visual {
  position: absolute !important;
  left: 50% !important;
  bottom: -165px !important;
  margin: 0 !important;
  width: min(690px,75vw) !important;
  transform: translateX(-50%) !important;
  z-index: 2;
}

.hero-cover-sequence .cloud-hero-visual img {
  filter: drop-shadow(0 24px 35px rgba(22,74,104,.13));
}

.hero-cover-sequence .cloud-hero-content {
  padding-top: clamp(146px,17vh,203px) !important;
}

.hero-cover-sequence > .hero-cover-sheet {
  position: relative !important;
  z-index: 4 !important;
  margin: 0 !important;
  padding: clamp(65px,7.5vw,108px) 0 clamp(70px,8vw,112px) !important;
  background: #ffffff !important;
  isolation: isolate;
  border: 0;
  box-shadow: 0 -14px 38px rgba(45,94,114,.035);
}

.hero-cover-sheet::before {
  display: none !important;
}

.hero-cover-sheet .hero-interactive-title {
  color: #17272e !important;
  margin-bottom: 25px;
}

.hero-cover-sheet .hero-demo {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}

.hero-cover-sheet .hero-membership-bridge {
  margin-top: clamp(60px,7vw,96px);
}

body.theme-dark .hero-cover-sequence {
  background: #222;
}

body.theme-dark .hero-cover-sequence > .cloud-hero {
  background: #142735 !important;
}

body.theme-dark .hero-cover-sequence .cloud-hero .cloud-hero-sky {
  background: linear-gradient(180deg,#123448 0%,#2c5264 42%,#647d89 84%,#222 100%) !important;
}

body.theme-dark .hero-cover-sequence .cloud-hero .cloud-hero-photo {
  opacity: .09;
  mix-blend-mode: screen;
}

body.theme-dark .hero-cover-sequence > .hero-cover-sheet {
  background: #222 !important;
  box-shadow: none;
}

body.theme-dark .hero-cover-sheet .hero-interactive-title {
  color: #fff !important;
}

@media (max-width:991.98px) {
.hero-cover-sequence > .cloud-hero {
  min-height: 680px !important;
  height: 100svh !important;
}
}

@media (max-width:991.98px) {
.hero-cover-sequence .cloud-hero-visual {
  width: min(650px,86vw) !important;
  bottom: -145px !important;
}
}

@media (max-width:600px) {
.hero-cover-sequence > .cloud-hero {
  height: 100svh !important;
  min-height: 685px !important;
}
}

@media (max-width:600px) {
.hero-cover-sequence .cloud-hero-visual {
  width: min(520px,116vw) !important;
  bottom: -87px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  margin: 0 !important;
}
}

@media (max-width:600px) {
.hero-cover-sequence .cloud-hero-content {
  padding-top: clamp(128px,15svh,165px) !important;
}
}

@media (max-width:600px) {
.hero-cover-sequence > .hero-cover-sheet {
  padding: 56px 0 73px !important;
}
}

@media (max-width:600px) {
.hero-cover-sheet .hero-interactive-title {
  margin-bottom: 22px;
}
}

@media (max-width:600px) {
.hero-cover-sequence .cloud-hero .cloud-hero-photo {
  opacity: .10;
}
}

@media (max-width:380px) {
.hero-cover-sequence > .cloud-hero {
  min-height: 670px !important;
}
}

@media (max-width:380px) {
.hero-cover-sequence .cloud-hero-visual {
  width: 490px !important;
  bottom: -105px !important;
}
}

@media (prefers-reduced-motion:reduce) {
.hero-cover-sequence .cloud-hero-photo {
  animation: none !important;
}
}

.hero-v16.hero-section {
  position: relative !important;
  isolation: isolate;
  overflow: hidden !important;
  min-height: 1130px !important;
  height: 1130px !important;
  background: #b4e5ff !important;
}

.hero-v16 .cloud-hero-sky {
  background: linear-gradient(180deg,#a1dcfd 0%,#cbeeff 41%,#eaf7ff 83%,#f7fcff 100%) !important;
}

.hero-v16 .cloud-hero-photo {
  opacity: .105 !important;
}

.hero-v16 .cloud-bank-a,.hero-v16 .cloud-bank-b {
  opacity: .35 !important;
}

.hero-v16 .cloud-bank-c {
  opacity: 0 !important;
}

.hero-v16 .cloud-hero-content {
  position: relative !important;
  z-index: 6 !important;
  padding-top: clamp(125px,13vh,168px) !important;
  pointer-events: none;
}

.hero-v16 .cloud-hero-content a {
  pointer-events: auto;
}

.hero-v16 .cloud-hero-content h1 {
  max-width: 920px !important;
  font-size: clamp(3.1rem,5.35vw,5.75rem) !important;
}

.hero-v16 .cloud-hero-content > p {
  max-width: 660px !important;
}

.hero-v16 .cloud-hero-visual {
  z-index: 2 !important;
  position: absolute !important;
  left: 52% !important;
  bottom: 90px !important;
  width: min(565px,59vw) !important;
  transform: translateX(-50%) !important;
  pointer-events: none !important;
  margin: 0 !important;
}

.hero-v16 .cloud-hero-visual img {
  display: block;
  width: 100%;
  height: auto;
  filter: drop-shadow(0 22px 31px rgba(20,75,99,.16)) !important;
}

.hero-v16 .hero-v16-interactive {
  position: absolute;
  z-index: 8;
  bottom: 28px;
  left: 0;
  right: 0;
  padding: 0 20px !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  isolation: auto !important;
}

.hero-v16-interactive::before {
  display: none !important;
}

.hero-v16-interactive .container {
  max-width: 1020px !important;
}

.hero-v16-interactive .hero-interactive-title {
  color: #182e3c !important;
  font-size: clamp(1.3rem,2.3vw,2.15rem) !important;
  margin: 0 0 15px !important;
  text-shadow: 0 1px 12px rgba(255,255,255,.7);
}

.hero-v16-interactive .hero-demo {
  width: 100%;
  max-width: 950px !important;
  margin: 0 auto;
  padding: 16px 19px;
  border: 1px solid rgba(255,255,255,.75);
  border-radius: 28px;
  background: rgba(255,255,255,.84);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  box-shadow: 0 19px 70px rgba(37,96,127,.13);
  opacity: 1 !important;
  transform: none !important;
}

.hero-v16-interactive .chat-shell {
  max-width: 900px !important;
}

.hero-v16-membership {
  position: relative;
  background: #fff !important;
  padding: clamp(56px,6vw,88px) 0 clamp(60px,7vw,100px);
}

.hero-v16-membership .container {
  max-width: 1140px;
}

.hero-v16-membership .hero-membership-bridge {
  margin: 0 !important;
}

body.theme-dark .hero-v16.hero-section {
  background: #213e51 !important;
}

body.theme-dark .hero-v16 .cloud-hero-sky {
  background: linear-gradient(180deg,#1b405b,#4a7891 60%,#7594a3) !important;
}

body.theme-dark .hero-v16 .cloud-bank-a,body.theme-dark .hero-v16 .cloud-bank-b {
  opacity: .17 !important;
}

body.theme-dark .hero-v16-interactive .hero-interactive-title {
  color: #fff !important;
  text-shadow: 0 2px 12px rgba(0,0,0,.26) !important;
}

body.theme-dark .hero-v16-interactive .hero-demo {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body.theme-dark .hero-v16-membership {
  background: #222 !important;
}

@media (max-width:991.98px) {
.hero-v16.hero-section {
  min-height: 1040px !important;
  height: 1040px !important;
}
}

@media (max-width:991.98px) {
.hero-v16 .cloud-hero-content {
  padding-top: 135px !important;
}
}

@media (max-width:991.98px) {
.hero-v16 .cloud-hero-visual {
  width: min(520px,74vw) !important;
  left: 52% !important;
  bottom: 125px !important;
}
}

@media (max-width:991.98px) {
.hero-v16 .hero-v16-interactive {
  bottom: 22px;
}
}

@media (max-width:600px) {
.hero-v16.hero-section {
  height: 980px !important;
  min-height: 980px !important;
}
}

@media (max-width:600px) {
.hero-v16 .cloud-hero-content {
  padding-top: 118px !important;
  padding-left: 18px !important;
  padding-right: 18px !important;
}
}

@media (max-width:600px) {
.hero-v16 .cloud-hero-content h1 {
  font-size: clamp(2.15rem,9.6vw,3rem) !important;
}
}

@media (max-width:600px) {
.hero-v16 .cloud-hero-content > p {
  font-size: .98rem !important;
  line-height: 1.4 !important;
}
}

@media (max-width:600px) {
.hero-v16 .cloud-hero-visual {
  width: min(435px,105vw) !important;
  bottom: 170px !important;
  left: 54% !important;
}
}

@media (max-width:600px) {
.hero-v16 .hero-v16-interactive {
  bottom: 12px;
  padding: 0 10px !important;
}
}

@media (max-width:600px) {
.hero-v16-interactive .hero-interactive-title {
  font-size: 1.42rem !important;
  margin-bottom: 9px !important;
}
}

@media (max-width:600px) {
.hero-v16-interactive .hero-demo {
  padding: 9px;
  border-radius: 19px;
}
}

@media (max-width:600px) {
.hero-v16-membership {
  padding: 45px 0 65px;
}
}

@media (max-width:380px) {
.hero-v16.hero-section {
  height: 970px !important;
  min-height: 970px !important;
}
}

@media (max-width:380px) {
.hero-v16 .cloud-hero-visual {
  width: 415px !important;
  bottom: 185px !important;
}
}

@media (prefers-reduced-motion:reduce) {
.hero-v16 .cloud-hero-photo {
  animation: none !important;
}
}

.hero-v17-sequence {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: linear-gradient(180deg,
    #99d5fa 0%,
    #c0e5ff 24%,
    #daeffe 49%,
    #eaf7ff 75%,
    #f9fdff 92%,
    #fff 100%) !important;
}

.hero-v17-sequence::before {
  content: "";
  position: absolute;
  z-index: 0;
  pointer-events: none;
  background: url("../assets/clouds-soft-v15.jpg") center 22% / cover no-repeat;
  inset: 0 0 34% !important;
  opacity: .22 !important;
  filter: blur(1.4px) saturate(.69) !important;
  background-position: center 12% !important;
  -webkit-mask-image: linear-gradient(180deg,rgba(0,0,0,.9) 0%,rgba(0,0,0,.85) 34%,transparent 100%) !important;
  mask-image: linear-gradient(180deg,rgba(0,0,0,.9) 0%,rgba(0,0,0,.85) 34%,transparent 100%) !important;
}

.hero-v17-sequence .hero-v17.hero-section {
  position: relative !important;
  z-index: 1;
  background: transparent !important;
  min-height: 0 !important;
  height: auto !important;
  overflow: visible !important;
  padding: 0 !important;
}

.hero-v17 .cloud-hero-sky {
  display: none !important;
}

.hero-v17 .cloud-hero-content {
  position: relative !important;
  z-index: 5 !important;
  text-align: center !important;
  padding: clamp(125px,14vh,166px) 20px 0 !important;
  max-width: 1140px !important;
  pointer-events: auto !important;
}

.hero-v17 .cloud-hero-content h1 {
  max-width: 950px !important;
  font-size: clamp(3rem,5.6vw,5.7rem) !important;
  line-height: 1.045 !important;
  margin: 0 auto 20px !important;
  letter-spacing: -.04em !important;
  color: #161b21 !important;
}

.hero-v17 .cloud-hero-content h1 .accent {
  color: inherit !important;
}

.hero-v17 .cloud-hero-content > p {
  max-width: 690px !important;
  margin: 0 auto 25px !important;
  color: #344957 !important;
  font-size: clamp(1.03rem,1.48vw,1.25rem) !important;
  line-height: 1.52 !important;
}

.hero-v17 .hero-actions {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  margin: 0 !important;
}

.hero-v17 .cloud-hero-cta {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: 50px;
  padding: 13px 28px !important;
}

.hero-v17 .cloud-hero-visual {
  position: relative !important;
  z-index: 2 !important;
  width: min(660px,70vw) !important;
  max-width: 100% !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  transform: none !important;
  margin: clamp(22px,3.2vw,40px) auto 0 !important;
  pointer-events: none !important;
}

.hero-v17 .cloud-hero-visual img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
  opacity: 1 !important;
  filter: drop-shadow(0 28px 33px rgba(21,71,96,.10)) !important;
  -webkit-mask-image: linear-gradient(90deg,#000 0%,#000 90%,transparent 100%);
  mask-image: linear-gradient(90deg,#000 0%,#000 90%,transparent 100%);
}

.hero-v17-art {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  overflow: hidden;
}

.hero-v17-circle {
  position: absolute;
  opacity: .32;
  width: clamp(120px,15vw,220px);
  height: auto;
}

.hero-v17-circle-a {
  left: calc(50% - 400px);
  top: 52%;
  transform: rotate(27deg);
}

.hero-v17-circle-b {
  right: calc(50% - 435px);
  top: 66%;
  transform: rotate(-29deg);
  opacity: .2;
  width: clamp(110px,12vw,178px);
}

.hero-v17 .hero-v16-interactive {
  position: relative !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  z-index: 7 !important;
  margin: clamp(-75px,-5vw,-35px) auto 0 !important;
  padding: 0 16px !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  margin-top: 16px !important;
}

.hero-v17 .hero-v16-interactive .container {
  max-width: 980px !important;
  padding: 0 !important;
}

.hero-v17 .hero-interactive-title {
  position: relative !important;
  color: #172e3b !important;
  margin: 0 auto 18px !important;
  font-size: clamp(1.8rem,2.6vw,2.45rem) !important;
  text-align: center !important;
  text-shadow: none !important;
}

.hero-v17 .hero-v16-interactive .hero-demo {
  width: 100% !important;
  max-width: 920px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
  transform: none !important;
  opacity: 1 !important;
}

.hero-v17 .hero-v16-interactive .chat-shell {
  max-width: 920px !important;
  background: rgba(255,255,255,.88) !important;
  border: 1px solid rgba(255,255,255,.8) !important;
  border-radius: 21px !important;
  box-shadow: 0 13px 37px rgba(42,88,109,.11) !important;
  animation: none !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.hero-v17 .hero-v16-interactive .chat-shell:hover {
  transform: none !important;
}

.hero-v17-sequence .hero-v16-membership {
  position: relative !important;
  z-index: 2;
  background: transparent !important;
  padding: clamp(90px,9vw,136px) 20px clamp(90px,10vw,145px) !important;
  padding-top: clamp(64px,7vw,95px) !important;
}

.hero-v17-sequence .hero-v16-membership .container {
  max-width: 1000px !important;
}

.hero-v17-sequence .hero-membership-bridge {
  margin: 0 auto !important;
}

body.theme-dark .hero-v17-sequence {
  background: linear-gradient(180deg,#174059 0%,#2b5163 35%,#293f48 71%,#222 100%) !important;
}

body.theme-dark .hero-v17-sequence::before {
  mix-blend-mode: screen;
  opacity: .11 !important;
}

body.theme-dark .hero-v17.hero-section {
  background: transparent !important;
}

body.theme-dark .hero-v17 .cloud-hero-content h1,
body.theme-dark .hero-v17 .cloud-hero-content h1 .accent {
  color: #fff !important;
}

body.theme-dark .hero-v17 .cloud-hero-content > p {
  color: #e0e9eb !important;
}

body.theme-dark .hero-v17 .hero-interactive-title {
  color: #fff !important;
}


body.theme-dark .hero-v17-sequence .hero-v16-membership {
  background: transparent !important;
}

@media (max-width:991.98px) {
.hero-v17 .cloud-hero-content {
  padding-top: clamp(120px,15vh,160px) !important;
}
}

@media (max-width:991.98px) {
.hero-v17 .cloud-hero-visual {
  width: min(570px,82vw) !important;
}
}

@media (max-width:991.98px) {
.hero-v17-circle-a {
  left: 7%;
  top: 55%;
}
}

@media (max-width:991.98px) {
.hero-v17-circle-b {
  right: 8%;
  top: 65%;
}
}

@media (max-width:600px) {
.hero-v17 .cloud-hero-content {
  padding: 115px 20px 0 !important;
  padding-top: 137px !important;
}
}

@media (max-width:600px) {
.hero-v17 .cloud-hero-content h1 {
  font-size: clamp(2.4rem,10vw,3.25rem) !important;
  margin-bottom: 15px !important;
}
}

@media (max-width:600px) {
.hero-v17 .cloud-hero-content > p {
  font-size: 1rem !important;
  line-height: 1.47 !important;
  margin-bottom: 20px !important;
}
}

@media (max-width:600px) {
.hero-v17 .cloud-hero-visual {
  width: min(430px,98vw) !important;
  margin-top: 24px !important;
}
}

@media (max-width:600px) {
.hero-v17-circle-a {
  left: -18px;
  top: 55%;
  width: 125px;
  opacity: .24;
}
}

@media (max-width:600px) {
.hero-v17-circle-b {
  right: -22px;
  top: 66%;
  width: 115px;
  opacity: .13;
}
}

@media (max-width:600px) {
.hero-v17 .hero-v16-interactive {
  padding: 0 15px !important;
  margin-top: 12px !important;
}
}

@media (max-width:600px) {
.hero-v17 .hero-interactive-title {
  font-size: clamp(1.55rem,6.5vw,2.05rem) !important;
  max-width: 340px !important;
  margin-bottom: 15px !important;
}
}

@media (max-width:600px) {
.hero-v17 .hero-v16-interactive .chat-shell {
  border-radius: 18px !important;
}
}

@media (max-width:600px) {
.hero-v17-sequence .hero-v16-membership {
  padding: 74px 19px 85px !important;
}
}

@media (max-width:380px) {
.hero-v17 .cloud-hero-content {
  padding-top: 110px !important;
}
}

@media (max-width:380px) {
.hero-v17 .cloud-hero-content h1 {
  font-size: 2.3rem !important;
}
}

@media (max-width:380px) {
.hero-v17 .cloud-hero-visual {
  width: 100% !important;
}
}

@media (prefers-reduced-motion:reduce) {
.hero-v17 .hero-v16-interactive .chat-shell {
  animation: none !important;
  transition: none !important;
}
}

@media (max-width:600px) {
.hero-v17 .cloud-hero-cta {
  width: auto !important;
  min-width: 190px !important;
  max-width: 100% !important;
}
}

.hero-v18 .cloud-hero-content {
  padding: clamp(124px,15vh,158px) 20px 0 !important;
  max-width: 1050px !important;
}

.hero-v18 .cloud-hero-content h1 {
  max-width: 850px !important;
  font-size: clamp(3rem,5.3vw,5.15rem) !important;
  line-height: 1.065 !important;
  margin-bottom: 17px !important;
}

.hero-v18 .cloud-hero-content>p {
  max-width: 625px !important;
  font-size: clamp(1rem,1.3vw,1.15rem) !important;
  margin-bottom: 22px !important;
}

.hero-v18 .cloud-hero-visual {
  position: relative !important;
  z-index: 2 !important;
  width: clamp(300px,33vw,455px) !important;
  max-width: calc(100vw - 38px) !important;
  margin: 30px auto 0 !important;
  transform: none !important;
  isolation: isolate;
}

.hero-v18 .cloud-hero-visual .hero-v18-phone {
  display: block;
  width: 100% !important;
  height: auto !important;
  position: relative;
  -webkit-mask-image: none !important;
  mask-image: none !important;
  filter: drop-shadow(0 19px 26px rgba(20,75,100,.13)) !important;
  z-index: 2 !important;
}

.hero-v18 .cloud-hero-visual .hero-v18-ring {
  position: absolute;
  z-index: 1;
  display: block;
  width: 108%;
  height: auto;
  left: -8%;
  top: 16%;
  opacity: .88;
  transform: rotate(13deg);
  transform-origin: 50% 50%;
  animation: heroRingDrift 62s linear infinite;
  pointer-events: none;
  /* The old generic hero-image rules added a rectangular mask and
     drop-shadow to the SVG ring. Keep the ring's own artwork untouched. */
  -webkit-mask-image: none !important;
  mask-image: none !important;
  filter: none !important;
}

.hero-v18 .hero-v16-interactive {
  position: relative !important;
  z-index: 4 !important;
  margin: 0 auto !important;
  padding: 0 16px !important;
}

.hero-v18 .hero-interactive-title {
  margin: 0 auto 15px !important;
  font-size: clamp(2.15rem, 3vw, 2.8rem) !important;
  line-height: 1.1 !important;
  font-weight: 900 !important;
  letter-spacing: -.025em !important;
  max-width: 950px !important;
  margin-bottom: 18px !important;
}

.hero-v18 .hero-v16-interactive .chat-shell {
  background: rgba(255,255,255,.89) !important;
  border-color: rgba(255,255,255,.88) !important;
  box-shadow: 0 26px 52px rgba(27,79,107,.21), 0 9px 18px rgba(27,79,107,.1) !important;
}

/* Light theme: conversation and composer share one white surface. */
body:not(.theme-dark) .hero-v18 .hero-v16-interactive .chat-shell {
  background: #fff !important;
}


@media (max-width:767.98px) {
.hero-v18 .cloud-hero-content {
  padding: clamp(112px,13vh,137px) 18px 0 !important;
}
}

@media (max-width:767.98px) {
.hero-v18 .cloud-hero-content h1 {
  font-size: clamp(2.45rem,9.3vw,3.5rem) !important;
  max-width: 520px !important;
  line-height: 1.07 !important;
}
}

@media (max-width:767.98px) {
.hero-v18 .cloud-hero-content>p {
  font-size: 1rem !important;
  line-height: 1.5 !important;
  max-width: 500px !important;
  margin-bottom: 19px !important;
}
}

@media (max-width:767.98px) {
.hero-v18 .cloud-hero-visual {
  width: clamp(245px,68vw,350px) !important;
  margin-top: 21px !important;
}
}

@media (max-width:767.98px) {
.hero-v18 .hero-v18-ring {
  display: block !important;
}
}

@media (max-width:767.98px) {
.hero-v18 .hero-v16-interactive {
  margin: 0 auto !important;
  padding: 0 16px !important;
}
}

@media (max-width:767.98px) {
.hero-v18 .hero-interactive-title {
  font-size: clamp(1.5rem,6vw,2rem) !important;
  line-height: 1.17 !important;
}
}

@media (max-width:767.98px) {
.hero-v18 .hero-v16-interactive .chat-shell {
  border-radius: 18px !important;
}
}

@media (max-width:767.98px) {
.hero-v17-sequence .hero-v16-membership {
  padding-top: 62px !important;
}
}

@media (max-width:380px) {
.hero-v18 .cloud-hero-content {
  padding-top: 111px !important;
}
}

@media (max-width:380px) {
.hero-v18 .cloud-hero-content h1 {
  font-size: 2.28rem !important;
}
}

@media (max-width:380px) {
.hero-v18 .cloud-hero-visual {
  width: min(68vw,275px) !important;
}
}

@media (prefers-reduced-motion:reduce) {
.hero-v18 .cloud-hero-visual,.hero-v17-sequence::before {
  animation: none !important;
}
.hero-v18 .cloud-hero-visual .hero-v18-ring {
  animation: none !important;
}
}

@media (max-width: 767.98px) {
.hero-v18 .cloud-hero-visual .hero-v18-ring {
  display: block !important;
  width: 102%;
  left: -9%;
  top: 18%;
  opacity: .76;
}
}

@media (max-width: 767.98px) {
.hero-v18 .hero-interactive-title {
  font-size: clamp(1.95rem, 7.4vw, 2.5rem) !important;
  line-height: 1.12 !important;
  max-width: 520px !important;
  margin-bottom: 16px !important;
}
}

.hero-v18 .hero-v16-interactive .hero-demo {
  margin-top: 0 !important;
}

/* Hero continuation: breathable chat, integrated membership, and close benefit handoff. */
@keyframes heroRingDrift {
  from { transform: rotate(13deg); }
  to { transform: rotate(373deg); }
}
.hero-v17-sequence .hero-v18 .hero-v16-interactive {
  padding-bottom: 0 !important;
  overflow: visible !important;
}
.hero-v17-sequence .hero-v18 .hero-v16-interactive .hero-demo,
.hero-v17-sequence .hero-v18 .hero-v16-interactive .container {
  overflow: visible !important;
}
.hero-v17-sequence .hero-v18 .hero-v16-interactive .chat-shell {
  position: relative;
  z-index: 3;
  overflow: hidden;
  box-shadow: 0 28px 48px rgba(24,73,99,.14), 0 10px 18px rgba(24,73,99,.08) !important;
}
.hero-v17-sequence > .membership-benefits-intro {
  position: relative;
  z-index: 2;
  width: min(940px, calc(100% - 40px));
  padding: clamp(105px, 11vw, 155px) 0 clamp(45px, 5vw, 68px);
}
.mapped-benefit-story {
  padding-top: clamp(12px, 2vw, 28px) !important;
}
.mapped-benefit-story .how-story-wrap {
  margin-top: 0 !important;
}
.mapped-benefit-story .how-steps-column {
  padding-top: clamp(18px, 3vw, 42px);
}
body.theme-dark .hero-v17-sequence > .membership-benefits-intro,
body.theme-dark .hero-v17-sequence > .membership-benefits-intro h2,
body.theme-dark .hero-v17-sequence > .membership-benefits-intro p {
  color: #fff;
}
body.theme-dark .hero-v17-sequence > .membership-benefits-intro p:not(.membership-benefits-lead) {
  color: #e2ebef;
}
@media (max-width: 767.98px) {
  .hero-v17-sequence > .membership-benefits-intro {
    width: calc(100% - 36px);
    padding: 92px 0 36px;
  }
  .mapped-benefit-story { padding-top: 10px !important; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-v18 .cloud-hero-visual .hero-v18-ring { animation: none !important; }
}

/* Unified membership-to-benefits introduction */
.hero-v17-sequence .membership-benefits-intro {
  max-width: 900px;
  margin: 0 auto;
  /* Keep the interactive composer visually separate from the introduction. */
  padding: clamp(105px, 9vw, 145px) 0 0;
  text-align: center;
}
.hero-v17-sequence .membership-benefits-intro .hero-membership-bridge {
  display: block;
  margin: 0 auto !important;
  text-align: center;
}
.hero-v17-sequence .membership-benefits-intro .hero-membership-bridge h2 {
  margin: 0 auto 24px !important;
  max-width: 900px;
  text-align: center;
  /* Match the established assistant checklist section heading. */
  font-size: clamp(2.35rem, 4.1vw, 4.5rem) !important;
  font-weight: 900;
  line-height: 1.02;
  letter-spacing: -0.035em;
}
.hero-v17-sequence .membership-benefits-intro .intro-compact-copy {
  max-width: 760px;
  margin: 0 auto;
  text-align: center;
}
.hero-v17-sequence .membership-benefits-intro .intro-compact-copy p {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}
.hero-v17-sequence .membership-benefits-intro .intro-compact-copy p strong {
  font-weight: 800;
  color: #172b33;
}
body.theme-dark .hero-v17-sequence .membership-benefits-intro .intro-compact-copy p strong {
  color: #fff;
}
.hero-v17-sequence .membership-benefits-intro .intro-compact-copy .membership-benefits-lead {
  margin-top: 16px;
}
.hero-v17-sequence .membership-benefits-intro .intro-compact-copy .demo-btn {
  margin: 18px auto 0;
}
@media (max-width: 991.98px) {
  .hero-v17-sequence .membership-benefits-intro .hero-membership-bridge h2 {
    font-size: clamp(2.1rem, 4.3vw, 3.1rem) !important;
  }
}
@media (max-width: 767.98px) {
  .hero-v17-sequence .membership-benefits-intro {
    padding-top: 88px;
    margin-bottom: 0;
  }
}
@media (max-width: 700px) {
  .hero-v17-sequence .membership-benefits-intro .hero-membership-bridge h2 {
    font-size: clamp(2rem, 7.6vw, 2.7rem) !important;
    margin-bottom: 15px !important;
  }
}
@media (max-width: 380px) {
  .hero-v17-sequence .membership-benefits-intro .hero-membership-bridge h2 {
    font-size: 1.95rem !important;
  }
}


/* Consumer FAQ: two balanced columns with a blue expanded state. */
.faq-refined .mapped-faq-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: clamp(12px, 1.6vw, 22px);
  width: 100%;
}
.faq-refined .faq-column {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.faq-refined .faq-column .mapped-faq-item {
  margin: 0;
  border: 1px solid #dde8ee;
  border-radius: 18px;
  background: #fff;
  overflow: hidden;
  box-shadow: 0 3px 13px rgba(16, 55, 77, .025);
  transition: border-color .28s ease, box-shadow .28s ease, background-color .28s ease;
}
.faq-refined .faq-column .mapped-faq-item summary {
  padding: 20px 22px;
  color: #3c5360;
  font-size: clamp(1.02rem, 1.2vw, 1.16rem);
  font-weight: 600;
  line-height: 1.42;
  transition: color .25s ease, background-color .25s ease;
}
.faq-refined .faq-column .mapped-faq-item summary:hover {
  color: #007fbd;
  background: #f1faff;
}
.faq-refined .faq-column .mapped-faq-item summary i {
  flex: 0 0 auto;
  color: #009ce8;
  font-size: .95rem;
}
.faq-refined .faq-column .mapped-faq-item[open] {
  background: linear-gradient(135deg, #00AEEF 0%, #00B0AA 100%);
  border-color: #00AEEF;
  box-shadow: 0 13px 28px rgba(0, 133, 208, .20);
}
.faq-refined .faq-column .mapped-faq-item[open] summary,
.faq-refined .faq-column .mapped-faq-item[open] summary:hover {
  background: transparent;
  color: #fff;
}
.faq-refined .faq-column .mapped-faq-item[open] summary i { color: #fff; }
.faq-refined .faq-column .mapped-faq-item .mapped-faq-answer {
  padding: 0 22px 21px;
  max-width: none;
  color: #455e6b;
  background: transparent;
}
.faq-refined .faq-column .mapped-faq-item[open] .mapped-faq-answer,
.faq-refined .faq-column .mapped-faq-item[open] .mapped-faq-answer p {
  color: #fff !important;
  background: transparent;
}
.faq-refined .faq-column .mapped-faq-item .mapped-faq-answer p:first-child { padding-top: 17px; }
.faq-refined .faq-column .mapped-faq-item .mapped-faq-answer p:last-child { margin-bottom: 0; }
body.theme-dark .faq-refined .faq-column .mapped-faq-item {
  background: #2b2b2b;
  border-color: #454a4e;
}
body.theme-dark .faq-refined .faq-column .mapped-faq-item summary { color: #ecf4f8; }
body.theme-dark .faq-refined .faq-column .mapped-faq-item summary:hover { background: #333f46; }
body.theme-dark .faq-refined .faq-column .mapped-faq-item[open] {
  background: linear-gradient(135deg, #00AEEF 0%, #00B0AA 100%);
  border-color: #00AEEF;
}
body.theme-dark .faq-refined .faq-column .mapped-faq-item[open] summary,
body.theme-dark .faq-refined .faq-column .mapped-faq-item[open] summary:hover {
  background: transparent;
  color: #fff;
}
body.theme-dark .faq-refined .faq-column .mapped-faq-item .mapped-faq-answer {
  background: transparent;
  color: #e2ecf2;
}
body.theme-dark .faq-refined .faq-column .mapped-faq-item .mapped-faq-answer p { color: #e2ecf2; }
body.theme-dark .faq-refined .faq-column .mapped-faq-item[open] .mapped-faq-answer,
body.theme-dark .faq-refined .faq-column .mapped-faq-item[open] .mapped-faq-answer p { color: #fff !important; }
@media (max-width: 767.98px) {
  .faq-refined .mapped-faq-list { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .faq-refined .faq-column { gap: 12px; }
  .faq-refined .faq-column .mapped-faq-item summary { padding: 18px 19px; }
  .faq-refined .faq-column .mapped-faq-item .mapped-faq-answer { padding: 0 19px 19px; }
}
@media (prefers-reduced-motion: reduce) {

.faq-refined .faq-column .mapped-faq-item,
.faq-refined .faq-column .mapped-faq-item summary,
.works-refined .works-step { transition: none; }
}





/* Jude Difference — a permanent note on the paper, not a checklist task. */
.assistant-paper-note {
  margin-top: clamp(20px, 2.5vw, 32px);
  padding-top: clamp(19px, 2.2vw, 28px);
  border-top: 1px solid rgba(30,62,82,.18);
  color: #273640;
}
.assistant-paper-note h3 {
  margin: 0 0 12px;
  color: #E87722;
  font-size: clamp(1.08rem, 1.45vw, 1.3rem);
  line-height: 1.25;
  font-weight: 800;
  letter-spacing: -.02em;
}
.assistant-paper-note p {
  margin: 0 0 11px;
  font-size: clamp(.95rem, 1.12vw, 1.08rem);
  line-height: 1.55;
  font-weight: 400;
  color: #34444c;
}
.assistant-paper-note .assistant-paper-note-outcome {
  margin: 0;
  font-weight: 750;
  color: #1f2b32;
}
@media (max-width:700px) {
  .assistant-paper-note { margin-top: 18px; padding-top: 17px; }
  .assistant-paper-note h3 { font-size: 1.1rem; margin-bottom: 9px; }
  .assistant-paper-note p { font-size: .95rem; line-height: 1.48; }
}


/* Compact benefit cards: mobile imagery and visible supporting rules. */
@media (max-width: 975px) {
  #benefits .how-steps-column { gap: 22px; padding: 12px 0 28px; }
  #benefits .how-squiggle-layer { display: none; }
  #benefits .how-step,
  #benefits .how-step.left,
  #benefits .how-step.right {
    display: flex; flex-direction: column; align-items: stretch;
    width: 100%; max-width: 540px; margin: 0 auto; gap: 0;
    opacity: 1; transform: none; overflow: hidden; border-radius: 24px;
    background: #fff; border: 1px solid #dcebf0;
    box-shadow: 0 8px 24px rgba(24,73,99,.05);
  }
  #benefits .how-step .how-step-phone {
    display: flex; order: -1; flex: none; justify-content: center;
    align-items: flex-start; width: 100%; height: 210px;
    overflow: hidden !important;
    background: linear-gradient(135deg,#e6f7ff,#e5faef) !important;
  }
  #benefits .how-step .how-step-phone img:not(.phone-accent) {
    display: block; width: 285px; max-width: none; height: auto;
    flex: none; margin: 8px 0 0; transform: none;
  }
  #benefits .how-step .how-step-phone .phone-accent { display: none; }
  #benefits .how-step-text-card {
    width: 100%; max-width: none; margin: 0; padding: 22px;
    background: transparent; border: 0; border-radius: 0; box-shadow: none;
  }
  #benefits .how-step-text-card h3 {
    padding: 0; margin: 0 0 10px; max-width: none;
    font-size: clamp(1.55rem,6vw,1.9rem); line-height: 1.12;
  }
  #benefits .how-step-text-card p { font-size: 1rem; line-height: 1.45; margin-bottom: 10px; }
  #benefits .how-step-text-card .mapped-benefit-value { font-size: 1.12rem; line-height: 1.3; }
  #benefits .how-step-text-card .mapped-benefit-rule { font-size: .92rem; margin-top: 12px; }
  #benefits .how-step-text-card .demo-btn {
    margin-top: 12px; max-width: 100%; white-space: normal;
    text-align: center; justify-content: center; line-height: 1.25;
  }
  body.theme-dark #benefits .how-step { background: #172d38; border-color: #304b58; }
  body.theme-dark #benefits .how-step-phone {
    background: linear-gradient(135deg,#163f53,#234b42) !important;
  }
}
@media (max-width: 380px) {
  #benefits .how-step .how-step-phone { height: 185px; }
  #benefits .how-step .how-step-phone img:not(.phone-accent) { width: 260px; }
  #benefits .how-step-text-card { padding: 20px; }
}

/* Fade only the outer arm strip; the entire phone stays in the opaque region.
   Masks are on each transparent image, not on the image panel or its background. */
@media (max-width: 975px) {
  #benefits .how-step:nth-child(odd) .how-step-phone img:not(.phone-accent) {
    -webkit-mask-image: linear-gradient(to right, #000 0%, #000 80%, transparent 100%);
    mask-image: linear-gradient(to right, #000 0%, #000 80%, transparent 100%);
  }
  #benefits .how-step:nth-child(even) .how-step-phone img:not(.phone-accent) {
    -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 18%, #000 100%);
    mask-image: linear-gradient(to right, transparent 0%, #000 18%, #000 100%);
  }
}

/* Personal / Business switch, grouped with the logo at the left of the nav. */
.site-navbar .audience-switch {
  flex: 0 0 auto; margin-left: 12px; color: #273640;
  font-size: 12px; line-height: 1.25; text-decoration: none; white-space: nowrap; font-weight: 400;
}
.site-navbar .audience-switch span {
  display: inline; font-weight: 400; text-decoration: underline;
  text-underline-offset: 3px;
}
.site-navbar .audience-switch:hover { color: #007fab; }
.site-navbar .audience-switch:focus-visible { outline: 2px solid #00aeef; outline-offset: 4px; border-radius: 2px; }
body.theme-dark .site-navbar .audience-switch { color: #fff; }
@media (min-width: 992px) {
  .site-navbar .navbar-collapse { grid-template-columns: minmax(0,1fr) auto; margin-left: 14px; }
  .site-navbar .nav-links { grid-column: 1; justify-content: center; }
  .site-navbar .nav-cta-wrap { grid-column: 2; margin-left: 12px; }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
  .site-navbar .nav-links { gap: 0; }
  .site-navbar .nav-links .nav-link { padding-left: 6px; padding-right: 6px; font-size: 13px; }
  .site-navbar .nav-demo-btn { padding-left: 14px; padding-right: 14px; font-size: 13px; }
  .site-navbar .nav-toggle-wrap { margin-left: 8px; }
}
@media (max-width: 380px) {
  .site-navbar .audience-switch { margin-left: 8px; font-size: 11px; }
  .site-navbar .nav-toggle-wrap { margin-left: 8px; }
}

/* Keep the phone and most of the hand opaque.
   A feathered elliptical fade ends the wrist before its rectangular image boundaries. */
.hero-v18 .cloud-hero-visual .hero-v18-phone {
  -webkit-mask-image: radial-gradient(ellipse 90% 80% at 40% 25%, #000 0%, #000 70%, rgba(0,0,0,.98) 74%, rgba(0,0,0,.9) 78%, rgba(0,0,0,.7) 83%, rgba(0,0,0,.42) 88%, rgba(0,0,0,.17) 93%, rgba(0,0,0,.03) 97%, transparent 100%) !important;
  mask-image: radial-gradient(ellipse 90% 80% at 40% 25%, #000 0%, #000 70%, rgba(0,0,0,.98) 74%, rgba(0,0,0,.9) 78%, rgba(0,0,0,.7) 83%, rgba(0,0,0,.42) 88%, rgba(0,0,0,.17) 93%, rgba(0,0,0,.03) 97%, transparent 100%) !important;
}

/* The PNG itself contains a broad alpha fade. Raise only source alpha;
   opaque phone pixels and fully transparent background pixels stay unchanged. */
.hero-v18 .cloud-hero-visual .hero-v18-phone {
  filter: url(#heroWristOpacity) drop-shadow(0 19px 26px rgba(20,75,100,.13)) !important;
}

/* The note remains on white paper in dark mode: preserve dark, readable ink. */
body.theme-dark .assistant-paper .assistant-paper-note {
  color: #34444c !important;
  opacity: 1;
}
body.theme-dark .assistant-paper .assistant-paper-note p {
  color: #34444c !important;
  opacity: 1;
}
body.theme-dark .assistant-paper .assistant-paper-note .assistant-paper-note-outcome {
  color: #1f2b32 !important;
  font-weight: 750;
}
body.theme-dark .assistant-paper .assistant-paper-note h3 {
  color: #E87722 !important;
}