/* AL BASIL OPTICALS · ring.css (V26): the 360° ring of screens (ring.js). Red and violet in the 3D site,
   teal and amber in the normal website. */
.ring{--rA:#ff2a3a;--rB:#ff8a5a;position:relative;height:clamp(380px,64vh,560px);overflow:hidden;border-radius:28px;isolation:isolate;
  background:radial-gradient(ellipse 70% 55% at 50% 62%,color-mix(in srgb,var(--rB) 22%,transparent),transparent 70%),radial-gradient(ellipse 50% 30% at 50% 100%,color-mix(in srgb,var(--rA) 25%,transparent),transparent 70%),#07040b;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06),0 30px 60px -30px rgba(0,0,0,.8);touch-action:pan-y;user-select:none;-webkit-user-select:none}
body.is-classic .ring{--rA:#16e0c8;--rB:#ffb43a;background:radial-gradient(ellipse 70% 55% at 50% 62%,rgba(22,224,200,.16),transparent 70%),radial-gradient(ellipse 50% 30% at 50% 100%,rgba(255,180,58,.2),transparent 70%),#03100f}
.ring__bg{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.ring__stage{position:absolute;inset:0;z-index:1;perspective-origin:50% 46%;cursor:grab}
.ring__stage:active{cursor:grabbing}
.ring__spin{position:absolute;left:50%;top:46%;width:0;height:0;transform-style:preserve-3d}
.ring__card{position:absolute;left:0;top:0;width:var(--cw);height:var(--ch);display:block;padding:0;margin:0;border:0;border-radius:18px;overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden;
  background:#120c18;color:#fff;text-decoration:none;font:inherit;text-align:start;cursor:pointer;transition:opacity .35s,box-shadow .35s,filter .35s;filter:brightness(.72) saturate(.9);
  box-shadow:0 0 0 1px color-mix(in srgb,var(--rA) 70%,transparent),0 0 26px -6px var(--rA)}
.ring__card.is-front{filter:none;box-shadow:0 0 0 1.5px var(--rA),0 0 46px -4px var(--rA),0 0 90px -20px var(--rB)}
.ring__card:focus-visible{outline:2px solid #fff;outline-offset:3px}
.ring__img{position:absolute;inset:0}
.ring__img img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none;-webkit-user-drag:none}
.ring__card[data-kind=product] .ring__img{background:#fff}.ring__card[data-kind=product] .ring__img img{object-fit:contain;padding:8% 6% 32%}
.ring__tx{position:absolute;left:0;right:0;bottom:0;display:grid;gap:3px;padding:14px 14px 13px;background:linear-gradient(180deg,transparent,rgba(6,3,10,.92) 42%)}
.ring__tx small{font:600 .62rem/1.2 var(--mono,monospace);letter-spacing:.14em;text-transform:uppercase;color:color-mix(in srgb,var(--rA) 55%,#fff)}
.ring__tx b{font:600 1.05rem/1.15 var(--display,inherit);letter-spacing:-.01em}
.ring__tx em{font-style:normal;font-size:.78rem;line-height:1.35;color:#d8d0e4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ring__nav{position:absolute;left:50%;bottom:14px;z-index:2;transform:translateX(-50%);display:flex;align-items:center;gap:10px;padding:5px;border-radius:999px;background:rgba(10,6,16,.55);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.ring__btn{width:38px;height:38px;border-radius:50%;border:0;background:rgba(255,255,255,.1);color:#fff;font-size:1.3rem;cursor:pointer}
.ring__btn:hover{background:var(--rA)}
.ring__n{font:500 .74rem var(--mono,monospace);color:#e9e2f2;min-width:52px;text-align:center}
.ring-sec{padding-block:clamp(2.2rem,5vw,4rem)}
.ring-sec__head{display:grid;gap:.4rem;margin-bottom:1.1rem}
.ring-sec__head .h2{margin:0}
/* the turning neon lines at the top of each room page */
.ring-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;opacity:.6;mix-blend-mode:screen;--rA:#ff2a3a;--rB:#ff8a5a}
body.is-classic .ring-lines{--rA:#16e0c8;--rB:#ffb43a}
.rmh__copy{position:relative;z-index:1}
/* the hub of the normal website: only there */
#hub{display:none}
body.is-classic #hub{display:block}
/* the ring inside the showroom's glass panel */
.gv-ring{margin:4px 1rem 10px;height:340px}
@media (max-width:760px){.ring{height:clamp(360px,58vh,480px);border-radius:22px}.gv-ring{height:300px;margin:4px .6rem 8px}}
@media (prefers-reduced-motion:reduce){.ring__card{transition:none}}
