/* Motion stays optional: content is visible before the module starts. */
:root{--scene-ease:cubic-bezier(.16,1,.3,1)}
.header{transition:box-shadow .35s ease,background-color .35s ease}
.header.is-scrolled{background:#ffffffed;backdrop-filter:blur(16px);box-shadow:0 6px 28px #0825400c}
.header::before{content:'';position:absolute;top:0;left:0;width:100%;height:2px;background:linear-gradient(90deg,#26679e,#9cbfda);transform:scaleX(var(--page-progress,0));transform-origin:left;pointer-events:none}
.hero{position:relative;isolation:isolate;overflow:hidden}
.hero-grid{position:relative;z-index:1}
.scene-light{position:absolute;z-index:0;pointer-events:none;width:650px;height:650px;right:-170px;top:-250px;border-radius:50%;background:radial-gradient(ellipse,#487ba82b 0%,#29608d12 42%,transparent 68%)}
.scene-light-secondary{width:520px;height:520px;left:-270px;right:auto;top:auto;bottom:-290px;background:radial-gradient(ellipse,#77a8ce21,transparent 68%)}
.motion-word{display:inline-block;vertical-align:top;overflow:hidden;padding-bottom:.12em;margin-bottom:-.12em}
.motion-word>span{display:inline-block}
.links>a:not(.btn){position:relative}
.links>a:not(.btn)::after{content:'';position:absolute;left:0;right:0;bottom:-6px;height:1px;background:var(--accent);transform:scaleX(0);transform-origin:right;transition:transform .4s var(--scene-ease)}
.links>a:not(.btn):hover{text-decoration:none}
.links>a:not(.btn):hover::after,.links>a:not(.btn):focus-visible::after{transform:scaleX(1);transform-origin:left}
.form-card{box-shadow:0 24px 65px #06192a25}
.btn,.wa{position:relative;overflow:hidden;isolation:isolate}
.btn::after{content:'';position:absolute;inset:-80% -50%;pointer-events:none;background:linear-gradient(110deg,transparent 38%,#ffffff1f 48%,#ffffff2b 50%,transparent 62%);transform:translateX(-110%)}
.benefit,.step{position:relative}
.benefit::after,.step::after{content:'';position:absolute;left:0;top:-1px;width:100%;height:2px;background:linear-gradient(90deg,var(--accent),#8eb5d2);transform-origin:left;transform:scaleX(0)}
.portrait-panel,.sold-feature,.landscape-gallery figure{position:relative}
.sold-feature{box-shadow:0 18px 55px #0a29440d}
.sold-feature::after{content:'';position:absolute;inset:-30% -60%;background:linear-gradient(115deg,transparent 42%,#ffffff28 49%,#ffffff42 50%,transparent 57%);transform:translateX(-100%);pointer-events:none}
@media screen and (prefers-reduced-motion:no-preference){
  @keyframes scene-arrive{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:translateY(0)}}
  @keyframes word-arrive{from{transform:translateY(112%) rotate(3deg)}to{transform:translateY(0) rotate(0)}}
  @keyframes light-drift{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(-55px,40px,0) scale(1.13)}}
  @keyframes glass-sweep{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
  @keyframes icon-trace{from{stroke-dashoffset:150}to{stroke-dashoffset:0}}
  .motion-on .scene-light{animation:light-drift 12s ease-in-out 2;translate:var(--light-x,0px) var(--light-y,0px);transition:translate 1.6s ease-out}
  .motion-on .scene-light-secondary{animation-delay:-6s;animation-duration:16s}
  .motion-on .hero-copy h1 .motion-word>span{animation:word-arrive .95s var(--word-delay,0ms) var(--scene-ease) both}
  .motion-on .hero-copy .territory{animation:scene-arrive .8s .05s var(--scene-ease) both}
  .motion-on .hero-copy .intro{animation:scene-arrive 1s .3s var(--scene-ease) both}
  .motion-on .hero-copy>.btn{animation:scene-arrive 1s .4s var(--scene-ease) backwards}
  .motion-on .hero-signature{animation:scene-arrive 1.1s .48s var(--scene-ease) both}
  .motion-on .form-card{animation:scene-arrive 1.2s .22s var(--scene-ease) backwards}
  .btn,.wa{transition:translate .32s var(--scene-ease),transform .4s var(--scene-ease),box-shadow .4s ease,background-color .3s ease,border-color .3s ease;translate:var(--magnet-x,0px) var(--magnet-y,0px)}
  .btn:hover:not(:disabled){transform:translateY(-3px);box-shadow:0 12px 28px #071f3533}
  .btn:hover:not(:disabled)::after,.btn:focus-visible::after{animation:glass-sweep .85s ease-out}
  .wa:hover{transform:translateY(-2px)}
  .btn:active:not(:disabled),.wa:active{transform:translateY(0);box-shadow:none}
  .motion-on .scene-reveal{opacity:0;transform:translate3d(0,34px,0);transition:opacity .9s ease,transform 1.1s var(--scene-ease);transition-delay:var(--scene-delay,0ms)}
  .motion-on .scene-reveal.is-visible{opacity:1;transform:translate3d(0,0,0)}
  .motion-on .portrait-panel.scene-reveal,.motion-on .landscape-gallery figure.scene-reveal{clip-path:inset(12% 0 0 0 round 6px);transition:clip-path 1.35s var(--scene-ease),opacity 1s ease,transform 1.35s var(--scene-ease);transition-delay:var(--scene-delay,0ms)}
  .motion-on .portrait-panel.is-visible,.motion-on .landscape-gallery figure.is-visible{clip-path:inset(0 round 6px)}
  .motion-on .sold-feature.scene-reveal{transform:perspective(1100px) translateY(48px) rotateX(4deg);transition:opacity 1s ease,transform 1.3s var(--scene-ease),box-shadow .5s ease}
  .motion-on .sold-feature.is-visible{transform:perspective(1100px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg))}
  .motion-on .sold-feature.is-interacting{transition:transform .2s ease-out,box-shadow .4s ease;box-shadow:0 25px 65px #0a294425}
  .motion-on .sold-feature.is-visible::after{animation:glass-sweep 1.4s .5s ease-out both}
  .motion-on .benefit.is-visible::after,.motion-on .step.is-visible::after{transform:scaleX(1);transition:transform 1.1s .12s var(--scene-ease)}
  .motion-on .benefit.is-visible .icon path,.motion-on .benefit.is-visible .icon rect,.motion-on .benefit.is-visible .icon circle{stroke-dasharray:150;animation:icon-trace 1.5s .15s var(--scene-ease) both}
  .motion-on .landscape-gallery img{transform:scale(1.1) translateY(var(--landscape-y,0px));transition:transform .6s ease-out}
  .portrait-panel img{transition:transform 1s var(--scene-ease)}
  .portrait-panel:hover img{transform:scale(1.025)}
  .motion-on .section-head h2,.motion-on .about-body h2,.motion-on .sold-intro h2{transition:letter-spacing 1.2s var(--scene-ease)}
  .motion-on .scene-reveal:not(.is-visible) h2{letter-spacing:-.045em}
}
@media screen and (max-width:780px){
  .scene-light{width:420px;height:420px;right:-220px;top:-140px}
  .scene-light-secondary{left:-280px;bottom:-190px}
  .motion-on .scene-reveal{transition-delay:0ms;transform:translateY(22px)}
  .motion-on .sold-feature.scene-reveal{transform:translateY(28px)}
  .motion-on .sold-feature.is-visible{transform:none}
}
@media screen and (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .scene-light{animation:none!important;translate:none!important}
  .motion-word>span{animation:none!important;transform:none!important}
  .scene-reveal{opacity:1!important;transform:none!important;clip-path:none!important;transition:none!important}
  .btn,.wa,.header,.links>a::after,.portrait-panel img,.landscape-gallery img{transition:none!important;transform:none!important;translate:none!important}
  .btn::after,.sold-feature::after{display:none}
  .benefit::after,.step::after{transition:none!important;transform:none}
}
@media print{.scene-light,.header::before,.btn::after,.sold-feature::after{display:none}.scene-reveal{opacity:1!important;transform:none!important;clip-path:none!important}}
