/* Motion is an enhancement: the page remains readable without this module. */
.interaction-field {
  position:fixed;
  inset:0;
  width:100%;
  height:100%;
  z-index:15;
  pointer-events:none;
  opacity:.85;
}
.dialog-open .interaction-field,.menu-open .interaction-field { opacity:0; }
.hero-visual { translate:0 var(--scroll-shift,0px); }
.hero h1>span {
  background:linear-gradient(110deg,#a6b79a 20%,#e6f5da 42%,#a6b79a 60%);
  background-size:240% 100%;
  background-clip:text;
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  animation:title-light 12s ease-in-out infinite;
  animation-play-state:paused;
}
.hero.in-view h1>span { animation-play-state:running; }
.product.is-revealed {
  transform:perspective(1100px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));
  transition:transform .45s cubic-bezier(.2,.7,.3,1),border-color .35s,box-shadow .4s,opacity .8s;
}
.product.is-revealed.pointer-active { transition-duration:.18s,.35s,.4s,.8s; }
.product.pointer-active { box-shadow:0 22px 65px #18231017; }
.product.pointer-active .product-art>svg {
  transform:translate(var(--art-x,0px),var(--art-y,0px)) scale(1.04);
  transition:transform .25s ease-out;
}
.product.pointer-active::after {
  background:radial-gradient(350px circle at var(--pointer-x,50%) var(--pointer-y,50%),#c8dfb835,transparent 75%);
}
.button { translate:var(--magnet-x,0px) var(--magnet-y,0px); }
.button { transition:translate .25s cubic-bezier(.2,.8,.3,1),background .25s,color .25s,box-shadow .35s,transform .35s; }
.solutions { position:relative; isolation:isolate; }
.solutions::before,.approach::before,.contact::before {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:-1;
  opacity:0;
  transition:opacity .6s;
  background:radial-gradient(430px circle at var(--pointer-x,50%) var(--pointer-y,50%),#829b6312,transparent);
}
.approach::before { background:radial-gradient(500px circle at var(--pointer-x,50%) var(--pointer-y,50%),#b4d89714,transparent); }
.solutions.pointer-active::before,.approach.pointer-active::before,.contact.pointer-active::before { opacity:1; }
@keyframes title-light { 0%,100% { background-position:100% 50%; } 50% { background-position:0% 50%; } }
.reading-progress {
  position:fixed;
  inset:0 0 auto;
  height:2px;
  z-index:30;
  pointer-events:none;
  background:linear-gradient(90deg,#91a680,#dbeed1);
  transform:scaleX(0);
  transform-origin:left;
  box-shadow:0 0 12px #bad2a470;
}
.hero::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background-image:linear-gradient(#a4b99708 1px,transparent 1px),linear-gradient(90deg,#a4b99708 1px,transparent 1px);
  background-size:80px 80px;
  mask-image:linear-gradient(110deg,transparent 25%,#000 90%);
}
.hero::after {
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:repeating-linear-gradient(0deg,transparent 0 3px,#0000000c 3px 4px);
  mask-image:linear-gradient(90deg,transparent 40%,#000);
}
.hero-visual { opacity:1; }
.hero-visual canvas { opacity:1; }
.hero h1>span {
  color:#acb9a2;
  text-shadow:0 0 45px #c8e0b414;
}
.hero-bottom { gap:28px; }
.hero-bottom::before {
  background:linear-gradient(90deg,#ffffff0d,#b6c5a952,#ffffff12);
}
.hero-bottom .scroll-cue { margin-left:auto; }
.signal-signature {
  display:flex;
  align-items:center;
  gap:5px;
  height:30px;
  width:128px;
  flex-shrink:0;
}
.signal-signature span {
  width:2px;
  height:8px;
  background:#b7cba5;
  opacity:.4;
  transform-origin:center;
  animation:signal-wave 2.6s ease-in-out infinite;
  animation-play-state:paused;
}
.signal-signature span:nth-child(3n) { height:20px; animation-delay:-.8s; }
.signal-signature span:nth-child(3n + 1) { height:12px; animation-delay:-1.6s; }
.signal-signature span:nth-child(4n) { height:28px; animation-delay:-.4s; }
.hero.in-view .signal-signature span { animation-play-state:running; }
.motion-toggle {
  border:0;
  background:none;
  padding:12px 0;
  display:flex;
  gap:10px;
  align-items:center;
  color:#a7b59c;
  font-size:.75rem;
  min-height:44px;
}
.motion-toggle[hidden] { display:none; }
.motion-toggle:hover { color:#e0ebd7; }
.motion-icon { width:10px; height:10px; border-inline:2px solid currentColor; }
.motion-toggle[aria-pressed="true"] .motion-icon { border:1px solid currentColor; }
.motion-toggle:disabled { opacity:.7; }
.desktop-nav>a:not(.nav-contact) { position:relative; }
.desktop-nav>a:not(.nav-contact)::after {
  content:"";
  position:absolute;
  bottom:-9px;
  left:0;
  right:0;
  height:1px;
  background:#c1d4b0;
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .3s;
}
.desktop-nav>a:hover::after { transform:scaleX(1); }
.button {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  transition:background .25s,color .25s,box-shadow .35s,transform .35s;
}
.button::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  opacity:0;
  pointer-events:none;
  background:radial-gradient(120px circle at var(--pointer-x,50%) var(--pointer-y,50%),#bacda844,transparent);
  transition:opacity .35s;
}
.button:hover::before { opacity:1; }
.button:hover { transform:translateY(-2px); box-shadow:0 8px 28px #00000012; }
.button-mark { transition:transform .4s; }
.button:hover .button-mark { transform:rotate(90deg); }
.section-kicker { position:relative; }
.section-kicker::after {
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-15px;
  height:1px;
  background:linear-gradient(90deg,#7e916d60,transparent 80%);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform 1.3s cubic-bezier(.2,.65,.25,1) .15s;
}
.section-kicker.is-revealed::after { transform:scaleX(1); }
.solutions {
  background-image:radial-gradient(#778d640c .6px,transparent .6px);
  background-size:18px 18px;
}
.product {
  position:relative;
  isolation:isolate;
  transition:border-color .4s,box-shadow .4s,transform .75s,opacity .75s;
}
.product::after {
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  opacity:0;
  background:radial-gradient(380px circle at var(--pointer-x,50%) var(--pointer-y,50%),#a9bd8f16,transparent 80%);
  transition:opacity .4s;
  border:1px solid #9bad8938;
}
.product:hover::after { opacity:1; }
.product:hover { border-color:#9ead90; box-shadow:0 18px 50px #3348240b; }
.product-art::after {
  content:"";
  position:absolute;
  inset:50px 17px 43px;
  pointer-events:none;
  background:linear-gradient(#738b61,#738b61) left top / 14px 1px no-repeat,
    linear-gradient(#738b61,#738b61) left top / 1px 14px no-repeat,
    linear-gradient(#738b61,#738b61) right bottom / 14px 1px no-repeat,
    linear-gradient(#738b61,#738b61) right bottom / 1px 14px no-repeat;
  opacity:.38;
  transition:inset .5s,opacity .5s;
}
.product:hover .product-art::after { inset:57px 24px 50px; opacity:.75; }
.network-packets path {
  animation:packet-flow 3s linear infinite;
  animation-play-state:paused;
}
.network-packets path:nth-child(2n) { animation-delay:-1s; }
.network-packets path:nth-child(3n) { animation-delay:-2s; }
.network-pulse {
  transform-origin:280px 152px;
  animation:core-pulse 3s ease-out infinite;
  animation-play-state:paused;
}
.radar-sweep {
  transform-origin:280px 155px;
  animation:radar-rotation 9s linear infinite;
  animation-play-state:paused;
}
.radar-echoes circle {
  transform-box:fill-box;
  transform-origin:center;
  animation:radar-echo 4.5s ease-out infinite;
  animation-play-state:paused;
}
.radar-echoes circle:nth-child(2) { animation-delay:-1.5s; }
.radar-echoes circle:nth-child(3) { animation-delay:-3s; }
.radar-links {
  animation:radar-link 4s linear infinite;
  animation-play-state:paused;
}
.product-art.in-view :is(.network-packets path,.network-pulse,.radar-sweep,.radar-echoes circle,.radar-links) { animation-play-state:running; }
.approach,.contact { position:relative; isolation:isolate; overflow:hidden; }
.ambient-field { position:absolute; inset:0; width:100%; height:100%; z-index:-1; pointer-events:none; }
.approach .ambient-field { mask-image:linear-gradient(180deg,#0000003d,black); }
.approach::after {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:linear-gradient(90deg,#101111b5,transparent 45%,#10111180);
}
.principles article {
  position:relative;
  isolation:isolate;
  border-top-color:#56654a;
}
.principles article::before {
  content:"";
  position:absolute;
  inset:-12px;
  z-index:-1;
  opacity:0;
  background:radial-gradient(240px circle at var(--pointer-x,50%) var(--pointer-y,50%),#b9d4a313,transparent);
  transition:opacity .5s;
}
.principles article:hover::before { opacity:1; }
.principle-number { display:inline-block; border:1px solid #91a97c45; padding:5px 7px; font-size:.75rem; }
.contact .ambient-field { opacity:.8; }
.footer { position:relative; overflow:hidden; }
.footer::before {
  content:"";
  position:absolute;
  width:35%;
  height:1px;
  left:-35%;
  top:0;
  background:linear-gradient(90deg,transparent,#c1dab0,transparent);
  animation:footer-signal 9s linear infinite;
  animation-play-state:paused;
}
.footer.in-view::before { animation-play-state:running; }
dialog[open] { animation:dialog-reveal .3s cubic-bezier(.2,.7,.3,1) both; }
dialog[open]::backdrop { animation:backdrop-reveal .3s ease both; }
html.effects-ready[data-motion="running"] [data-reveal]:not(.is-revealed) {
  opacity:0;
  transform:translateY(25px);
}
[data-reveal] {
  transition:opacity .8s cubic-bezier(.2,.7,.3,1) var(--reveal-delay,0ms),transform .8s cubic-bezier(.2,.7,.3,1) var(--reveal-delay,0ms);
}
@keyframes signal-wave { 0%,100% { transform:scaleY(.5); opacity:.25; } 50% { transform:scaleY(1); opacity:.8; } }
@keyframes packet-flow { to { stroke-dashoffset:-100; } }
@keyframes core-pulse { from { transform:scale(.9); opacity:.55; } to { transform:scale(1.5); opacity:0; } }
@keyframes radar-rotation { to { transform:rotate(360deg); } }
@keyframes radar-echo { 0% { transform:scale(.75); opacity:0; } 20% { opacity:.5; } 80%,100% { transform:scale(1.3); opacity:0; } }
@keyframes radar-link { to { stroke-dashoffset:-64; } }
@keyframes footer-signal { to { transform:translateX(390%); } }
@keyframes dialog-reveal { from { opacity:0; transform:translateY(14px) scale(.985); } to { opacity:1; transform:none; } }
@keyframes backdrop-reveal { from { opacity:0; } to { opacity:1; } }

html:not([data-motion="running"]) *,
html:not([data-motion="running"]) *::before,
html:not([data-motion="running"]) *::after,
html.page-hidden *,html.page-hidden *::before,html.page-hidden *::after {
  animation-play-state:paused!important;
}
html[data-motion="paused"] [data-reveal],html[data-motion="reduced"] [data-reveal] { opacity:1; transform:none; }
html[data-motion="paused"] [data-reveal] { transition:none; }
html[data-motion="paused"] dialog[open],html[data-motion="reduced"] dialog[open],
html[data-motion="paused"] dialog[open]::backdrop,html[data-motion="reduced"] dialog[open]::backdrop { animation:none; }
@media(max-width:760px) {
  .hero-visual { top:350px; height:410px; right:-13%; width:106%; opacity:.85; }
  .hero-bottom { gap:18px; }
  .signal-signature { width:67px; gap:3px; }
  .signal-signature span:nth-child(n + 13) { display:none; }
  .motion-toggle { margin-left:auto; font-size:.75rem; }
  .principle-number { width:30px; text-align:center; padding:5px 0; align-self:start; }
  .contact .ambient-field { opacity:.4; }
  .hero::before { background-size:50px 50px; }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation:none!important; transition:none!important; }
  [data-reveal] { opacity:1!important; transform:none!important; }
  .network-pulse,.radar-echoes { opacity:.2; }
  .button:hover { transform:none; }
}
html:not([data-motion="running"]) .interaction-field { display:none; }
html:not([data-motion="running"]) .hero-visual { translate:none; }
html:not([data-motion="running"]) .product.is-revealed { transform:none; }
html:not([data-motion="running"]) .button { translate:none; }
html:not([data-motion="running"]) :is(.product,.button,.hero-visual) { transition:none; }
@media(hover:none),(pointer:coarse) {
  .interaction-field { display:none; }
  .hero-visual { translate:none; }
  .product.is-revealed { transform:none; }
  .button { translate:none; }
}
@media(max-width:760px) {
  .hero-visual { translate:none; }
}