/* LOOM Studio — "We craft a concept": a living product showcase — a bento of
   mixed square + rectangle tiles, mixing looping product films with stills, all
   cycling through every metal + variation. */
.loom-concept{
  display:flex; gap:10px; width:100%; margin-top:16px;
  align-items:center; justify-content:center; flex-wrap:wrap;
}
.loom-ctile{
  position:relative; height:clamp(112px,15.5vw,156px); flex:0 0 auto;
  border-radius:16px; overflow:hidden;
  background:#0c0b14;
  box-shadow:0 10px 28px -12px #000000a0, inset 0 0 0 1px #ffffff16;
}
.loom-ctile.sq{ aspect-ratio:1/1; }
.loom-ctile.wide{ aspect-ratio:16/10; }
.loom-ctile.tall{ aspect-ratio:3/4; }
.loom-ctile img, .loom-ctile video{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; opacity:0;
  transition:opacity 1.1s ease;
  will-change:opacity;
}
.loom-ctile img.is-on, .loom-ctile video.is-on{ opacity:1; }
/* tiny metal label */
.loom-ctile__tag{
  position:absolute; right:8px; top:8px; z-index:3;
  font:600 9px/1 "neuehaasdisplayroman",Arial,sans-serif; letter-spacing:.6px;
  text-transform:uppercase; color:#fff; padding:4px 7px; border-radius:100px;
  background:#0008; backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px);
}
/* soft sheen sweep to feel "in progress" */
.loom-ctile::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(115deg,transparent 40%,#ffffff22 50%,transparent 60%);
  transform:translateX(-120%);
  animation:loom-sheen 5.5s ease-in-out infinite;
}
.loom-ctile:nth-child(2)::after{ animation-delay:1.1s; }
.loom-ctile:nth-child(3)::after{ animation-delay:2.2s; }
@keyframes loom-sheen{
  0%,72%{ transform:translateX(-120%); }
  86%,100%{ transform:translateX(120%); }
}
.loom-ctile__dot{
  position:absolute; left:9px; bottom:9px; z-index:3;
  display:flex; gap:5px;
}
.loom-ctile__dot i{
  width:5px; height:5px; border-radius:50%; background:#ffffff55; transition:background .4s,transform .4s;
}
.loom-ctile__dot i.on{ background:#fff; transform:scale(1.3); }

/* "You share your idea" (Step 1) — snake shots, rounded + cover-cropped */
#i1j7jnd-2, #i2ekftl-2, #i2ekftl-2-2, #i1j7jnd-2-2,
#i1j7jnd-2-3, #i2ekftl-2-3, #i2ekftl-2-2-2, #i1j7jnd-2-2-2{
  border-radius:16px !important;
  object-fit:cover !important;
  aspect-ratio:1/1;
  width:49% !important;
  height:auto;
}

/* Mobile hero: make "From idea to reality" readable over the light scene + show body */
@media (max-width:768px){
  #i2omk-2-2{
    font-size:12dvw !important; line-height:1.02 !important; max-width:92vw;
    text-shadow:0 2px 26px rgba(18,10,38,.7), 0 1px 5px rgba(18,10,38,.65) !important;
  }
  #i2omk-2-2-4{
    display:block !important; font-size:16px !important; line-height:1.4 !important;
    margin-top:12px !important; max-width:90vw;
    text-shadow:0 1px 16px rgba(18,10,38,.8), 0 1px 4px rgba(18,10,38,.7) !important;
  }
  #i54bq-2-2{ bottom:6dvh !important; }
}