/* ── виды: образцы на листе ── */
.vsheet{padding:clamp(24px,3.4vw,48px);transition:background .5s,box-shadow .5s}
.vsheet__head{display:flex;align-items:end;justify-content:space-between;gap:24px}
.vsheet .h2{max-width:22ch;font-size:clamp(36px,3.6vw,56px);transition:color .5s}
.vgrid{display:grid;grid-template-columns:repeat(6,1fr);gap:clamp(10px,1.6vw,24px);margin-top:clamp(24px,3vw,40px)}
.vk{display:flex;flex-direction:column;align-items:center;gap:12px;text-decoration:none;color:var(--ink)}
.vk__st{position:relative;width:100%;aspect-ratio:1;transition:transform .35s cubic-bezier(.2,1,.3,1),filter .5s}
.vk__st svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.vk__face{filter:url(#resin-lg) drop-shadow(0 .5px .4px rgba(20,18,18,.3)) drop-shadow(0 1.5px 2px rgba(20,18,18,.12))}
.vk__name{font-family:var(--font-head);font-weight:800;text-transform:uppercase;font-size:clamp(14px,1.2vw,18px);line-height:1.05;text-align:center;transition:color .5s}
.vk__name em{font-style:normal;font-family:var(--font-body);font-size:11px;font-weight:700;padding:3px 8px;border-radius:99px;background:var(--y);color:var(--ink);vertical-align:middle;margin-left:4px}
/* голография: перелив бежит по стикеру на hover */
.vk--holo .vk__st::after{content:"";position:absolute;inset:11%;border-radius:18%;pointer-events:none;mix-blend-mode:soft-light;opacity:0;transition:opacity .3s;
    background:linear-gradient(115deg,transparent 20%,rgba(255,255,255,.9) 35%,rgba(120,200,255,.6) 45%,rgba(255,120,200,.6) 55%,transparent 70%) 0 0/250% 100%}
/* «выключить свет»: лист темнеет, остальные стикеры гаснут, светящийся — горит */
/* «Выключить свет» — тихая пилюля-переключатель вместо жёлтого шарика: контур, иконка лампочки/луны штрихом */
.vlight{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 18px 0 14px;border:0;border-radius:99px;background:transparent;color:var(--ink);
    font:600 14px/1 var(--font-body);cursor:pointer;flex:none;box-shadow:inset 0 0 0 1.5px rgba(20,18,18,.18);transition:background .12s,color .12s,box-shadow .12s;
    will-change:transform;contain:paint}
/* свой слой: перерисовка на hover не задевает лист со SVG-фильтрами смолы — без него ховер тормозил */
.vlight:hover{background:var(--ink);color:#fff;box-shadow:none}
.vlight:focus-visible{outline:3px solid var(--y);outline-offset:3px}
.vlight svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.vlight .i-moon{display:none}
.vsheet.is-dark{background:linear-gradient(128deg,#25272a,#1b1c1e 50%,#222326);box-shadow:inset 0 0 0 1px rgba(255,255,255,.06),0 24px 40px -28px rgba(0,0,0,.6)}
.vsheet.is-dark .h2,.vsheet.is-dark .vk__name{color:#f3f1ec}
.vsheet.is-dark .vlight{color:#f3f1ec;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.22)}
.vsheet.is-dark .vlight:hover{background:#f3f1ec;color:var(--ink)}
.vsheet.is-dark .vlight .i-bulb{display:none}
.vsheet.is-dark .vlight .i-moon{display:block}
.vsheet.is-dark .vk:not(.vk--glow) .vk__st{filter:brightness(.32) saturate(.6)}
.vsheet.is-dark .vk--glow .vk__face{filter:url(#resin-lg) brightness(1.15) saturate(1.3) drop-shadow(0 0 10px rgba(190,255,90,.75)) drop-shadow(0 0 26px rgba(160,240,60,.45))}
.vsheet.is-dark .vk--glow .vk__belt{opacity:.25}
@media(max-width:1000px){
  .vgrid{grid-template-columns:repeat(3,1fr);row-gap:28px}
}
@media(max-width:560px){
  .vgrid{grid-template-columns:repeat(2,1fr)}
  .vsheet__head{flex-direction:column;align-items:flex-start}
}
@media(max-width:560px){
  /* мобилка: все заголовки блоков одного размера, мельче херо (40px) */
  .vsheet{display:flex;flex-direction:column}
  .vsheet__head{display:contents}
  .vlight{order:1;align-self:center;margin-top:28px}
  .vk{gap:0}
  .vk__name{margin-top:-6px}
}
/* метка конца страницы для футера */
.vk__t{font-family:var(--font-head);font-weight:800}
.vk__tb{font-family:var(--font-body);font-weight:600}
.vk__inv{filter:brightness(0) invert(1)}