.feat-wood-grain { background: var(--bg-2); }
.feat-wood-grain .half { position: absolute; top: 0; bottom: 0; width: 50%; overflow: hidden; }
.feat-wood-grain .real { left: 0; }
.feat-wood-grain .fake { right: 0; }
.feat-wood-grain .board { position: absolute; left: 0; top: 0; width: 100%; height: auto; display: block;
  will-change: transform; animation: wg-pan 22s cubic-bezier(.45,0,.55,1) infinite alternate; }
@keyframes wg-pan { from { transform: translate3d(0,0,0); } to { transform: translate3d(0,-55%,0); } }
.feat-wood-grain .sheen { position: absolute; inset: -20% -60%; pointer-events: none; will-change: transform;
  background: linear-gradient(100deg, transparent 35%, rgba(255,226,180,.11) 50%, transparent 65%);
  animation: wg-sheen 22s cubic-bezier(.45,0,.55,1) infinite alternate; }
@keyframes wg-sheen { from { transform: translate3d(-18%,0,0); } to { transform: translate3d(18%,0,0); } }
.feat-wood-grain .tile { position: absolute; inset: 0; background: url(/features/wood-grain/assets/plastic-tile.webp) 0 0 / 27% auto repeat; }
.feat-wood-grain .gloss { position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(104deg, transparent 0 46%, rgba(255,255,255,.05) 47%, rgba(255,255,255,.13) 50.5%, rgba(255,255,255,.05) 54%, transparent 55%);
  animation: wg-gloss 22s cubic-bezier(.45,0,.55,1) infinite alternate; will-change: transform; }
@keyframes wg-gloss { from { transform: translate3d(-12%,0,0); } to { transform: translate3d(12%,0,0); } }
.feat-wood-grain .seam { position: absolute; top: 0; bottom: 0; left: 50%; width: 2px; margin-left: -1px; background: var(--bg); }
.feat-wood-grain .tag { position: absolute; left: 0; right: 0; bottom: 0; padding: 0 0 clamp(10px, 2.2vw, 26px);
  text-align: center; font: 500 clamp(11px, 1.05vw, 14px)/1 var(--font-ui); letter-spacing: .14em; text-transform: uppercase;
  color: rgba(239,230,216,.86); }
.feat-wood-grain .tag::before { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: clamp(44px, 9vw, 96px); z-index: -1;
  background: linear-gradient(to top, rgba(10,9,7,.55), transparent); }
.feat-wood-grain .tag { z-index: 2; }
.feat-wood-grain:not(.is-visible) * { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) { .feat-wood-grain * { animation: none !important; } }