/* One connected visual language from the first idea to the conversation. */
main {
  position: relative;
}
.journey-chapter {
  position: relative;
  isolation: isolate;
  overflow: clip;
}
.chapter-atmosphere {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  overflow: hidden;
}
.chapter-aura {
  position: absolute;
  inset: 0;
  opacity: 0.65;
  background: radial-gradient(
    ellipse 520px 400px at var(--chapter-glow-x, 75%) var(--chapter-glow-y, 50%),
    #8fb99618,
    transparent 75%
  );
}
.chapter-word {
  position: absolute;
  right: -1%;
  bottom: -0.14em;
  font: 600 clamp(100px, 16vw, 260px) / 1 var(--display);
  letter-spacing: -0.07em;
  white-space: nowrap;
  color: transparent;
  -webkit-text-stroke: 1px #4f7d5830;
  translate: var(--chapter-word-x, 0px) var(--chapter-word-y, 0px);
  transform: skewY(var(--chapter-skew, 0deg));
  user-select: none;
}
.diagnostic .chapter-word,
.ideas .chapter-word {
  -webkit-text-stroke-color: #8fb99624;
}
.contact .chapter-word {
  -webkit-text-stroke-color: #28563426;
}
.chapter-orbit {
  position: absolute;
  width: min(54vw, 740px);
  aspect-ratio: 1;
  border: 1px solid #4f7d5820;
  border-radius: 50%;
  right: -15%;
  top: -24%;
  transform: translateY(var(--orbit-y, 0px)) rotate(-32deg) scaleX(0.62);
}
.diagnostic .chapter-orbit,
.ideas .chapter-orbit {
  border-color: #8fb9961c;
}
.chapter-crossing {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 56px;
  overflow: visible;
  fill: none;
  stroke: #4f7d582a;
  stroke-width: 1;
}
.chapter-crossing .crossing-signal {
  stroke: #4f7d58;
  stroke-width: 1.5;
  stroke-dasharray: 100 1600;
  stroke-dashoffset: 1700;
}
.diagnostic .chapter-crossing .crossing-signal,
.ideas .chapter-crossing .crossing-signal {
  stroke: #8fb996;
}
.chapter-live .crossing-signal {
  animation: chapter-flow 10s linear infinite;
}
.journey-thread {
  position: absolute;
  right: 0.5%;
  top: 0;
  width: 48px;
  overflow: visible;
  z-index: 8;
  pointer-events: none;
}
.thread-track {
  fill: none;
  stroke: #4f7d583d;
  stroke-width: 1;
}
.thread-fill {
  fill: none;
  stroke: #6d9a77;
  stroke-width: 1.6;
}
.thread-node {
  fill: #8fb996;
  stroke: #4f7d58;
  stroke-width: 1;
  opacity: 0.28;
  transition: opacity 0.45s;
}
.thread-node.is-reached {
  opacity: 1;
}
.thread-halo {
  fill: #8fb99620;
}
.thread-head {
  fill: #8fb996;
  stroke: #285634;
  stroke-width: 1;
}
.chapter-title .title-word {
  display: inline-block;
  color: inherit !important;
}
h2.chapter-title > .title-word {
  font-size: inherit;
  font-weight: inherit;
  vertical-align: baseline;
}
.chapter-title.title-visible .title-word {
  animation: word-connect 0.85s var(--motion-ease) both;
  animation-delay: calc(var(--word-order, 0) * 28ms);
}
.header nav a[aria-current="location"]::after {
  transform: scaleX(1);
  transform-origin: left;
}
.header nav a[aria-current="location"] {
  color: #285634;
}
.luminous-surface {
  position: relative;
}
.luminous-surface::before {
  content: "";
  position: absolute;
  inset: -1px;
  padding: 1px;
  border-radius: inherit;
  background: radial-gradient(
    230px circle at var(--light-x, 50%) var(--light-y, 0%),
    #8fb996,
    #4f7d5820 80%
  );
  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  mask-composite: exclude;
  opacity: 0.2;
  transition: opacity 0.4s ease;
  pointer-events: none;
  z-index: 2;
}
.luminous-surface:hover::before,
.luminous-surface:focus-within::before {
  opacity: 1;
}
.quiz,
.guide {
  transition:
    box-shadow 0.5s ease,
    border-color 0.5s ease;
}
.quiz:focus-within {
  box-shadow: 0 0 70px #8fb9961f;
}
.quiz.quiz-complete {
  box-shadow:
    0 0 0 1px #8fb996,
    0 0 65px #8fb99625;
}
.service-tabs button {
  position: relative;
  transition:
    color 0.3s ease,
    background 0.3s ease;
}
.service-tabs button[aria-selected="true"] {
  background: linear-gradient(0deg, #8fb99618, transparent 85%);
}
.service-tabs button b {
  transition: transform 0.35s var(--motion-ease);
}
.service-tabs button[aria-selected="true"] b {
  transform: rotate(45deg);
}
.channel-map .map-center {
  transition: box-shadow 0.5s ease;
}
.chapter-live .channel-map .map-center {
  animation: map-breathe 6s ease-in-out infinite;
}
.chapter-live .map-spark,
.chapter-live .quiz-signature > span {
  animation: avora-spin 24s linear infinite;
}
.chapter-live .map-lines {
  animation: signal-pass 4.5s ease-in-out infinite;
}
.chapter-live .bottom-lines {
  animation-delay: -2.25s;
}
.chapter-live .flow-visual strong {
  animation: flow-breathe 6s ease-in-out infinite;
}
.chapter-live .flow-visual strong:nth-of-type(2) {
  animation-delay: -4s;
}
.chapter-live .flow-visual strong:nth-of-type(3) {
  animation-delay: -2s;
}
.chapter-live .crm-stage i {
  animation: flow-breathe 6s ease-in-out infinite;
}
.chapter-live .crm-stage:nth-of-type(3) i {
  animation-delay: -4s;
}
.chapter-live .crm-stage:nth-of-type(4) i {
  animation-delay: -2s;
}
.quiz-options button > span {
  transition:
    background 0.3s ease,
    color 0.3s ease,
    transform 0.3s ease;
}
.quiz-options button:hover > span,
.quiz-options button:focus-visible > span {
  background: #285634;
  color: #f5f5f0;
  transform: rotate(-8deg);
}
.steps article {
  position: relative;
  transition: border-color 0.5s ease;
}
.step-num {
  position: relative;
  display: grid;
  place-items: center;
  width: 82px;
  height: 82px;
  border: 1px solid #c4d6c8;
  border-radius: 50%;
  padding: 0;
  margin-bottom: 26px;
  font-size: 36px;
  letter-spacing: -2px;
  transition:
    color 0.5s ease,
    background 0.5s ease,
    box-shadow 0.5s ease;
}
.step-current .step-num,
.steps article:hover .step-num {
  background: #285634;
  color: #f5f5f0;
  border-color: #285634;
  box-shadow: 0 0 0 8px #8fb99620;
}
.step-current .step-output {
  border-color: #4f7d58;
  color: #285634;
}
.steps article:hover h3 {
  color: #285634;
}
.guide summary {
  position: relative;
}
.guide-meta > span:first-child {
  transition: color 0.4s ease;
}
.guide:hover .guide-meta > span:first-child {
  color: #ddebdf;
}
.guide-bottom b {
  transition:
    transform 0.4s var(--motion-ease),
    background 0.4s ease,
    color 0.4s ease;
}
.guide:hover .guide-bottom b,
.guide[open] .guide-bottom b {
  background: #8fb996;
  color: #07100d;
}
.guide[open] article {
  animation: reading-unfold 0.55s var(--motion-ease) both;
}
.faq-items details {
  position: relative;
  transition: background 0.3s ease;
}
.faq-items details[open] {
  background: #8fb9960d;
}
.faq-items summary {
  transition: color 0.3s ease;
}
.faq-items summary:hover {
  color: #4f7d58;
}
.faq-items summary span {
  transition: transform 0.35s var(--motion-ease);
}
.faq-items details[open] p {
  animation: reading-unfold 0.5s var(--motion-ease) both;
}
.contact form {
  position: relative;
  padding: 32px;
  border: 1px solid #28563445;
  border-radius: 12px;
  background: #f5f5f01a;
  transition:
    background 0.5s ease,
    box-shadow 0.5s ease;
}
.contact form:focus-within {
  background: #f5f5f02b;
  box-shadow: 0 16px 60px #28563415;
}
.contact label {
  position: relative;
}
.contact label::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  background: #173d24;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.45s var(--motion-ease);
  pointer-events: none;
}
.contact label:focus-within::after {
  transform: scaleX(1);
}
.contact h2 > span[aria-hidden="true"] {
  transition: transform 0.5s var(--motion-ease);
}
.contact:focus-within h2 > span[aria-hidden="true"] {
  transform: translate(7px, -7px);
}
.contact-direct > span {
  transition: transform 0.4s var(--motion-ease);
}
.contact-direct:hover > span {
  transform: translate(4px, -4px);
}
footer .brand-logo {
  transition: transform 0.6s var(--motion-ease);
}
footer .wordmark:hover .brand-logo {
  transform: translateY(-5px);
}
@keyframes word-connect {
  from {
    opacity: 0.35;
    transform: translateY(12px) rotate(1deg);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes chapter-flow {
  to {
    stroke-dashoffset: -1700;
  }
}
@keyframes map-breathe {
  0%,
  100% {
    box-shadow: 0 0 0 0 #4f7d5800;
  }
  50% {
    box-shadow:
      0 0 0 7px #4f7d5812,
      0 10px 30px #4f7d5810;
  }
}
@keyframes signal-pass {
  0%,
  100% {
    opacity: 0.5;
    translate: 0 -2px;
  }
  50% {
    opacity: 1;
    translate: 0 2px;
  }
}
@keyframes flow-breathe {
  0%,
  100% {
    color: #07100d;
  }
  50% {
    color: #4f7d58;
  }
}
@keyframes reading-unfold {
  from {
    opacity: 0.25;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
[data-motion-level="gentle"] .chapter-title.title-visible .title-word {
  animation-name: intro-fade;
}
[data-motion-level="gentle"] .chapter-live .crossing-signal {
  animation-duration: 18s;
}
@media (max-width: 1000px) {
  .journey-thread {
    right: 0;
    width: 35px;
  }
}
@media (max-width: 760px) {
  .journey-thread {
    width: 18px;
    right: 0;
    opacity: 0.7;
  }
  .chapter-word {
    font-size: 21vw;
    right: -2%;
    bottom: -0.08em;
  }
  .chapter-orbit {
    width: 90vw;
    right: -35%;
    top: 2%;
  }
  .chapter-crossing {
    height: 35px;
  }
  .contact form {
    padding: 22px;
  }
  .step-num {
    width: 64px;
    height: 64px;
    font-size: 29px;
    margin-bottom: 22px;
  }
}
@media (max-width: 480px) {
  .contact .form-grid {
    grid-template-columns: 1fr;
    gap: 0;
  }
}
