/*
  Visual direction: precision-luxury industrial.
  Cool graphite and silver stages make the real machines the focal point;
  muted copper is reserved for actions and technical markers.
*/
:root {
  --ink: #071724;
  --ink2: #0e2a40;
  --orange: #c88a55;
  --sand: #f1f4f6;
  --paper: #ffffff;
  --line: rgba(31, 51, 67, .16);
  --muted: #647482;
}

body { background: #f1f4f6; }

.topbar {
  color: #e8eef2;
  background: rgba(5, 20, 31, .96);
  border-color: rgba(255,255,255,.1);
  box-shadow: 0 12px 34px rgba(2, 12, 20, .16);
}
.brand {
  display: inline-flex;
  width: 178px;
  height: 52px;
  align-items: center;
  justify-content: center;
  background: #fff;
  border: 1px solid rgba(255,255,255,.35);
  box-shadow: inset 0 0 0 5px rgba(7,23,36,.035);
}
.brand img { width: 155px; height: 42px; mix-blend-mode: normal; }
.language { color: #fff; }
.language span { color: #8fa2b1; }
.quote,.primary { background: #b97845; box-shadow: 0 10px 24px rgba(185,120,69,.2); }
.quote:hover,.primary:hover { background: #d29a69; }

.hero {
  color: #f7fafc;
  background:
    linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px),
    radial-gradient(circle at 76% 42%, #1b4059 0, #0b2639 34%, #071724 68%);
  background-size: 52px 52px, 52px 52px, auto;
}
.hero .kicker { color: #d5a47b; }
.hero h1 span { color: #d5a47b; }
.hero h1 span{animation:heroTextFlow 5.8s ease-in-out infinite;background:linear-gradient(100deg,#d98745 0%,#f3bd82 24%,#8fd7f3 48%,#58b6df 66%,#d98745 100%);background-clip:text;background-size:220% 100%;color:transparent!important;-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-shadow:0 0 28px rgba(88,182,223,.13)}
.hero .kicker{animation:heroKickerGlow 3.8s ease-in-out infinite;color:#8fd7f3!important;text-shadow:0 0 14px rgba(88,182,223,.22)}
@keyframes heroTextFlow{0%,100%{background-position:0 50%;filter:brightness(1)}50%{background-position:100% 50%;filter:brightness(1.12)}}
@keyframes heroKickerGlow{0%,100%{opacity:.78;text-shadow:0 0 8px rgba(88,182,223,.14)}50%{opacity:1;text-shadow:0 0 22px rgba(88,182,223,.42)}}
.hero .lead { color: #b8c7d1; }
.hero .secondary { color: #f7fafc; border-color: rgba(255,255,255,.5); }
.hero .fit-list { border-color: rgba(255,255,255,.15); }
.hero .fit-list dd,.hero .figure-note { color: #9dafbb; }
.hero-machine:before {
  width: 600px;
  height: 600px;
  background:
    radial-gradient(circle at 38% 30%, rgba(255,255,255,.98), rgba(225,232,237,.92) 42%, rgba(141,160,174,.72) 73%, rgba(70,95,113,.35));
  border: 1px solid rgba(255,255,255,.32);
  box-shadow: 0 40px 85px rgba(0,0,0,.38), inset 0 1px 0 #fff;
}
.hero-machine:before{animation:stagePulse 4.8s ease-in-out infinite;box-shadow:0 0 0 1px rgba(143,215,243,.28),0 0 38px rgba(88,182,223,.16),inset 0 0 42px rgba(88,182,223,.08)}
.hero-machine:after{animation:stageOrbit 13s linear infinite;background:conic-gradient(from 0deg,transparent 0 20%,rgba(88,182,223,.95) 23%,transparent 27% 56%,rgba(217,135,69,.78) 59%,transparent 63% 100%);border-radius:50%;content:"";height:596px;mask:radial-gradient(circle,transparent 68%,#000 69% 72%,transparent 73%);pointer-events:none;position:absolute;width:596px;z-index:1}
@keyframes stageOrbit{to{transform:rotate(360deg)}}
@keyframes stagePulse{0%,100%{filter:brightness(1);box-shadow:0 0 0 1px rgba(143,215,243,.28),0 0 30px rgba(88,182,223,.13),inset 0 0 32px rgba(88,182,223,.06)}50%{filter:brightness(1.035);box-shadow:0 0 0 2px rgba(143,215,243,.52),0 0 58px rgba(88,182,223,.26),inset 0 0 58px rgba(88,182,223,.13)}}
.hero-machine .axis { background: rgba(213,164,123,.28); }
.hero-machine img { filter: drop-shadow(0 34px 30px rgba(0,0,0,.48)) contrast(1.04); }
.spec-marker { background: rgba(5,20,31,.94); border: 1px solid rgba(213,164,123,.55); box-shadow: 10px 10px 0 rgba(213,164,123,.16); }

.decision-strip { background: #061520; box-shadow: 0 18px 40px rgba(3,18,28,.17); }
.decision-strip button:hover,.decision-strip button.active { background: #b97845; }

.methods { background: #f4f6f8; }
.method:hover,.method.active { background: #fff; box-shadow: 0 22px 50px rgba(7,31,48,.11); }
.method-detail {
  background: #fff;
  border-left-color: #b97845;
  box-shadow: 0 28px 70px rgba(7,31,48,.1);
}
.method-detail img {
  padding: 1.5rem;
  background: #e9eff3;
  border: 1px solid #d7e0e6;
  box-shadow: inset 0 1px 0 #fff, 0 20px 38px rgba(17,42,60,.12);
}

.dark { background: #061724; }
.product-feature { background: #0c293e; border-color: rgba(203,219,229,.14); box-shadow: 0 36px 80px rgba(0,0,0,.28); }
.product-feature figure {
  background:
    linear-gradient(135deg, rgba(255,255,255,.13), transparent 45%),
    radial-gradient(circle at 55% 42%, #e7edf1 0, #9eafb9 49%, #405d70 100%);
  border-left: 1px solid rgba(255,255,255,.18);
}
.product-feature figure img { filter: drop-shadow(0 30px 28px rgba(2,15,24,.48)) contrast(1.06); }
.product-card { background: #0a2234; }
.product-card:nth-child(2),.product-card:nth-child(3) { background: #0c293e; }
.product-card img {
  margin: 1.2rem 0;
  padding: 1rem;
  background: radial-gradient(circle at center, rgba(236,242,245,.2), rgba(80,107,125,.08) 62%, transparent 72%);
  filter: drop-shadow(0 22px 18px rgba(0,0,0,.38)) contrast(1.04);
}
.home-product-image-link{align-self:center;display:block;overflow:hidden;text-decoration:none}.home-product-image-link img{transition:transform .28s ease}.home-product-image-link:hover img{transform:scale(1.025)}.home-product-image-link:focus-visible{outline:3px solid #58b6df;outline-offset:4px}

.workflow { background: #f7f8f9; }
.flow-diagram>div { background: #fff; box-shadow: 0 12px 30px rgba(7,31,48,.045); }
.configuration { box-shadow: 0 24px 60px rgba(7,31,48,.08); }
.industries { background: #dfe6ea; }
.evidence { background: #edf1f3; }
.evidence-grid { box-shadow: 0 24px 60px rgba(7,31,48,.08); }
.evidence-grid div { background: #fff; }
.faq { background: #fff; }
.inquiry { background: radial-gradient(circle at 8% 20%, #183a50, #071724 52%); }
.site-footer { background: #04111b; }

@media (max-width: 650px) {
  .brand { width: 138px; height: 46px; }
  .brand img { width: 118px; }
  .hero-machine:before { width: 350px; height: 350px; }
  .method-detail img { padding: .8rem; }
}
@media(max-width:650px){.hero-machine:after{height:330px;width:330px}.hero-machine:before{animation-duration:6s}.hero h1 span{animation-duration:7.5s;text-shadow:0 0 18px rgba(88,182,223,.1)}.hero .kicker{animation-duration:5s}}
@media(prefers-reduced-motion:reduce){.hero-machine:before,.hero-machine:after,.hero h1 span,.hero .kicker{animation:none!important}}