/* CBRG motion system. Content stays usable without JavaScript. */
#content{overflow-x:clip}
.hero h1 .hero-line{display:block}
.hero h1 .hero-word,.hero h1 .hero-char{display:inline-block;white-space:normal}
.hero h1 span+span::before{content:none}
.hero-word{transform-origin:50% 90%}
.hero-char{transform-origin:50% 100%}
.hero h1{isolation:isolate}
/* Head-set guard prevents a visible title from disappearing when GSAP starts.
   JavaScript removes it immediately after setup; its own timeout is a fallback. */
@media(prefers-reduced-motion:no-preference){
  .cbrg-hero-pending .hero h1{opacity:0}
  .cbrg-hero-pending .hero .video-frame{opacity:.9;transform:translateY(6px) rotate(-2.4deg)}
}
.badge{opacity:1}
.warm-word{position:relative;display:inline-block;--warmth:0}
.warm-word::after{content:'';position:absolute;left:0;right:0;bottom:-.02em;height:.08em;border-radius:60% 30% 50% 40%;background:var(--yellow);transform:rotate(-2deg) scaleX(var(--warmth));transform-origin:0 50%}
.visitor-stage{width:min(600px,100%);height:100px;margin:24px auto -24px;pointer-events:none}
.visitor-stage svg{display:block;width:100%;height:100%;overflow:visible}
.visitor-lane{stroke:var(--cream);stroke-opacity:.12;stroke-width:1;stroke-dasharray:2 10}
.visitor-dots{fill:var(--cream)}
.request-envelope{stroke:var(--yellow);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;transform-origin:center;transform-box:fill-box}
.request-envelope rect{fill:var(--navy)}
.steps{position:relative;padding-top:40px;margin-top:32px}
.step{position:relative}
.work-route{position:absolute;left:7px;right:7px;top:12px;height:2px;background:rgb(249 252 244 / .13);pointer-events:none}
.route-progress{display:block;background:var(--yellow);height:100%;width:100%;transform-origin:0 50%}
.step-dot{position:absolute;width:14px;height:14px;left:0;top:-34px;background:var(--navy);border:2px solid var(--yellow);border-radius:50%}
.step:last-child h3{position:relative;display:inline-block;--underline:1}
.step:last-child h3::after{content:'';position:absolute;left:-2%;right:-2%;height:5px;bottom:-8px;background:var(--yellow);border-radius:60%;transform:rotate(-3deg) scaleX(var(--underline));transform-origin:left}
.concept-pictures{position:relative;perspective:none;transform-style:flat}
.concept-card{width:30%;max-width:270px;flex:0 1 30%;position:relative;transform-origin:50% 85%;box-shadow:0 16px 24px rgb(0 0 0 / .14);background:transparent;transform-style:flat;backface-visibility:visible}
.concept-card:nth-child(1){transform:rotate(-6deg)}
.concept-card:nth-child(2){transform:none;z-index:1}
.concept-card:nth-child(3){transform:rotate(6deg)}
.concept-pictures .concept-card img{display:block;width:100%;max-width:none;max-height:none;height:auto;filter:none;transform:none;backface-visibility:visible}
.benefit-cards{perspective:none}
.benefit-card{transform-origin:50% 90%}
.benefit-card:first-child{transform:rotate(-2deg)}
.benefit-card:nth-child(2){transform:rotate(3deg)}
.benefit-card ul{opacity:1}
.plans{perspective:none}
.plan{transform-origin:50% 85%}
.plan:nth-child(2){transform:rotate(-2deg)}
.gsap-motion .plan,.gsap-motion .benefit-card,.gsap-motion .shaker{backface-visibility:hidden}
.project-stack{touch-action:pan-y;outline-offset:18px}
.project-card img{user-select:none;-webkit-user-drag:none}
.gsap-motion .project-card{transition:none}
.project-card{transform-origin:50% 85%;transform:translateX(calc(var(--offset)*8px)) rotate(calc(var(--offset)*2deg)) scale(calc(1 - var(--distance)*.02))}
.shaker{transform-origin:50% 75%}
.contact .cta-group{transform-origin:0 50%}
.success-message{position:relative;width:fit-content;margin:0 auto 32px;text-align:center;font-size:28px;line-height:1.25;font-weight:900;opacity:1;--success-line:1}
.success-message::after{content:'';position:absolute;bottom:-12px;left:0;right:0;height:5px;background:var(--yellow);border-radius:70% 40%;transform:rotate(-2deg) scaleX(var(--success-line));transform-origin:left}
dialog::backdrop{opacity:var(--backdrop-opacity,1)}
@media(max-width:767px){
  .hero h1 .hero-line{display:inline}
  .hero h1 .hero-line+.hero-line::before{content:' '}
  .visitor-stage{height:72px;margin:16px auto -16px}
  .steps{padding-top:0;padding-left:32px;margin-top:40px}
  .work-route{left:6px;top:7px;bottom:0;right:auto;width:2px;height:auto}
  .route-progress{transform-origin:50% 0}
  .step-dot{left:-32px;top:5px}
  .success-message{font-size:26px}
  .concept-card{width:30%;flex-basis:30%;box-shadow:none;filter:none;perspective:none;transform-style:flat;backface-visibility:visible}
  .concept-card:nth-child(1){transform:rotate(-4deg)}
  .concept-card:nth-child(3){transform:rotate(4deg)}
  .project-card{transform:translateX(calc(var(--offset)*4px)) rotate(calc(var(--offset)*1.5deg)) scale(calc(1 - var(--distance)*.02))}
}
html.lenis,html.lenis body{scroll-behavior:auto!important}
@media(prefers-reduced-motion:reduce){
  .visitor-dots,.request-ray{display:none}
  .warm-word{--warmth:1}
}
