/*
Theme Name: Fashion Model Hub
Theme URI: https://example.com
Author: Danu
Description: Custom theme for Fashion Model Hub.
Version: 1.0.0
Text Domain: fashion-model-hub
*/

/* =========================================
   Auto Stats Slider (Marquee) – Premium
   ========================================= */

.fmh-marquee{
  overflow: hidden;
  position: relative;
}

/* soft fade edges (luxury look) */
.fmh-marquee:before,
.fmh-marquee:after{
  content:"";
  position:absolute;
  top:0;
  width:80px;
  height:100%;
  z-index:2;
  pointer-events:none;
}
.fmh-marquee:before{
  left:0;
  background: linear-gradient(to right, rgba(34,28,16,1), rgba(34,28,16,0));
}
.fmh-marquee:after{
  right:0;
  background: linear-gradient(to left, rgba(34,28,16,1), rgba(34,28,16,0));
}

.fmh-track{
  display:flex;
  align-items:center;
  gap:48px;
  width:max-content;
  will-change: transform;
  animation: fmh-marquee 18s linear infinite;
  opacity:.65;
  padding: 6px 0;
}

/* pause on hover */
.fmh-marquee:hover .fmh-track{
  animation-play-state: paused;
}

.fmh-item{
  white-space: nowrap;
  font-weight: 900;
  letter-spacing: .22em;
  text-transform: uppercase;
  font-size: 14px;
  color: rgba(255,255,255,.85);
}

/* responsive */
@media (max-width: 768px){
  .fmh-track{ gap: 28px; animation-duration: 14s; }
  .fmh-item{ font-size: 12px; letter-spacing: .18em; }
  .fmh-marquee:before,
  .fmh-marquee:after{ width: 40px; }
}

/* accessibility: reduce motion */
@media (prefers-reduced-motion: reduce){
  .fmh-track{ animation: none; transform: none; }
}

@keyframes fmh-marquee{
  0%{ transform: translateX(0); }
  100%{ transform: translateX(-50%); }
}