/* Musafir Translations 1.2.0 - ONE article-title style site-wide (family, weight, colour); only the SIZE varies by slot.
   Why it was needed: the Elementor kit styles every <a> (Inter, weight 400, brand red, 16px) with higher specificity than the theme's title classes, so every title
   that is a LINK (hero, ticker, Trending, cards' text) ignored the theme's heading font. Family = the site's heading font (--font-display, Fraunces); weight 700;
   colour = the theme's dark ink; brand red on hover. */
:root{--mt-title-font:var(--font-display,'Fraunces'),Georgia,serif;--mt-title-color:var(--ink,#17313D);--mt-title-hover:var(--c-berita,#C65D65)}
/* 1. every slot that carries an article title: hero (.ms-bh), cards, category list, Trending, Latest Articles rail, ticker, related posts (cards), article h1 */
body .ms-bh:not(#mt),
body .ms-card-title:not(#mt),
body .ms-card-overlay-title:not(#mt),
body .ms-article-title:not(#mt),
body .ms-trending-title:not(#mt),
body .ms-hero-side-title:not(#mt),
body .ms-hero-main-title:not(#mt),
body .ms-main-hero-title:not(#mt),
body .ms-single-title:not(#mt),
body .ms-hangat-title:not(#mt),
body .ms-blt-x:not(#mt),
body .ms-ticker-item>span:last-child:not(#mt){
  font-family:var(--mt-title-font)!important;font-weight:700!important;font-style:normal!important;letter-spacing:-.012em;text-transform:none}
/* 2. colour: dark ink everywhere */
body .ms-bh:not(#mt),
body .ms-card-title:not(#mt),
body .ms-card-title a:not(#mt),
body .ms-article-title:not(#mt),
body .ms-article-title a:not(#mt),
body .ms-trending-title:not(#mt),
body .ms-trending-title a:not(#mt),
body .ms-main-hero-title:not(#mt),
body .ms-single-title:not(#mt),
body .ms-hangat-title:not(#mt),
body .ms-blt-x:not(#mt),
body .ms-ticker-item>span:last-child:not(#mt){color:var(--mt-title-color)!important}
/* 3. a link inside a title element takes the title's own font (the kit's link style no longer wins) */
body .ms-card-title a:not(#mt),
body .ms-article-title a:not(#mt),
body .ms-trending-title a:not(#mt),
body .ms-card-overlay-title a:not(#mt),
body .ms-hero-side-title a:not(#mt),
body .ms-hero-main-title a:not(#mt){
  font:inherit!important;letter-spacing:inherit!important;text-decoration:none}
/* 4. brand red on hover */
body a.ms-bh:hover:not(#mt),
body .ms-card-title a:hover:not(#mt),
body .ms-article-title a:hover:not(#mt),
body .ms-trending-title a:hover:not(#mt),
body .ms-blt a:hover .ms-blt-x:not(#mt),
body .ms-hangat-list a:hover .ms-hangat-title:not(#mt),
body .ms-ticker-item:hover>span:last-child:not(#mt){color:var(--mt-title-hover)!important}
/* 5. titles laid over a photo stay white (not used on the current homepage, kept for the carousel / old hero markup) */
body .ms-card-overlay-title:not(#mt),
body .ms-card-overlay-title a:not(#mt),
body .ms-hero-main-title a:not(#mt),
body .ms-hero-side-title a:not(#mt){color:#fff!important}
body .ms-card-overlay-title a:hover:not(#mt),
body .ms-hero-main-title a:hover:not(#mt),
body .ms-hero-side-title a:hover:not(#mt){color:var(--saffron-tint,#FBE3BE)!important}
/* 6. size by slot (hero .ms-bh keeps the theme's responsive 34/25/17px); tidy line-height */
body .ms-bh:not(#mt){line-height:1.15}
body .ms-card-title:not(#mt){line-height:1.3}
body .ms-article-title:not(#mt),
body .ms-single-title:not(#mt){line-height:1.2}
body .ms-trending-title:not(#mt),
body .ms-hangat-title:not(#mt),
body .ms-blt-x:not(#mt){line-height:1.35}
body .ms-hangat-title:not(#mt){font-size:15px}
body .ms-blt-x:not(#mt){font-size:14.5px}
body .ms-ticker-item>span:last-child:not(#mt){font-size:13.5px;line-height:1.3}
