/* ============================================================================
   kwiki-featured.css — featured graphics (2026-10-08.1). DESIGN.md tokens: near-black
   forest canvas, gold hairlines (one accent: gold = premium), 14–16px radii, --elev-2,
   ease-out 180–260ms, transform/opacity only, reduced motion honoured, 44px+ targets.
   ============================================================================ */
.kwf{position:relative;padding:clamp(2rem,1.2rem + 3.2vw,4.5rem) 1rem;background:linear-gradient(180deg,#060f09 0%,#0a140d 55%,#060f09 100%);border-top:1px solid rgba(245,158,11,.14)}
.kwf[hidden]{display:none!important}
.kwf-in{max-width:1180px;margin:0 auto}
.kwf-head{text-align:center;margin:0 auto 1.4rem;max-width:760px}
.kwf-sub{color:var(--text-muted,#9cc09c);margin:.55rem auto 0;font-size:clamp(.95rem,.92rem + .2vw,1.05rem);line-height:1.55;max-width:620px}
.kwf-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:14px 0}
@media (min-width:720px){.kwf-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin:18px 0}}
.kwf-tile,.kwf-row{display:flex;flex-direction:column;text-decoration:none;color:inherit;background:#0d1a10;border:1px solid #26382d;border-radius:14px;overflow:hidden;box-shadow:0 10px 30px -12px rgba(0,0,0,.5),0 2px 8px rgba(0,0,0,.3);transition:transform .24s cubic-bezier(.22,1,.36,1),border-color .24s ease,box-shadow .24s ease,opacity .26s ease}
.kwf-row{border-radius:16px;margin:14px 0}
@media (min-width:720px){.kwf-row{margin:18px 0}}
.kwf-tile[hidden],.kwf-row[hidden],.kwf-group[hidden]{display:none!important}
.kwf-tile picture,.kwf-row picture{display:block;overflow:hidden;background:#0b1a0f}
.kwf-tile img,.kwf-row img{display:block;width:100%;height:auto;transition:transform .5s cubic-bezier(.22,1,.36,1)}
.kwf-tile img{aspect-ratio:1/1;object-fit:cover}
.kwf-row img{aspect-ratio:3/1;object-fit:cover}
.kwf-cap{display:flex;flex-direction:column;gap:.3rem;padding:.7rem .8rem .85rem;min-height:44px}
.kwf-row .kwf-cap{flex-direction:row;align-items:center;justify-content:space-between;gap:.8rem;padding:.75rem 1rem}
.kwf-name{font-family:'Plus Jakarta Sans','Segoe UI',sans-serif;font-weight:700;font-size:clamp(.84rem,.8rem + .2vw,.95rem);line-height:1.3;color:#eafff0}
.kwf-cta{font-family:'Plus Jakarta Sans','Segoe UI',sans-serif;font-weight:800;font-size:.8rem;letter-spacing:.02em;color:#fcd34d;white-space:nowrap}
.kwf-tile:hover,.kwf-row:hover{transform:translateY(-3px);border-color:rgba(245,158,11,.55);box-shadow:0 26px 60px -22px rgba(0,0,0,.62),0 6px 18px rgba(0,0,0,.34)}
.kwf-tile:hover img,.kwf-row:hover img{transform:scale(1.035)}
.kwf-tile:focus-visible,.kwf-row:focus-visible{outline:2px solid #fcd34d;outline-offset:3px;border-color:rgba(245,158,11,.7)}
.kwf-anim{opacity:0;transform:translateY(14px)}
.kwf-anim.kwf-in-view{opacity:1;transform:none}
/* menu page: one category's graphics above the grid */
.kwf-menu{padding:.4rem 1rem 0;background:none;border-top:0}
.kwf-menu .kwf-in{max-width:1240px}
.kwf-catrow{display:grid;grid-template-columns:1fr;gap:12px;align-items:stretch}
.kwf-catrow .kwf-tile{max-width:300px;width:100%;justify-self:center}
.kwf-catrow .kwf-row{margin:0}
@media (min-width:720px){.kwf-catrow{grid-template-columns:minmax(0,1fr) minmax(0,3fr);gap:18px}.kwf-catrow .kwf-tile{max-width:none}}
@media (prefers-reduced-motion:reduce){.kwf-tile,.kwf-row,.kwf-tile img,.kwf-row img,.kwf-anim{transition:none!important;transform:none!important;opacity:1!important}}