/* Thync & Thryve scroll-led story — uses existing Montserrat/Inter, forest green,
   soft green, white and rounded cards. Product landing remains unchanged. */
.company-motion-story{
  position:relative;
  background:#FFFFFF;
  color:#0A4639;
  overflow:clip;
}
.company-motion-sticky{
  position:relative;
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:44px 24px 36px;
}
.company-motion-shell{width:min(1180px,100%);margin:0 auto}
.company-motion-header{text-align:center;max-width:820px;margin:0 auto 30px}
.company-motion-header .company-section-title{margin:0 auto;max-width:800px}
.company-motion-lead{
  max-width:690px;margin:14px auto 0;color:#35594F;
  font:400 16px/1.6 Inter,system-ui,sans-serif;
}
.company-motion-layout{
  display:grid;grid-template-columns:minmax(280px,.82fr) minmax(400px,1.18fr);
  gap:46px;align-items:center;min-width:0;
}
.company-motion-narrative{min-width:0}
.company-motion-chapters{
  border-left:2px solid #CDE6DE;
  display:grid;gap:0;margin-left:12px;
}
.company-motion-chapter{
  display:grid;grid-template-columns:48px minmax(0,1fr);gap:9px;
  align-items:start;padding:12px 0 13px 24px;
  border-left:3px solid transparent;margin-left:-3px;
  transition:border-color .22s ease,background .22s ease;
}
.company-motion-chapter.is-active{border-left-color:#0B7D6B;background:linear-gradient(90deg,#EEF7F4,transparent 74%)}
.company-motion-count{font:800 15px Montserrat,system-ui,sans-serif;color:#0B7D6B;padding-top:4px}
.company-motion-chapter h3{margin:0 0 4px;font:700 20px/1.2 Montserrat,system-ui,sans-serif}
.company-motion-chapter p{margin:0;max-width:350px;font:400 14px/1.55 Inter,system-ui,sans-serif;color:#35594F}
.company-motion-counter{
  padding:22px 0 0 37px;
  color:#35594F;font:600 15px Montserrat,system-ui,sans-serif;
}
.company-motion-current{color:#0A4639;font:800 23px Montserrat,system-ui,sans-serif}
.company-motion-track{width:min(310px,100%);height:4px;margin-top:11px;border-radius:10px;background:#CDE6DE;overflow:hidden}
.company-motion-track span{display:block;width:100%;height:100%;background:#0B7D6B;transform:scaleX(var(--story-progress,1));transform-origin:left center}
.company-motion-board{
  position:relative;width:100%;max-width:580px;aspect-ratio:560/440;
  border-radius:28px;border:1px solid #CDE6DE;
  background:radial-gradient(circle at 55% 47%,#EEF7F4 0%,#FFFFFF 72%);
  overflow:hidden;margin:auto;isolation:isolate;
}
.company-motion-board-label{
  position:absolute;top:14px;left:18px;z-index:3;
  font:700 10px Montserrat,system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;
  color:#35594F;
}
.company-motion-board-caption{
  position:absolute;bottom:10px;left:12px;right:12px;z-index:3;
  text-align:center;color:#35594F;font:500 10px/1.45 Inter,system-ui,sans-serif;
}
.company-motion-route{
  width:100%;height:100%;position:absolute;inset:0;
  overflow:visible;pointer-events:none;z-index:0;
}
.company-motion-route path{fill:none;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round}
.company-motion-route-base{stroke:#CDE6DE;stroke-dasharray:7 12}
.company-motion-route-drawn{stroke:#0B7D6B}
.company-motion-traveler{fill:#5DD6BE;stroke:#0A4639;stroke-width:2}
.company-motion-object{
  position:absolute;z-index:2;min-width:0;
  width:39%;height:32%;padding:14px 17px;
  border:1px solid #CDE6DE;
  border-radius:20px;background:#FFFFFF;
  display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;
  box-shadow:0 14px 35px rgba(10,70,57,.10);
}
.company-motion-object-0{left:6%;top:9%;--from-x:-130px;--from-y:-75px;--from-rotate:-15deg}
.company-motion-object-1{left:56%;top:9%;--from-x:150px;--from-y:-90px;--from-rotate:13deg}
.company-motion-object-2{left:56%;top:58%;--from-x:140px;--from-y:110px;--from-rotate:13deg}
.company-motion-object-3{left:6%;top:58%;--from-x:-130px;--from-y:115px;--from-rotate:-12deg}
.company-motion-object-kicker{
  font:700 10px Montserrat,system-ui,sans-serif;
  text-transform:uppercase;letter-spacing:.07em;color:#0B7D6B;
}
.company-motion-object svg{width:36px;height:36px;color:#0B7D6B;flex-shrink:1}
.company-motion-object img{height:30px;max-width:125px;object-fit:contain;object-position:left}
.company-motion-object strong{font:700 16px/1.1 Montserrat,system-ui,sans-serif;color:#0A4639}
.company-motion-object small{color:#35594F;font:400 11px/1.35 Inter,system-ui,sans-serif}
.company-motion-scroll-hint{
  margin:14px 0 0;text-align:center;color:#35594F;
  font:600 12px Montserrat,system-ui,sans-serif;letter-spacing:.06em;
}

/* Javascript only adds motion when the preference allows it.
   In its absence the full connected diagram stays visible. */
@media(prefers-reduced-motion:no-preference){
  .company-motion-enabled .company-motion-story{height:365vh}
  .company-motion-enabled .company-motion-sticky{
    position:sticky;top:0;height:100vh;min-height:0;
  }
  .company-motion-enabled .company-motion-object{
    transform:
      translate3d(
        calc((1 - var(--arrival,1))*var(--from-x)),
        calc((1 - var(--arrival,1))*var(--from-y)),0)
      rotate(calc((1 - var(--arrival,1))*var(--from-rotate)))
      scale(calc(.83 + var(--arrival,1)*.17));
    opacity:calc(.22 + var(--arrival,1)*.78);
    will-change:transform,opacity;
  }
  .company-motion-enabled #top .company-hero-tiles > a{
    transform:translate3d(0,var(--hero-lift,0px),0) rotate(var(--hero-tilt,0deg));
    will-change:transform;
  }
  .company-motion-enabled .company-step,
  .company-motion-enabled #services > div[id],
  .company-motion-enabled .company-standard,
  .company-motion-enabled .company-delivery-card{
    opacity:calc(.48 + var(--scene-reveal,1)*.52);
    transform:translate3d(0,calc((1 - var(--scene-reveal,1))*42px),0);
  }
  .company-motion-enabled .company-standard[open]{
    transform:none;opacity:1;
  }
}

/* Compact screens show the entire connected illustration and every step.
   This also avoids a long sticky sequence blocking touch scrolling. */
@media(max-width:860px){
  .company-motion-sticky{padding:65px 20px 46px;min-height:auto}
  .company-motion-layout{grid-template-columns:1fr;gap:24px}
  .company-motion-chapters{grid-template-columns:repeat(2,minmax(0,1fr));border-left:0;gap:8px;margin:0}
  .company-motion-chapter{border:1px solid #CDE6DE;border-radius:15px;margin:0;padding:16px;grid-template-columns:1fr}
  .company-motion-chapter.is-active{border-color:#0B7D6B}
  .company-motion-counter{padding:16px 0 0}
  .company-motion-board{max-width:580px}
  .company-motion-scroll-hint{display:none}
  .company-motion-enabled .company-motion-story{height:auto}
  .company-motion-enabled .company-motion-sticky{position:relative;height:auto;min-height:auto}
  .company-motion-enabled .company-motion-object{transform:none;opacity:1;will-change:auto}
}
@media(max-width:520px){
  .company-motion-chapters{grid-template-columns:1fr}
  .company-motion-header{margin-bottom:26px}
  .company-motion-chapter{grid-template-columns:34px 1fr}
  .company-motion-chapter h3{font-size:17px}
  .company-motion-board{border-radius:20px;aspect-ratio:560/470}
  .company-motion-board-label{top:4px}
  .company-motion-object{padding:9px 9px 12px;border-radius:14px}
  .company-motion-object-kicker{font-size:8px}
  .company-motion-object svg{width:25px;height:25px}
  .company-motion-object img{height:20px;max-width:95px}
  .company-motion-object strong{font-size:12px}
  .company-motion-object small{font-size:9px}
  .company-motion-board-caption{font-size:8px}
  .company-motion-board-label{font-size:9px}
  .company-motion-sticky{padding-left:16px;padding-right:16px}
  .company-motion-enabled .company-step,
  .company-motion-enabled #services > div[id],
  .company-motion-enabled .company-standard,
  .company-motion-enabled .company-delivery-card{
    transform:translate3d(0,calc((1 - var(--scene-reveal,1))*22px),0);
  }
}
@media (prefers-reduced-motion:reduce){
  .company-motion-story{height:auto!important}
  .company-motion-sticky{height:auto!important;position:relative!important}
  .company-motion-object,.company-step,.company-standard,.company-delivery-card{opacity:1!important;transform:none!important;animation:none!important;transition:none!important}
  .company-motion-track span{transform:scaleX(1)}
}

/* Continue the scroll narrative into the company's existing Solutions and
   How we work cards. Their content, colors, prices and links stay unchanged. */
@media(prefers-reduced-motion:no-preference){
  .company-motion-enabled .company-solution-plans > a,
  .company-motion-enabled .company-work-steps > div{
    opacity:calc(.53 + var(--scene-reveal,1)*.47);
    transform:translate3d(
      calc((1 - var(--scene-reveal,1))*var(--start-x,-6px)),
      calc((1 - var(--scene-reveal,1))*8px),0)
      scale(calc(.98 + var(--scene-reveal,1)*.02));
  }
  .company-motion-enabled .company-solution-plans > a:nth-child(even),
  .company-motion-enabled .company-work-steps > div:nth-child(even){--start-x:6px}
  .company-motion-enabled .company-solution-plans > a:focus-visible{
    outline:3px solid #5DD6BE;outline-offset:3px;
  }
}
@media(max-width:860px) and (prefers-reduced-motion:no-preference){
  .company-motion-enabled .company-solution-plans > a,
  .company-motion-enabled .company-work-steps > div{
    transform:translate3d(0,calc((1 - var(--scene-reveal,1))*22px),0)
  }
}