/* Orbita warsztatu w hero na stronie głównej. */

.hero-orbit{
  grid-area:photo;
  margin:0;
  width:100%;
  min-width:0;
  align-self:center;
  overflow:hidden;
}
.orbit-stage{
  position:relative;
  isolation:isolate;
  --orbit-y:50%;
  aspect-ratio:1 / 1;
  width:100%;
  margin:0 auto;
  perspective:1200px;
  overflow:hidden;
  touch-action:pan-y;
}
.orbit-guide{
  position:absolute;left:50%;top:var(--orbit-y);
  z-index:0;
  border:1px solid rgba(243,238,232,.2);
  border-radius:50%;
  pointer-events:none;
  transform:translate(-50%,-50%);
}
.orbit-guide--in{width:56%;height:56%}
.orbit-guide--mid{width:74%;height:68%;border-color:rgba(243,238,232,.14)}
.orbit-guide--out{width:92%;height:80%;border-color:rgba(243,238,232,.09)}

.bench{
  position:absolute;left:50%;top:var(--orbit-y);
  width:min(72%,28rem);
  transform:translate(-50%,-50%) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));
  transform-style:preserve-3d;
  z-index:4;
  pointer-events:none;
}
.bench-lid{
  background:#0c0b10;
  border:1px solid rgba(243,238,232,.2);
  border-radius:12px 12px 2px 2px;
  padding:8px 8px 9px;
  box-shadow:0 22px 48px rgba(0,0,0,.48);
}
.bench-screen{
  aspect-ratio:16 / 10;
  background:#16131c;
  border-radius:2px;
  overflow:hidden;
}
.forge{
  height:100%;
  display:grid;
  grid-template-rows:auto 1fr;
  background:#121018;
}
.forge-chrome{
  display:flex;gap:5px;align-items:center;
  padding:7px 9px 6px;
  border-bottom:1px solid rgba(243,238,232,.08);
}
.forge-chrome i{
  display:block;width:6px;height:6px;border-radius:50%;
  background:rgba(243,238,232,.28);
}
.forge-page{
  display:grid;grid-template-columns:1.05fr .95fr;gap:8%;
  align-items:center;min-height:0;
  padding:8% 8% 9%;
}
.forge-copy{display:grid;align-content:center;gap:9%;min-width:0}
.forge-mark{
  width:1.35rem;height:1.05rem;margin-bottom:.1rem;
  background:url("/assets/images/brand/mark-drip.png") left center / contain no-repeat;
}
.forge-h{width:92%;height:.38rem;border-radius:1px;background:rgba(243,238,232,.86)}
.forge-h--s{width:58%;height:.28rem;background:rgba(243,238,232,.58)}
.forge-line{width:78%;height:.14rem;border-radius:1px;background:rgba(243,238,232,.2)}
.forge-line--s{width:52%}
.forge-cta{
  width:38%;height:.42rem;margin-top:.15rem;border-radius:1px;background:var(--accent);
  animation:forgeCta 3.2s ease-in-out infinite;
}
.forge-win{
  min-width:0;height:100%;max-height:100%;
  display:grid;grid-template-rows:auto 1fr;
  overflow:hidden;border-radius:3px;
  background:#1e1c26;
  border:1px solid rgba(243,238,232,.2);
  box-shadow:0 8px 18px rgba(0,0,0,.28);
}
.forge-win-bar{
  display:flex;gap:4px;align-items:center;
  padding:5px 6px;
  background:#121018;
  border-bottom:1px solid rgba(243,238,232,.12);
}
.forge-win-bar i{
  display:block;width:5px;height:5px;border-radius:50%;flex:0 0 auto;
  background:rgba(243,238,232,.38);
}
.forge-win-url{
  display:block;flex:1;height:.32rem;margin-left:4px;
  border-radius:99px;background:rgba(243,238,232,.14);
}
.forge-win-body{
  display:grid;grid-template-rows:1fr auto auto;align-content:stretch;
  gap:9%;padding:11% 10% 12%;
  min-height:0;
  background:#25222c;
}
.forge-win-hero{
  min-height:0;
  border-radius:1px;
  background:
    linear-gradient(165deg,rgba(224,162,74,.28),transparent 55%),
    linear-gradient(180deg,#4a4656 0%,#2f2c38 70%,#26232e 100%);
  box-shadow:inset 0 0 0 1px rgba(243,238,232,.08);
}
.forge-win-row{
  height:.16rem;width:76%;border-radius:1px;background:rgba(243,238,232,.28);
}
.forge-win-row--s{width:46%;background:rgba(243,238,232,.16)}
@keyframes forgeCta{
  0%,100%{opacity:1}
  50%{opacity:.72}
}

.bench-base{
  height:11px;margin:0 -5%;
  background:linear-gradient(180deg,#2c2933,#14121a);
  border-radius:0 0 12px 12px;
}
.bench-plate{
  width:72%;height:6px;margin:4px auto 0;
  background:#0a090d;
  border-radius:0 0 50% 50%;
}

.orbit-sat{
  position:absolute;left:50%;top:var(--orbit-y);
  display:grid;justify-items:center;gap:.32rem;
  width:4.2rem;
  margin:0;
  transform:translate(-50%,-50%);
  pointer-events:none;
  transition:opacity .12s linear;
}
.orbit-sat.is-occluded{
  opacity:0 !important;
}
.orbit-disc{
  display:grid;place-items:center;
  width:3.15rem;height:3.15rem;
  border-radius:50%;
  overflow:hidden;
  color:var(--accent);
  background:#14121a;
  box-shadow:inset 0 0 0 1px rgba(224,162,74,.38),0 10px 22px rgba(0,0,0,.38);
}
.orbit-disc img{
  display:block;
  width:68%;
  height:68%;
  object-fit:contain;
}
.orbit-disc--wide img{
  width:86%;
  height:86%;
}
.orbit-label{
  font-family:var(--mono);font-size:.58rem;letter-spacing:.06em;
  text-transform:uppercase;color:rgba(243,238,232,.62);
  white-space:nowrap;
}

@media (max-width:1024px){
  .bench{width:min(74%,22rem)}
}
@media (max-width:768px){
  .hero-orbit{max-width:30rem;margin:.4rem auto 0;align-self:stretch}
  .orbit-stage{aspect-ratio:1 / 1;--orbit-y:48%}
  .bench{width:min(70%,20rem)}
  .orbit-sat{width:3.6rem}
  .orbit-disc{width:2.85rem;height:2.85rem}
  .orbit-label{display:none}
}
@media (prefers-reduced-motion:reduce){
  .bench,.orbit-sat{transition:none;will-change:auto}
  .forge-cta{animation:none}
}
