/* =====================================================================
   BHARAT NEWS ANALYSIS  |  ColorMag Pro Drop-in Stylesheet
   ---------------------------------------------------------------------
   Where to paste:  WP Admin -> Appearance -> Customize -> Additional CSS
   Tested on:       ColorMag Pro (ThemeGrill), child theme recommended
   Version:         1.0
   ===================================================================== */


/* ---------------------------------------------------------------------
   1. DESIGN TOKENS
   --------------------------------------------------------------------- */
:root {
  --bna-red:        #a82124;
  --bna-red-dark:   #8a1b1e;
  --bna-bg:         #fafaf7;
  --bna-beige:      #f7f3ec;
  --bna-pink:       #fff5f5;
  --bna-pink-bd:    #fcd0d0;
  --bna-black:      #0a0a0a;
  --bna-gray:       #525252;
  --bna-gray-light: #737373;
  --bna-border:     #e5e5e5;
}


/* ---------------------------------------------------------------------
   2. GOOGLE FONTS (load Playfair Display + Source Serif Pro)
   --------------------------------------------------------------------- */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;700;800;900&family=Source+Serif+Pro:ital,wght@0,300;0,400;0,600;0,700;1,400&display=swap');


/* ---------------------------------------------------------------------
   3. GLOBAL BASE
   --------------------------------------------------------------------- */
body {
  background: var(--bna-bg) !important;
  color: var(--bna-black);
  font-family: 'Source Serif Pro', Georgia, 'Times New Roman', serif !important;
  font-size: 15px;
  line-height: 1.6;
}

h1, h2, h3, h4, h5, h6,
.entry-title, .widget-title,
.cm-entry-title {
  font-family: 'Playfair Display', Georgia, serif !important;
  font-weight: 700;
  letter-spacing: 0;
  color: var(--bna-black);
}

a {
  color: inherit;
  text-decoration: none;
  transition: color 200ms ease;
}
a:hover { color: var(--bna-red); }

::selection { background: var(--bna-red); color: #fff; }


/* ---------------------------------------------------------------------
   4. TOP UTILITY BAR (Customize -> Top Header)
   --------------------------------------------------------------------- */
.cm-top-header {
  background: var(--bna-black) !important;
  color: #e5e5e5 !important;
  font-size: 11px !important;
  letter-spacing: 0.04em;
}
.cm-top-header a { color: #e5e5e5 !important; }
.cm-top-header a:hover { color: #fff !important; }
.cm-top-header .cm-subscribe,
.cm-top-header .top-header-button {
  background: var(--bna-red) !important;
  color: #fff !important;
  padding: 4px 12px !important;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  border-radius: 0;
}


/* ---------------------------------------------------------------------
   5. MASTHEAD / SITE HEADER
   --------------------------------------------------------------------- */
.cm-site-header,
.cm-header {
  background: #fff !important;
  border-bottom: 1px solid var(--bna-border);
}
.site-branding,
.cm-logo {
  text-align: center;
  padding: 20px 0;
}
.custom-logo {
  max-height: 110px !important;
  width: auto !important;
}


/* ---------------------------------------------------------------------
   6. PRIMARY NAVIGATION
   --------------------------------------------------------------------- */
#cm-site-navigation,
.cm-main-navigation {
  background: #fff;
  border-top: 1px solid var(--bna-border);
  border-bottom: 1px solid var(--bna-border);
}
#cm-site-navigation .menu > li > a,
.cm-main-navigation .menu > li > a {
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  font-family: Arial, Helvetica, sans-serif !important;
  color: var(--bna-black) !important;
  padding: 14px 16px !important;
}
#cm-site-navigation .menu > li > a:hover,
#cm-site-navigation .menu > .current-menu-item > a,
.cm-main-navigation .menu > li > a:hover {
  color: var(--bna-red) !important;
  background: transparent !important;
}
#cm-site-navigation .menu > li > a::before { display: none !important; }


/* ---------------------------------------------------------------------
   7. BREAKING NEWS TICKER
   --------------------------------------------------------------------- */
.cm-breaking-news,
.cm-breaking-news-wrap,
#cm-breaking-news {
  background: var(--bna-pink) !important;
  border-top: 1px solid var(--bna-pink-bd) !important;
  border-bottom: 1px solid var(--bna-pink-bd) !important;
  padding: 8px 0 !important;
}
.cm-breaking-news .cm-breaking-news-latest,
.cm-breaking-news-title {
  background: var(--bna-red) !important;
  color: #fff !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  padding: 3px 10px !important;
  border-radius: 0 !important;
}
.cm-breaking-news .news-content,
.cm-breaking-news a {
  font-family: 'Source Serif Pro', serif !important;
  font-size: 13px !important;
  color: var(--bna-black) !important;
}


/* ---------------------------------------------------------------------
   8. CATEGORY BADGES (unified burgundy)
   --------------------------------------------------------------------- */
.cm-post-categories a,
.cat-links a,
.entry-meta .cat-links a {
  background: var(--bna-red) !important;
  color: #fff !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 10px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.12em !important;
  font-weight: 700 !important;
  padding: 3px 8px !important;
  border-radius: 0 !important;
}


/* ---------------------------------------------------------------------
   9. SECTION TITLES (Featured Posts panels)
   --------------------------------------------------------------------- */
.cm-featured-posts-section .widget-title,
.cm-featured-category-section .widget-title,
.cm-featured-slider + .widget-title,
.widget-title {
  font-family: 'Playfair Display', serif !important;
  font-size: 26px !important;
  font-weight: 700 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  color: var(--bna-black) !important;
  border-bottom: 2px solid var(--bna-black) !important;
  padding: 0 0 8px 0 !important;
  margin: 0 0 20px 0 !important;
}
.cm-featured-posts-section .widget-title span,
.cm-featured-category-section .widget-title span,
.widget-title span {
  background: transparent !important;
  color: var(--bna-black) !important;
  padding: 0 !important;
  border: 0 !important;
}


/* ---------------------------------------------------------------------
   10. HERO SLIDER (Featured Posts: Slider)
   --------------------------------------------------------------------- */
.cm-featured-slider {
  margin: 16px 0 32px 0;
}
.cm-featured-slider .entry-title,
.cm-featured-slider .entry-title a {
  font-family: 'Playfair Display', serif !important;
  font-size: 34px !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  color: #fff !important;
}
.cm-featured-slider .cm-post-categories a {
  background: var(--bna-red) !important;
}
.cm-featured-slider .entry-summary,
.cm-featured-slider .excerpt {
  font-family: 'Source Serif Pro', serif !important;
  font-size: 15px !important;
  line-height: 1.55 !important;
}
.cm-featured-slider .slick-dots li.slick-active button:before,
.cm-featured-slider .owl-dots .owl-dot.active span {
  background: var(--bna-red) !important;
  color: var(--bna-red) !important;
}


/* ---------------------------------------------------------------------
   11. HIGHLIGHTED POSTS (Top News sidebar beside hero)
   --------------------------------------------------------------------- */
.cm-featured-highlighted .widget-title {
  border-bottom: 2px solid var(--bna-red) !important;
}
.cm-featured-highlighted .entry-title,
.cm-featured-highlighted .entry-title a {
  font-family: 'Playfair Display', serif !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
}
.cm-featured-highlighted article {
  padding: 8px 0 !important;
  border-bottom: 1px solid var(--bna-border) !important;
}
.cm-featured-highlighted article:last-child { border-bottom: 0 !important; }


/* ---------------------------------------------------------------------
   12. LATEST NEWS STRIP (Featured Category: 3-Column Grid)
   --------------------------------------------------------------------- */
.cm-fc-left-sidebar .widget-title,
.cm-latest-news .widget-title {
  border-top: 2px solid var(--bna-red) !important;
  border-bottom: 0 !important;
  padding-top: 12px !important;
}
.cm-fc-left-sidebar article,
.cm-latest-news article {
  border-bottom: 1px dashed var(--bna-border) !important;
  padding-bottom: 12px !important;
  margin-bottom: 12px !important;
}
.cm-fc-left-sidebar .entry-title,
.cm-latest-news .entry-title {
  font-family: 'Source Serif Pro', serif !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
}
.cm-fc-left-sidebar .cm-post-date,
.cm-latest-news .cm-post-date {
  font-size: 11px !important;
  color: var(--bna-gray-light) !important;
}


/* ---------------------------------------------------------------------
   13. EDITORIAL + OPINION SECTION (beige background block)
   --------------------------------------------------------------------- */
.cm-fc-right-sidebar,
.cm-editorial-opinion-wrap {
  background: var(--bna-beige) !important;
  padding: 48px 0 !important;
  border-top: 1px solid var(--bna-border) !important;
  border-bottom: 1px solid var(--bna-border) !important;
  margin: 32px 0 !important;
}
.cm-fc-right-sidebar .widget-title {
  border-bottom: 2px solid var(--bna-black) !important;
}
.cm-fc-right-sidebar .cm-post-categories a {
  background: var(--bna-black) !important;
}


/* ---------------------------------------------------------------------
   14. EDITOR'S PICK (Featured Posts: 3-Column Boxes)
   --------------------------------------------------------------------- */
.cm-featured-boxes article {
  background: #fff;
  padding: 0 !important;
  margin-bottom: 24px;
}
.cm-featured-boxes .entry-title,
.cm-featured-boxes .entry-title a {
  font-family: 'Playfair Display', serif !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
}
.cm-featured-boxes .entry-summary {
  font-family: 'Source Serif Pro', serif !important;
  font-size: 13px !important;
  color: var(--bna-gray) !important;
  line-height: 1.55 !important;
}


/* ---------------------------------------------------------------------
   15. FEATURED VIDEOS (dark section)
   --------------------------------------------------------------------- */
.cm-fc-video,
.cm-featured-video-section {
  background: var(--bna-black) !important;
  color: #fff !important;
  padding: 48px 0 !important;
  margin: 32px 0 !important;
}
.cm-fc-video .widget-title,
.cm-featured-video-section .widget-title {
  color: #fff !important;
  border-bottom: 2px solid var(--bna-red) !important;
}
.cm-fc-video .entry-title a,
.cm-featured-video-section .entry-title a { color: #fff !important; }
.cm-fc-video .entry-title a:hover,
.cm-featured-video-section .entry-title a:hover { color: #ff8a8c !important; }
.cm-fc-video .cm-post-date,
.cm-fc-video .cm-author { color: #bdbdbd !important; }


/* ---------------------------------------------------------------------
   16. MAGAZINE LAYOUT (Moneywise + Sci-Tech split)
   --------------------------------------------------------------------- */
.cm-fc-magazine .widget-title {
  border-bottom: 2px solid var(--bna-black) !important;
}
.cm-fc-magazine .lead-article .entry-title {
  font-family: 'Playfair Display', serif !important;
  font-size: 22px !important;
  font-weight: 700 !important;
}


/* ---------------------------------------------------------------------
   17. ARTICLE CARDS - GENERAL (image hover, title hover)
   --------------------------------------------------------------------- */
.cm-featured-image { overflow: hidden; }
.cm-featured-image img,
.cm-post img.wp-post-image {
  transition: transform 500ms ease;
}
.cm-featured-image:hover img,
.cm-post:hover img.wp-post-image {
  transform: scale(1.04);
}

.entry-title a,
.cm-entry-title a {
  color: var(--bna-black) !important;
  transition: color 200ms ease;
}
.entry-title a:hover,
.cm-entry-title a:hover {
  color: var(--bna-red) !important;
}


/* ---------------------------------------------------------------------
   18. POST META (date / author / tags)
   --------------------------------------------------------------------- */
.cm-below-entry-meta,
.entry-meta,
.cm-post-date,
.cm-author,
.cm-tag-links {
  font-family: 'Source Serif Pro', serif !important;
  font-size: 12px !important;
  color: var(--bna-gray-light) !important;
}
.cm-below-entry-meta a:hover { color: var(--bna-red) !important; }
.cm-below-entry-meta .cm-icon { fill: var(--bna-gray-light); }


/* ---------------------------------------------------------------------
   19. EXCERPTS / BODY TEXT
   --------------------------------------------------------------------- */
.cm-entry-summary p,
.entry-summary p,
.entry-content p {
  font-family: 'Source Serif Pro', serif !important;
  font-size: 15px !important;
  line-height: 1.65 !important;
  color: var(--bna-black) !important;
}


/* ---------------------------------------------------------------------
   20. READ MORE BUTTON
   --------------------------------------------------------------------- */
.cm-entry-button,
.more-link,
.read-more {
  display: inline-block !important;
  background: transparent !important;
  color: var(--bna-red) !important;
  border: 1px solid var(--bna-red) !important;
  border-radius: 0 !important;
  padding: 8px 16px !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  transition: background 200ms ease, color 200ms ease !important;
}
.cm-entry-button:hover,
.more-link:hover,
.read-more:hover {
  background: var(--bna-red) !important;
  color: #fff !important;
}
.cm-entry-button span { color: inherit !important; }


/* ---------------------------------------------------------------------
   21. SIDEBAR WIDGETS
   --------------------------------------------------------------------- */
.cm-secondary .widget,
#cm-secondary .widget {
  background: #fff;
  padding: 16px;
  margin-bottom: 24px;
  border: 1px solid var(--bna-border);
}
.cm-secondary .widget-title,
#cm-secondary .widget-title {
  font-size: 18px !important;
  padding-bottom: 8px !important;
  margin-bottom: 14px !important;
}


/* ---------------------------------------------------------------------
   22. FOOTER
   --------------------------------------------------------------------- */
#cm-footer,
.cm-footer-widgets-wrapper,
.site-footer {
  background: var(--bna-black) !important;
  color: #e5e5e5 !important;
}
#cm-footer .widget-title,
.site-footer .widget-title {
  color: #fff !important;
  font-size: 14px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  font-family: Arial, Helvetica, sans-serif !important;
  border-bottom: 1px solid #2a2a2a !important;
  padding-bottom: 10px !important;
}
#cm-footer a,
.site-footer a { color: #bdbdbd !important; }
#cm-footer a:hover,
.site-footer a:hover { color: #fff !important; }
.cm-bottom-footer,
.site-info {
  background: #000 !important;
  border-top: 1px solid #1a1a1a !important;
  color: #737373 !important;
  font-size: 11px !important;
  padding: 12px 0 !important;
}


/* ---------------------------------------------------------------------
   23. FOLLOW US STRIP (placed in "Above Footer" widget area)
   --------------------------------------------------------------------- */
.bna-follow-strip {
  background: var(--bna-beige);
  padding: 48px 16px;
  text-align: center;
  border-top: 1px solid var(--bna-border);
  border-bottom: 1px solid var(--bna-border);
}
.bna-follow-strip .eyebrow {
  color: var(--bna-red);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  margin-bottom: 8px;
  display: block;
}
.bna-follow-strip h3 {
  font-family: 'Playfair Display', serif;
  font-size: 32px;
  margin: 0 0 12px;
}
.bna-follow-strip p {
  font-style: italic;
  color: var(--bna-gray);
  max-width: 32rem;
  margin: 0 auto 28px;
  font-size: 14px;
}
.bna-follow-strip .links {
  display: flex;
  gap: 14px;
  justify-content: center;
  flex-wrap: wrap;
}
.bna-follow-strip .links a {
  color: #fff !important;
  padding: 14px 22px;
  font-family: Arial, sans-serif;
  font-weight: 600;
  font-size: 13px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  transition: transform 200ms ease, filter 200ms ease;
}
.bna-follow-strip .links a:hover {
  transform: translateY(-2px);
  filter: brightness(1.1);
}
.bna-follow-strip .fb { background: #1877F2; }
.bna-follow-strip .x  { background: #0a0a0a; }
.bna-follow-strip .ig { background: #E1306C; }
.bna-follow-strip .yt { background: #FF0000; }
.bna-follow-strip .wa { background: #25D366; }


/* ---------------------------------------------------------------------
   24. NEWSLETTER STRIP
   --------------------------------------------------------------------- */
.bna-newsletter-strip {
  background: var(--bna-red);
  padding: 32px 16px;
  color: #fff;
}
.bna-newsletter-strip .wrap {
  max-width: 1280px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}
.bna-newsletter-strip h4 {
  font-family: 'Playfair Display', serif;
  font-size: 24px;
  margin: 0;
  color: #fff;
}
.bna-newsletter-strip p {
  font-style: italic;
  margin: 4px 0 0;
  font-size: 13px;
  opacity: 0.9;
}
.bna-newsletter-strip input[type="email"] {
  padding: 10px 14px;
  border: 0;
  font-family: 'Source Serif Pro', serif;
  width: 280px;
  max-width: 100%;
}
.bna-newsletter-strip button,
.bna-newsletter-strip input[type="submit"] {
  background: var(--bna-black);
  color: #fff;
  border: 0;
  padding: 10px 18px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  cursor: pointer;
  transition: background 200ms ease;
}
.bna-newsletter-strip button:hover,
.bna-newsletter-strip input[type="submit"]:hover {
  background: #000;
}


/* ---------------------------------------------------------------------
   25. FLOATING STICKY SOCIAL BAR (custom container -- inject via HTML widget)
   --------------------------------------------------------------------- */
.bna-sticky-social {
  position: fixed;
  top: 50%;
  right: 16px;
  transform: translateY(-50%);
  z-index: 50;
  background: #fff;
  border: 1px solid var(--bna-border);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
  display: flex;
  flex-direction: column;
  width: 48px;
}
.bna-sticky-social .label {
  background: var(--bna-bg);
  color: var(--bna-red);
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  text-align: center;
  padding: 6px 0;
  border-bottom: 1px solid var(--bna-border);
}
.bna-sticky-social a {
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-bottom: 1px solid #f0f0f0;
  color: var(--bna-gray);
  transition: background 200ms ease, color 200ms ease;
}
.bna-sticky-social a:last-child { border-bottom: 0; }
.bna-sticky-social a.fb:hover { background: #1877F2; color: #fff; }
.bna-sticky-social a.x:hover  { background: #0a0a0a; color: #fff; }
.bna-sticky-social a.ig:hover { background: #E1306C; color: #fff; }
.bna-sticky-social a.yt:hover { background: #FF0000; color: #fff; }
.bna-sticky-social a.wa:hover { background: #25D366; color: #fff; }

@media (max-width: 991px) {
  .bna-sticky-social { display: none; }
}


/* ---------------------------------------------------------------------
   26. SEARCH FORM
   --------------------------------------------------------------------- */
.search-form input[type="search"] {
  border: 0;
  border-bottom: 2px solid var(--bna-red);
  padding: 8px 12px;
  font-family: 'Source Serif Pro', serif;
  border-radius: 0;
  outline: none;
}
.search-form input[type="submit"] {
  background: var(--bna-red);
  color: #fff;
  border: 0;
  padding: 8px 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  border-radius: 0;
}


/* ---------------------------------------------------------------------
   27. FORMS (Everest Forms / contact / comments)
   --------------------------------------------------------------------- */
.everest-form input[type="text"],
.everest-form input[type="email"],
.everest-form textarea,
#commentform input[type="text"],
#commentform input[type="email"],
#commentform textarea {
  border: 1px solid var(--bna-border) !important;
  border-radius: 0 !important;
  font-family: 'Source Serif Pro', serif !important;
  padding: 10px 12px !important;
}
.everest-form button,
.everest-form input[type="submit"],
#commentform input[type="submit"] {
  background: var(--bna-red) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 0 !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
}


/* ---------------------------------------------------------------------
   28. PAGINATION
   --------------------------------------------------------------------- */
.default-wp-page a,
.cm-pagination a,
.page-numbers {
  border: 1px solid var(--bna-border) !important;
  border-radius: 0 !important;
  padding: 8px 14px !important;
  color: var(--bna-black) !important;
  font-family: Arial, sans-serif !important;
  font-weight: 700 !important;
  font-size: 12px !important;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  transition: background 200ms ease, color 200ms ease;
}
.default-wp-page a:hover,
.cm-pagination a:hover,
.page-numbers.current,
.page-numbers:hover {
  background: var(--bna-red) !important;
  color: #fff !important;
  border-color: var(--bna-red) !important;
}


/* ---------------------------------------------------------------------
   29. SINGLE POST PAGE
   --------------------------------------------------------------------- */
.single .entry-title {
  font-size: 38px !important;
  line-height: 1.1 !important;
  margin-bottom: 16px !important;
}
.single .entry-content p {
  font-size: 17px !important;
  line-height: 1.75 !important;
}
.single .entry-content a {
  color: var(--bna-red) !important;
  border-bottom: 1px solid var(--bna-red);
}
.single blockquote {
  border-left: 4px solid var(--bna-red) !important;
  background: var(--bna-beige);
  padding: 16px 20px;
  font-style: italic;
  font-size: 18px;
  color: var(--bna-black);
}


/* ---------------------------------------------------------------------
   30. SCROLLBAR + MISC POLISH
   --------------------------------------------------------------------- */
::-webkit-scrollbar { width: 8px; height: 6px; }
::-webkit-scrollbar-track { background: var(--bna-bg); }
::-webkit-scrollbar-thumb { background: #d4d4d4; }
::-webkit-scrollbar-thumb:hover { background: var(--bna-red); }

/* Smooth image fade-in (ColorMag's "tg-image-to-reveal-fade-in") */
.tg-image-to-reveal-fade-in { transition: opacity 600ms ease; }

/* Focus rings for accessibility */
a:focus-visible,
button:focus-visible {
  outline: 2px solid var(--bna-red) !important;
  outline-offset: 2px;
}


/* ---------------------------------------------------------------------
   31. RESPONSIVE OVERRIDES
   --------------------------------------------------------------------- */
@media (max-width: 768px) {
  .cm-featured-slider .entry-title,
  .cm-featured-slider .entry-title a { font-size: 22px !important; }

  .cm-featured-posts-section .widget-title,
  .cm-featured-category-section .widget-title,
  .widget-title { font-size: 20px !important; }

  .single .entry-title { font-size: 26px !important; }

  .bna-follow-strip h3 { font-size: 24px; }
  .bna-newsletter-strip .wrap { flex-direction: column; text-align: center; }

  .custom-logo { max-height: 70px !important; }
}


/* ===================  END OF STYLESHEET  ============================ */