/* ============================================================
   Hub catégorie — CSS résiduel template-specific.

   Tout le CSS partagé (tone-system, partials sections, cards,
   tables, accordion, etc.) vit dans components.css.

   Il ne reste ici que les animations hero spécifiques #hub-hero.
   ============================================================ */

#hub-hero .cat-hero__pill,#hub-hero .cat-hero__price{opacity:0;animation:hero-el-in 800ms var(--ease-out) 200ms forwards;}
#hub-hero .cat-hero__title{opacity:0;animation:hero-title-in 1000ms var(--ease-out) 350ms forwards;}
#hub-hero .cat-hero__lead{opacity:0;animation:hero-el-in 800ms var(--ease-out) 700ms forwards;}
#hub-hero .cat-hero__actions{opacity:0;animation:hero-el-in 800ms var(--ease-out) 900ms forwards;}
#hub-hero .cat-hero__keyspecs{opacity:0;animation:hfade 800ms var(--ease-out) 1100ms forwards;}
@media(prefers-reduced-motion:reduce){
    #hub-hero .cat-hero__pill,#hub-hero .cat-hero__price,#hub-hero .cat-hero__title,
    #hub-hero .cat-hero__lead,#hub-hero .cat-hero__actions,#hub-hero .cat-hero__keyspecs{
        opacity:1;transform:none;clip-path:none;animation:none;
    }
}
@media(max-width:1024px){
    #hub-hero > div:last-of-type{grid-template-columns:1fr;}
    #hub-hero > div:last-of-type > div:last-child{display:none;}
}
@media(max-width:768px){
    #hub-hero{height:auto;min-height:100svh;padding-top:88px;padding-bottom:56px;align-items:flex-start;}
}