/* Features page: three decks made by ESHLON. Cover cards choose the deck; one shared stage shows it.
   Same flat surfaces as the homepage deck showcase: 1px borders, 12px corners, no shadows. */
.feature-decks{--deck-border:#262626;--deck-border-hover:#363636;--deck-muted:#9e9e9e;padding-top:100px;scroll-margin-top:100px}
.feature-decks .feature-heading{align-items:end}

/* Cover cards: the cover slide with two slides tucked behind it, then the deck's name and where it came from. */
.fdeck-covers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;padding-bottom:20px}
.fdeck-cover{display:block;width:100%;padding:0;margin:0;border:0;background:transparent;color:inherit;font:inherit;text-align:left;cursor:pointer;border-radius:12px}
.fdeck-cover-stack{position:relative;display:block;aspect-ratio:16/9;margin:22px 10px 0;isolation:isolate}
.fdeck-cover-stack img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;border:1px solid var(--deck-border);border-radius:10px;background:#fff;transform-origin:50% 0;transition:transform 220ms cubic-bezier(.2,.7,.2,1),border-color 150ms ease,opacity 150ms ease}
.fdeck-cover-behind{opacity:.55}
.fdeck-cover-behind:first-child{transform:translateY(-22px) scale(.86)}
.fdeck-cover-behind:nth-child(2){transform:translateY(-11px) scale(.93)}
.fdeck-cover-front{z-index:1}
.fdeck-cover:hover .fdeck-cover-behind:first-child{transform:translateY(-26px) scale(.86)}
.fdeck-cover:hover .fdeck-cover-behind:nth-child(2){transform:translateY(-13px) scale(.93)}
.fdeck-cover:hover .fdeck-cover-stack img{border-color:var(--deck-border-hover)}
.fdeck-cover[aria-pressed=true] .fdeck-cover-front{border-color:#fff;box-shadow:0 0 0 1px #fff}
.fdeck-cover[aria-pressed=true] .fdeck-cover-behind{opacity:.85}
.fdeck-cover-text{display:block;padding:14px 10px 6px}
.fdeck-cover-text strong{display:block;font-weight:500;font-size:15px;line-height:22px;letter-spacing:-.01em;color:#eee}
.fdeck-cover-text>span{display:block;font-size:13px;line-height:20px;color:var(--deck-muted)}
.fdeck-cover-text i{display:inline-block;width:3px;height:3px;margin:0 8px;vertical-align:middle;border-radius:50%;background:#555}
.fdeck-cover[aria-pressed=true] .fdeck-cover-text>span{color:#bdbdbd}
.fdeck-cover:focus-visible{outline:2px solid #c2c2c2;outline-offset:5px}

/* The slide is the visual: full stage width, no window chrome. */
.features-main .fdeck-stage{position:relative;aspect-ratio:16/9;overflow:hidden;background:#fff;touch-action:pan-y}
.fdeck-stage img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;opacity:0;transition:opacity 350ms ease;user-select:none;-webkit-user-drag:none}
.fdeck-stage img.is-current{opacity:1}
.fdeck-stage.is-switching img{transition-duration:180ms}

.fdeck-strip-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;margin-top:16px}
.fdeck-strip{position:relative;display:flex;gap:12px;padding:2px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scrollbar-width:none}
.fdeck-strip[hidden]{display:none}
.fdeck-strip::-webkit-scrollbar{display:none}
.fdeck-strip[data-fade=end]{mask-image:linear-gradient(90deg,#000 calc(100% - 56px),transparent)}
.fdeck-strip[data-fade=start]{mask-image:linear-gradient(90deg,transparent,#000 56px)}
.fdeck-strip[data-fade=both]{mask-image:linear-gradient(90deg,transparent,#000 56px,#000 calc(100% - 56px),transparent)}
.fdeck-thumb{flex:0 0 204px;aspect-ratio:16/9;padding:0;overflow:hidden;border:1px solid var(--deck-border);border-radius:8px;background:#fff;cursor:pointer;opacity:.5;scroll-snap-align:center;transition:opacity 150ms ease,border-color 150ms ease}
.fdeck-thumb img{display:block;width:100%;height:100%;object-fit:cover}
.fdeck-thumb:hover{opacity:.85;border-color:var(--deck-border-hover)}
.fdeck-thumb[aria-current=true]{opacity:1;border-color:#fff;box-shadow:0 0 0 1px #fff}
.fdeck-thumb:focus-visible,.fdeck-nav:focus-visible{outline:2px solid #525252;outline-offset:3px}

.fdeck-nav{display:grid;place-items:center;width:36px;height:36px;padding:0;border:1px solid var(--deck-border);border-radius:10px;background:transparent;color:var(--deck-muted);cursor:pointer;transition:background-color 150ms ease,border-color 150ms ease,color 150ms ease}
.fdeck-nav:hover{background:#ffffff0d;border-color:var(--deck-border-hover);color:#fff}
.fdeck-nav:active{background:#ffffff1c}
.fdeck-nav svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}

@media(max-width:900px){
 .fdeck-covers{gap:12px}
 .fdeck-cover-stack{margin:16px 6px 0}
 .fdeck-cover-text{padding:10px 6px 4px}
 .fdeck-cover-text strong{font-size:14px;line-height:20px}
 .fdeck-cover-text>span{font-size:12px;line-height:18px}
 .fdeck-cover-text i{margin:0 6px}
}
@media(max-width:760px){
 .feature-decks{padding-top:60px}
 .fdeck-covers{grid-template-columns:minmax(0,1fr);gap:4px;padding-bottom:16px}
 .fdeck-cover{display:grid;grid-template-columns:132px minmax(0,1fr);gap:14px;align-items:center;padding:6px 0}
 .fdeck-cover-stack{margin:10px 0 0}
 .fdeck-cover-behind:first-child{transform:translateY(-10px) scale(.86)}
 .fdeck-cover-behind:nth-child(2){transform:translateY(-5px) scale(.93)}
 .fdeck-cover:hover .fdeck-cover-behind:first-child{transform:translateY(-10px) scale(.86)}
 .fdeck-cover:hover .fdeck-cover-behind:nth-child(2){transform:translateY(-5px) scale(.93)}
 .fdeck-cover-text{padding:0}
 .fdeck-strip-row{grid-template-columns:minmax(0,1fr);margin-top:12px}
 .fdeck-nav{display:none}
 .fdeck-strip{gap:8px}
 .fdeck-thumb{flex-basis:148px;border-radius:6px}
}
@media(prefers-reduced-motion:reduce){.fdeck-stage img,.fdeck-thumb,.fdeck-nav,.fdeck-cover-stack img{transition:none}}