/* ============================================================
   slider-fouc.css — Global carousel FOUC guard for Glider.

   Glider builds its horizontal track with JavaScript. Before that runs,
   the raw cards are plain blocks and stack vertically ("4 cards one by
   one"), then snap into the carousel. Until slider-fouc.js adds
   .slider-ready, show only the FIRST card so there is no stacked flash —
   the full carousel then fades in once laid out.

   Targets the .glider element itself (every Glider has it, whether or not
   it is wrapped in .glider-contain), so ALL gliders on ALL pages are
   covered on mobile and desktop. Swiper and Glide lay their slides out in
   a row via their own CSS, so they don't need this guard.
   ============================================================ */
.glider:not(.slider-ready) {
    overflow: hidden;
}
.glider:not(.slider-ready) > *:not(:first-child) {
    display: none !important;
}
.glider.slider-ready {
    animation: sliderFadeIn 0.3s ease both;
}
@keyframes sliderFadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}