/* ===== Plusto v4: widget gallery (/widgets/) and homepage teaser ===== */
.wg-filter{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 10px}
.wg-chip{font:inherit;font-size:.95rem;font-weight:500;padding:9px 16px;border-radius:var(--radius-pill);border:1px solid var(--line-strong);background:transparent;color:var(--ink);cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.wg-chip__n{opacity:.6;font-variant-numeric:tabular-nums;margin-left:2px}
@media (hover:hover){.wg-chip:hover{border-color:var(--ink)}}
.wg-chip[aria-pressed=true]{background:var(--ink);color:var(--on-ink);border-color:var(--ink)}
.wg-chip:focus-visible,.wg-shot__btn:focus-visible,.wg-seg button:focus-visible,.wg-viewer__close:focus-visible,.wg-viewer__full:focus-visible{outline:2px solid var(--plus-1);outline-offset:3px}
.wg-count{color:var(--muted);margin:0 0 clamp(20px,3vw,36px);font-size:.95rem}
.wg-grid{display:grid;gap:clamp(40px,5vw,72px)}
.wg-card[hidden]{display:none}
.wg-card__head{display:grid;grid-template-columns:auto 1fr;align-items:baseline;gap:6px 14px;margin-bottom:16px}
.wg-card__title{font-family:var(--font-text);font-weight:600;font-size:clamp(1.4rem,1.1rem + .9vw,2rem);letter-spacing:-.02em;line-height:1.1;margin:0}
.wg-card__cat{justify-self:start;font-size:.8rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);border:1px solid var(--line-strong);border-radius:var(--radius-pill);padding:3px 10px}
.wg-card__desc{grid-column:1/-1;margin:0;color:var(--muted);max-width:70ch}
.wg-card__shots{display:grid;grid-template-columns:1fr 1fr;gap:clamp(12px,1.4vw,20px)}
@media (width<=760px){.wg-card__shots{grid-template-columns:1fr}.wg-card__head{grid-template-columns:1fr}}
.wg-shot{margin:0}
.wg-shot__btn{display:block;position:relative;width:100%;padding:0;border:0;border-radius:var(--radius-tile);overflow:hidden;cursor:pointer;background:var(--panel);aspect-ratio:16/10;box-shadow:0 0 0 1px var(--line-soft)}
.wg-shot__btn img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease-out)}
.wg-shot__try{position:absolute;right:12px;bottom:12px;background:var(--ink);color:var(--on-ink);border-radius:var(--radius-pill);padding:8px 14px;font-size:.85rem;font-weight:600;opacity:0;transform:translateY(6px);transition:opacity .3s,transform .3s var(--ease-out)}
@media (hover:hover){.wg-shot__btn:hover img{transform:scale(1.02)}.wg-shot__btn:hover .wg-shot__try{opacity:1;transform:none}}
.wg-shot__btn:focus-visible .wg-shot__try{opacity:1;transform:none}
@media (hover:none){.wg-shot__try{opacity:1;transform:none}}
.wg-shot figcaption{margin-top:9px;font-size:.95rem}
.wg-shot__mode{font-weight:600}
.wg-shot__kind{color:var(--muted)}
.wg-note{margin-top:clamp(40px,5vw,64px);color:var(--muted);max-width:70ch;font-size:.95rem}
.wg-viewer{width:min(1440px,96vw);height:min(920px,92vh);max-width:none;max-height:none;padding:0;border:0;border-radius:24px;background:var(--paper);color:var(--ink);overflow:hidden}
.wg-viewer[open]{display:flex;flex-direction:column}
.wg-viewer::backdrop{background:var(--scrim)}
.wg-viewer__bar{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;padding:14px 16px 6px 22px}
.wg-viewer__title{font-family:var(--font-text);font-size:1.15rem;font-weight:600;margin:0 auto 0 0}
.wg-viewer__biz{margin:0;padding:0 22px 10px;color:var(--muted);font-size:.9rem}
.wg-seg{display:inline-flex;border:1px solid var(--line-strong);border-radius:var(--radius-pill);padding:3px}
.wg-seg button{font:inherit;font-size:.85rem;font-weight:600;border:0;background:transparent;color:var(--ink);padding:6px 13px;border-radius:var(--radius-pill);cursor:pointer}
.wg-seg button[aria-pressed=true]{background:var(--ink);color:var(--on-ink)}
.wg-viewer__full{font-size:.9rem;font-weight:600;color:var(--ink)}
.wg-viewer__close{font:inherit;font-size:1.6rem;line-height:1;width:40px;height:40px;border-radius:50%;border:0;background:var(--panel);color:var(--ink);cursor:pointer}
.wg-viewer__stage{flex:1;display:flex;justify-content:center;background:var(--panel);min-height:0}
.wg-viewer__stage iframe{border:0;width:100%;height:100%;background:#fff;transition:width .35s var(--ease-out)}
.wg-viewer.is-phone .wg-viewer__stage{padding:14px 0}
.wg-viewer.is-phone iframe{width:390px;border-radius:22px;box-shadow:0 0 0 8px var(--ink)}
@media (width<=760px){.wg-viewer{width:100vw;height:100dvh;border-radius:0}.wg-seg--device{display:none}.wg-viewer__title{flex-basis:calc(100% - 60px)}}
html.wg-lock{overflow:hidden}
.wg-teaser{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(10px,1.2vw,16px);margin-top:clamp(24px,3vw,40px)}
@media (width<=900px){.wg-teaser{grid-template-columns:repeat(2,minmax(0,1fr))}}
.wg-teaser__item{display:block;color:var(--ink);text-decoration:none;font-weight:600;font-size:.95rem}
.wg-teaser__item img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;border-radius:var(--radius-tile);margin-bottom:8px;box-shadow:0 0 0 1px var(--line-soft);transition:transform .5s var(--ease-out)}
@media (hover:hover){.wg-teaser__item:hover img{transform:translateY(-3px)}}
.wg-teaser{margin-bottom:clamp(20px,2.4vw,32px)}
@media (width<=760px){.wg-filter{flex-wrap:nowrap;overflow-x:auto;margin-inline:calc(-1 * var(--gutter));padding:2px var(--gutter) 6px;scrollbar-width:none;scroll-snap-type:x proximity}.wg-filter::-webkit-scrollbar{display:none}.wg-chip{flex:none;scroll-snap-align:start}}

/* category groups (9 Oct 2026) */
.wg-groups{display:grid;gap:clamp(56px,7vw,104px)}
.wg-group[hidden]{display:none}
.wg-group__title{font-family:var(--font-text);font-weight:700;font-size:clamp(1.7rem,1.2rem + 1.6vw,2.8rem);letter-spacing:-.025em;line-height:1.05;margin:0 0 clamp(22px,3vw,36px);padding-bottom:14px;border-bottom:1px solid var(--line-strong);display:flex;align-items:baseline;gap:12px;scroll-margin-top:110px}
.wg-group__n{font-size:.45em;font-weight:600;color:var(--muted);font-variant-numeric:tabular-nums}
.wg-card{scroll-margin-top:110px}
.wg-group .wg-card__cat{display:none}
