.nite-showcase{
  --feature-gap:24px;
  padding:80px 0 100px;
  min-width:0;
  max-width:100%;
  color:#f8f7fc;
}
.nite-showcase-header{max-width:900px;margin:0 auto 36px;padding:0 24px;text-align:center}
.nite-showcase-header h2{font-size:clamp(32px,4vw,54px);line-height:1.1;letter-spacing:-.04em;margin:0 0 16px}
.nite-showcase-header p{font-size:clamp(16px,1.5vw,20px);color:#aaa6b7;line-height:1.5;margin:0}
.nite-feature-track{
  display:flex;gap:var(--feature-gap);overflow-x:auto;overflow-y:hidden;
  padding:12px 0 20px;
  margin-left:clamp(24px,5vw,72px);
  scroll-snap-type:x mandatory;scroll-behavior:smooth;
  overscroll-behavior-x:contain;scrollbar-width:none;
}
.nite-feature-track::-webkit-scrollbar{display:none}
.nite-feature-track::after{content:"";flex:0 0 24px}
.nite-feature-card{
  box-sizing:border-box;flex:0 0 calc((100% - 3 * var(--feature-gap)) / 3.25);
  min-width:0;scroll-snap-align:start;background:#141219;
  border:1px solid #302b3a;border-radius:28px;padding:28px 24px 24px;
  display:grid;grid-template-rows:128px auto 36px;gap:24px;
  transition:border-color .2s ease;
}
.nite-feature-card h3{font-size:clamp(24px,2.2vw,34px);line-height:1.15;text-align:center;margin:0;align-self:start;letter-spacing:-.035em}
.nite-feature-phone{
  width:82%;max-width:270px;aspect-ratio:9 / 19.5;
  box-sizing:border-box;margin:auto;position:relative;overflow:hidden;
  border:3px solid #aaa4b4;border-radius:clamp(28px,3vw,42px);
  background:#060409;box-shadow:0 0 0 3px #050407,0 18px 30px #0007;
  transition:transform .25s ease;
}
.nite-feature-phone img,.nite-feature-phone video{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;background:#060409}
.nite-feature-placeholder{position:absolute;inset:0;display:grid;place-content:center;text-align:center;color:#827b92;font-size:14px;padding:20px}
.nite-feature-description{margin:0;text-align:center;font-size:15px;line-height:1.5;color:#aaa6b7;align-self:start}
.nite-showcase-controls{display:flex;align-items:center;justify-content:center;gap:24px;padding:16px 24px 0}
.nite-showcase-controls button{border:1px solid #494052;border-radius:50%;width:44px;height:44px;background:#17121f;color:#fff;font-size:23px;cursor:pointer}
.nite-showcase-controls button:disabled{opacity:.25;cursor:default}
.nite-showcase-controls button:focus-visible,.nite-feature-track:focus-visible{outline:2px solid #8b5cf6;outline-offset:4px}
.nite-feature-progress{--progress:0;width:180px;height:3px;border-radius:9px;background:#302b3a;overflow:hidden}
.nite-feature-progress::before{content:"";display:block;height:100%;width:calc(16.667% + var(--progress) * 83.333%);background:#8b5cf6;border-radius:inherit}
@media(hover:hover){
  .nite-feature-card:hover{border-color:#8b5cf688}
  .nite-feature-card:hover .nite-feature-phone{transform:translateY(-4px)}
}
@media(max-width:1100px){
  .nite-feature-card{flex-basis:calc((100% - 2 * var(--feature-gap)) / 2.2)}
}
@media(max-width:640px){
  .nite-showcase{--feature-gap:16px;padding:56px 0 64px}
  .nite-feature-track{margin-left:20px}
  .nite-feature-card{flex-basis:86%;padding:24px 20px;grid-template-rows:116px auto 36px}
  .nite-feature-phone{width:84%}
  .nite-showcase-controls button{display:none}
}
@media(prefers-reduced-motion:no-preference){
  .nite-feature-card.is-visible{animation:nite-feature-appear .4s ease both}
  @keyframes nite-feature-appear{from{opacity:.6;transform:translateY(8px)}to{opacity:1;transform:none}}
}
@media(prefers-reduced-motion:reduce){
  .nite-feature-track{scroll-behavior:auto}
  .nite-feature-card,.nite-feature-phone{transition:none}
  .nite-feature-card:hover .nite-feature-phone{transform:none}
}