/* Remonto dirbtuvės – hero juostelė + Premium 11a „Ratas“ (ratas.js). Spalvos ir šriftai – iš dist/styles.css tokenų. */
.hero-spec{display:flex;flex-wrap:wrap;gap:.6rem 2rem;margin-top:2.2rem;padding-top:1.1rem;border-top:1px solid rgb(236 238 239 / .18);max-width:44rem;font-size:.9rem;color:var(--color-ink-2);list-style:none}
.hero-spec b{font:600 1.05rem/1 var(--font-display);letter-spacing:.04em;text-transform:uppercase;color:var(--color-ink);margin-right:.45rem}

/* ---------- Bazė (be WebGL / reduced-motion): tinklelis ---------- */
.ratas{position:relative;z-index:1;background:var(--color-paper);padding:clamp(4rem,10vh,7rem) 0}
.ratas-stage{max-width:1600px;margin:0 auto;padding:0 clamp(1.25rem,3vw,2.5rem)}
.ratas-h{font:700 clamp(2.6rem,4.4vw,4.6rem)/.92 var(--font-display);text-transform:uppercase;color:var(--color-ink);margin-top:1rem}
.ratas-h em{font-style:normal;color:var(--color-accent)}
.ratas-hint{margin-top:1rem;color:var(--color-ink-3);max-width:34ch}
.ratas-act,.ratas-sw{display:none}
.ratas-list{list-style:none;margin:2.5rem 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.25rem}
.ratas-list a{display:block;text-decoration:none;color:var(--color-ink);border-radius:14px;background:var(--color-surface);padding:8px 8px 14px;box-shadow:inset 0 0 0 1px var(--color-line);transition:box-shadow .35s var(--ease-out-soft)}
.ratas-list a:hover{box-shadow:inset 0 0 0 1px var(--color-accent)}
.ratas-list img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;border-radius:9px;background:var(--color-raised)}
.ratas-n{display:flex;gap:.6rem;align-items:baseline;margin:.8rem .3rem 0;font:700 1.35rem/1 var(--font-display);text-transform:uppercase}
.ratas-n b{color:var(--color-accent);font-weight:600;font-size:1rem}
.ratas-d{display:block;margin:.35rem .3rem 0;font-size:.9rem;color:var(--color-ink-3)}

/* ---------- Kompiuteris su WebGL: prisegta scena per 300vh ---------- */
.ratas-on .ratas{height:300vh;padding:0}
.ratas-on .ratas-stage{position:sticky;top:0;height:100vh;height:100svh;max-width:none;padding:0;overflow:hidden;
  background:radial-gradient(48% 62% at 66% 52%,rgb(224 122 46 / .07),transparent 70%)}
.ratas-on .ratas canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:pan-y;opacity:0;transition:opacity 1s var(--ease-out-soft)}
.ratas-on .ratas.is-ready canvas{opacity:1}
.ratas-on .ratas-tx{position:absolute;z-index:2;left:clamp(1.5rem,4vw,4rem);top:0;bottom:0;width:min(30rem,34vw);display:flex;flex-direction:column;justify-content:center;pointer-events:none}
.ratas-on .ratas-tx a,.ratas-on .ratas-tx button{pointer-events:auto}
.ratas-on .ratas-act{display:block;margin-top:2.2rem;padding-top:1.4rem;border-top:1px solid var(--color-line-strong)}
.ratas-no{font:600 .8rem/1 var(--font-sans);letter-spacing:.24em;color:var(--color-ink-2)}
.ratas-no b{color:var(--color-accent)}
.ratas-name{margin-top:.7rem;font:700 clamp(2rem,3vw,3rem)/1 var(--font-display);text-transform:uppercase;color:var(--color-ink)}
.ratas-desc{margin-top:.6rem;color:var(--color-ink-2);min-height:3.2em;max-width:32ch}
.ratas-cta{margin-top:1.2rem}
.ratas-act.is-swap .ratas-name,.ratas-act.is-swap .ratas-desc{animation:ratasIn .5s var(--ease-out-expo) both}
@keyframes ratasIn{from{opacity:0;transform:translate3d(0,10px,0)}to{opacity:1;transform:none}}
.ratas-on .ratas-sw{display:inline-flex;align-self:flex-start;margin-top:2rem;padding:4px;border-radius:999px;background:var(--color-surface);box-shadow:inset 0 0 0 1px var(--color-line-strong)}
.ratas-sw button{font:600 .85rem var(--font-sans);color:var(--color-ink-2);background:none;border:0;min-height:40px;padding:.55rem 1.1rem;border-radius:999px;cursor:pointer;transition:background-color .3s var(--ease-out-soft),color .3s var(--ease-out-soft)}
.ratas-sw button:hover{color:var(--color-ink)}
.ratas-sw button[aria-pressed="true"]{background:var(--color-ink);color:var(--color-paper)}
/* Sąrašas lieka prieinamas skaitytuvams ir klaviatūrai (fokusas suka ratą), bet nematomas */
.ratas-on .ratas-list{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);margin:0}
.ratas-on .ratas-list a:focus-visible{outline:none}
.ratas-cap{position:absolute;z-index:2;right:clamp(1.5rem,4vw,4rem);bottom:2rem;font:600 .74rem/1 var(--font-sans);letter-spacing:.2em;text-transform:uppercase;color:var(--color-ink-3);pointer-events:none}
@media (max-width: 1100px){.ratas-on .ratas-tx{width:min(24rem,38vw)}}