/* Full-width, fluid front page for tablets / laptops / large monitors.
     >= 821px : new home grid + breaking ticker (below that the existing mobile home is used)
     >= 1024px: new top bar + logo/banner header
   No fixed max-width: the layout stretches edge to edge and scales with the viewport. */
.nt-bar, .nt-brand, .nt-home, .nt-ticker { display: none; }

@media (min-width: 821px) {
  :root { --nt-pad: clamp(16px, 2.6vw, 72px); --nt-gap: clamp(18px, 2vw, 44px); --nt-h: clamp(300px, 27vw, 640px); }
  .nt-legacy { display: none !important; }
  body { padding-bottom: 0; }

  .nt-wrap { width: 100%; max-width: none; margin: 0; padding-inline: var(--nt-pad); box-sizing: border-box; }

  /* ---- home grid ---- */
  .nt-home { display: block; background: #fff; padding: clamp(18px, 2vw, 32px) 0 40px; }
  .nt-home img { background: #e5e7eb; }
  .nt-home a { color: inherit; text-decoration: none; }
  .nt-home h2, .nt-home h3, .nt-home h4 { margin: 0; }

  .nt-head { margin: 0 0 14px; }
  .nt-head h2 { display: flex; align-items: center; gap: 10px; font-size: clamp(16px, 1.25vw, 22px); font-weight: 800; color: var(--heading, #111316); letter-spacing: .2px; line-height: 1.2; }
  .nt-head h2::before { content: ""; width: 10px; height: 3px; background: var(--brand, #e11d2e); flex: none; }
  .nt-head h2::after { content: ""; flex: 1; height: 1px; background: #d9dce1; }
  .nt-head a:hover { color: var(--brand-dark, #ca9700); }

  .nt-meta { display: block; margin-top: 6px; font-size: clamp(12px, .9vw, 14px); color: #6b7280; }
  .nt-meta i { font-style: normal; margin: 0 3px; }
  .nt-more { display: inline-flex; align-items: center; gap: 6px; margin-top: 8px; font-size: clamp(13.5px, 1vw, 16px); font-weight: 600; color: var(--brand-dark, #ca9700) !important; }
  .nt-more svg { width: 16px; height: 16px; }

  /* row 1: slider · editor's pick · trending */
  .nt-top3 { display: grid; grid-template-columns: 2.05fr 1.1fr 1.1fr; gap: var(--nt-gap); margin-bottom: clamp(26px, 3vw, 56px); }
  .nt-ov { position: relative; overflow: hidden; }
  .nt-ov-link { display: block; position: relative; height: 100%; }
  .nt-ov img { width: 100%; height: 100%; object-fit: cover; display: block; position: absolute; inset: 0; }
  .nt-ov-link::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,.85) 0%, rgba(0,0,0,.35) 45%, rgba(0,0,0,0) 75%); }
  .nt-ov-txt { position: absolute; z-index: 2; left: 0; right: 0; bottom: 0; padding: clamp(12px, 1.3vw, 26px) clamp(14px, 1.4vw, 28px); color: #fff; }
  .nt-ov-txt b { font-size: clamp(14px, 1.1vw, 20px); line-height: 1.4; font-weight: 700; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
  .nt-ov-txt small { display: block; margin-top: 6px; font-size: clamp(11.5px, .85vw, 14px); color: rgba(255,255,255,.85); }
  .nt-ov-xl { height: var(--nt-h); }
  .nt-ov-xl .nt-ov-txt b { font-size: clamp(17px, 1.5vw, 28px); border-left: 3px solid var(--brand, #e11d2e); padding-left: 12px; }
  .nt-ov-tall { height: var(--nt-h); }
  .nt-ov-half { height: calc((var(--nt-h) - var(--nt-gap)) / 2); }
  .nt-ov-half + .nt-ov-half { margin-top: var(--nt-gap); }

  .nt-c-latest, .nt-c-pick, .nt-c-trend { position: relative; min-width: 0; }
  .nt-slider { position: relative; }
  .nt-slide { display: none; } .nt-slide.on { display: block; }
  .nt-arrows { position: absolute; top: -38px; width: 26px; height: 26px; border-radius: 50%; border: 0; background: #fff; box-shadow: 0 1px 4px rgba(0,0,0,.28); display: grid; place-items: center; cursor: pointer; color: #111; padding: 0; }
  .nt-arrows svg { width: 16px; height: 16px; }
  .nt-arrows:hover { background: var(--brand, #e11d2e); }
  .nt-prev { right: 34px; } .nt-next { right: 0; }

  /* rows 2/3 */
  .nt-cols3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--nt-gap); margin-bottom: clamp(26px, 3vw, 56px); }
  .nt-cols2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: calc(var(--nt-gap) * 1.3); }
  .nt-col { min-width: 0; }
  .nt-sec { margin-bottom: clamp(24px, 2.4vw, 46px); }

  .nt-card { margin-bottom: 20px; }
  .nt-card-img { display: block; aspect-ratio: 16 / 10; overflow: hidden; }
  .nt-card img { width: 100%; height: 100%; object-fit: cover; display: block; }
  .nt-card h3 { margin-top: 12px; font-size: clamp(15.5px, 1.2vw, 21px); line-height: 1.45; font-weight: 700; color: var(--heading, #111316); }
  .nt-card h3 a:hover, .nt-row h4 a:hover, .nt-hlead h3 a:hover { color: var(--brand-dark, #ca9700); }
  .nt-card p, .nt-hlead p { margin: 8px 0 0; font-size: clamp(13.5px, 1vw, 16px); line-height: 1.65; color: #5b6168; }
  .nt-cards-2 { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(14px, 1.4vw, 28px); }

  .nt-row { display: grid; grid-template-columns: clamp(92px, 8vw, 150px) 1fr; gap: 14px; align-items: start; padding: 12px 0; border-top: 1px solid #eceef1; }
  .nt-row-img { display: block; aspect-ratio: 4 / 3; overflow: hidden; }
  .nt-row-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
  .nt-row h4 { font-size: clamp(14px, 1.05vw, 18px); line-height: 1.45; font-weight: 700; color: var(--heading, #111316); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
  .nt-grid2 { display: grid; grid-template-columns: 1fr 1fr; column-gap: clamp(16px, 1.8vw, 36px); margin-top: 8px; }
  .nt-grid2 .nt-row { grid-template-columns: clamp(76px, 6vw, 110px) 1fr; }

  .nt-hlead { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(14px, 1.4vw, 28px); align-items: start; }
  .nt-hlead-img { display: block; aspect-ratio: 4 / 3; overflow: hidden; }
  .nt-hlead-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
  .nt-hlead h3 { font-size: clamp(15.5px, 1.2vw, 21px); line-height: 1.45; font-weight: 700; color: var(--heading, #111316); }

  .nt-ad { text-align: center; } .nt-ad img { max-width: 100%; height: auto; }

  /* ---- breaking ticker (fixed to the bottom) ---- */
  .nt-ticker { position: fixed; z-index: 900; left: 0; right: 0; bottom: 0; height: 46px; display: flex; align-items: stretch; background: #d11a2a; color: #fff; box-shadow: 0 -2px 10px rgba(0,0,0,.18); }
  .nt-clock { flex: none; display: grid; place-items: center; min-width: 76px; padding: 0 12px; background: #fff; color: #111316; font-size: 22px; font-weight: 800; letter-spacing: .5px; }
  .nt-ticker-view { flex: 1; overflow: hidden; display: flex; align-items: center; }
  .nt-ticker-track { display: flex; width: max-content; animation: ntTicker 70s linear infinite; }
  .nt-ticker-view:hover .nt-ticker-track { animation-play-state: paused; }
  .nt-ticker-set { display: flex; align-items: center; }
  .nt-ticker-set a { color: #fff; font-size: clamp(16px, 1.2vw, 21px); font-weight: 700; white-space: nowrap; padding: 0 46px 0 0; }
  .nt-ticker-set a::before { content: "\2022"; margin-right: 46px; opacity: .8; }
  @keyframes ntTicker { to { transform: translateX(-50%); } }
  @media (prefers-reduced-motion: reduce) { .nt-ticker-track { animation: none; } }
}

/* ---- tablets / small laptops (821–1099px): 2-up grids so nothing gets cramped ---- */
@media (min-width: 821px) and (max-width: 1099px) {
  .nt-top3 { grid-template-columns: 1fr 1fr; }
  .nt-c-latest { grid-column: 1 / -1; }
  .nt-ov-tall { height: calc(var(--nt-h) * .7); }
  .nt-ov-half { height: calc((var(--nt-h) * .7 - var(--nt-gap)) / 2); }
  .nt-cols3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nt-cols3 .nt-col:nth-child(3) { grid-column: 1 / -1; }
  .nt-hlead { grid-template-columns: 1fr; }
}

/* ---- laptops (1100–1399px): keep rows/cards compact ---- */
@media (min-width: 1100px) and (max-width: 1399px) {
  .nt-hlead { grid-template-columns: 1fr; }
  .nt-grid2 { grid-template-columns: 1fr; }
}

/* ---- very large monitors: more breathing room, 4-up wide rows ---- */
@media (min-width: 1900px) {
  .nt-cols2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nt-cols3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* ---- new header: full width too ---- */
@media (min-width: 1024px) {
  .tp-header, .tp-trending, .tp-ad.nt-mobile-only { display: none !important; }

  .nt-bar { display: block; background: #000; color: #fff; font-family: var(--f-ui, inherit); }
  .nt-bar .nt-wrap { display: flex; align-items: center; gap: 28px; min-height: 44px; }
  .nt-bar-date { font-size: clamp(13px, .95vw, 15px); font-weight: 600; white-space: nowrap; }
  .nt-bar-links { display: flex; flex-wrap: wrap; align-items: center; list-style: none; margin: 0 0 0 auto; padding: 0; row-gap: 6px; }
  .nt-bar-links li + li { border-left: 1px solid rgba(255,255,255,.55); margin-left: 12px; padding-left: 12px; }
  .nt-bar-links a { color: #fff; font-size: clamp(13px, .95vw, 15px); line-height: 1; white-space: nowrap; }
  .nt-bar-links a:hover { color: var(--brand, #e11d2e); }
  .nt-bar-social { display: flex; align-items: center; }

  .nt-brand { display: block; background: #fff; padding: clamp(12px, 1.3vw, 24px) 0; }
  .nt-brand .nt-wrap { display: flex; align-items: center; justify-content: space-between; gap: 30px; }
  .nt-logo img { height: clamp(70px, 6.4vw, 120px); width: auto; display: block; }
  .nt-brand-ad { flex: 1 1 auto; min-width: 0; overflow: hidden; }
  .nt-brand-ad img { width: 100%; height: auto; max-height: clamp(84px, 8.2vw, 150px); object-fit: fill; display: block; margin-left: auto; border-radius: 6px; }

  .tp-nav .tp-menu > li > a { font-size: clamp(14.5px, 1.1vw, 18px); font-weight: 700; }
  /* nav bar spans the full width as well */
  .tp-nav .wrap { max-width: none; padding-inline: var(--nt-pad, 24px); }
}

/* footer + bottom bar follow the same full width */
@media (min-width: 821px) {
  .site-footer .wrap, .footer-bottom .wrap { max-width: none; padding-inline: var(--nt-pad); }
}

/* ---- Live YouTube box (home) ---- */
.live-yt { background: #0e1013; border-radius: 8px; overflow: hidden; box-shadow: 0 8px 22px -12px rgba(0,0,0,.5); }
.live-yt-frame { position: relative; aspect-ratio: 16 / 9; background: #000; }
.live-yt-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.live-yt-bar { display: flex; align-items: center; gap: 12px; padding: 10px 14px; font-family: var(--f-ui, inherit); }
.live-yt-dot { padding: 3px 9px; border-radius: 4px; background: #d11a2a; color: #fff; font-size: 11px; font-weight: 800; letter-spacing: .6px; }
.live-yt-bar a { color: #fff; font-size: 13.5px; font-weight: 600; text-decoration: none; }
.live-yt-bar a:hover { color: #e11d2e; }
.live-yt-bar .live-yt-sub { margin-left: auto; padding: 6px 14px; border-radius: 999px; background: #e11d2e; color: #111316; font-weight: 800; }
.live-yt-bar .live-yt-sub:hover { background: #ff5c6c; color: #111316; }
@media (min-width: 821px) { .nt-mobile-only { display: none !important; } }
.live-yt-list { list-style: none; margin: 0; padding: 4px 10px 10px; display: grid; gap: 8px; }
.live-yt-list a { display: grid; grid-template-columns: 112px 1fr; gap: 12px; align-items: center; color: #e6eaf0; text-decoration: none; font-size: 13.5px; line-height: 1.4; font-weight: 600; }
.live-yt-list a:hover { color: #e11d2e; }
.live-yt-list img { width: 112px; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 4px; background: #222; }
.live-yt-list span { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* Live TV page: full width, bigger player */
.wrap-full { max-width: none !important; padding-inline: clamp(16px, 2.6vw, 72px) !important; }
.livetv-grid { grid-template-columns: minmax(0, 1fr) clamp(300px, 24vw, 460px); gap: clamp(20px, 2.4vw, 48px); }
@media (max-width: 1000px) { .livetv-grid { grid-template-columns: 1fr; } }

/* Live TV: the "Latest Videos" list fills the full height of the player column (no empty space) and scrolls inside */
.livetv-grid > aside .widget-body { scrollbar-width: thin; scrollbar-color: #c9ced6 transparent; }
@media (min-width: 1001px) {
  .livetv-grid { align-items: stretch; }
  .livetv-grid > aside { position: relative; min-height: 420px; }
  .livetv-grid > aside .widget { position: absolute; inset: 0; display: flex; flex-direction: column; margin: 0; }
  .livetv-grid > aside .widget-body { flex: 1; min-height: 0; overflow-y: auto; }
}
@media (max-width: 1000px) { .livetv-grid > aside .widget-body { max-height: 560px; overflow-y: auto; } }

/* ---- Front video band: big player + scrolling list of latest videos ---- */
.nt-video-band { margin-bottom: clamp(26px, 3vw, 56px); }
.live-yt.band { display: grid; grid-template-columns: minmax(0, 2.2fr) minmax(280px, 1fr); grid-template-areas: "frame list" "bar list"; align-items: stretch; }
.live-yt.band .live-yt-frame { grid-area: frame; }
.live-yt.band .live-yt-bar { grid-area: bar; }
.live-yt.band .live-yt-list { grid-area: list; padding: 12px 14px; gap: 10px; overflow-y: auto; max-height: 0; min-height: 100%; align-content: start; border-left: 1px solid rgba(255,255,255,.08); }
.live-yt.band .live-yt-list li { min-width: 0; }
@media (max-width: 1100px) {
  .live-yt.band { grid-template-columns: 1fr; grid-template-areas: "frame" "bar" "list"; }
  .live-yt.band .live-yt-list { max-height: none; min-height: 0; border-left: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.live-yt-list a { cursor: pointer; }

/* ---- All-category blocks: balanced columns, nothing left empty ---- */
.nt-masonry { column-count: 3; column-gap: var(--nt-gap); }
.nt-masonry > .nt-sec { break-inside: avoid; display: inline-block; width: 100%; margin: 0 0 clamp(24px, 2.4vw, 44px); }
@media (max-width: 1099px) { .nt-masonry { column-count: 2; } }
@media (min-width: 1750px) { .nt-masonry { column-count: 4; } }

/* Mobile / tablet header: red "LIVE" YouTube button next to the e-paper button */
.tp-yt { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 11px; border-radius: 10px; background: #d11a2a; color: #fff; font: 800 12.5px/1 var(--f-ui, inherit); letter-spacing: .4px; text-decoration: none; box-shadow: 0 4px 10px -3px rgba(209,26,42,.6); }
.tp-yt svg { width: 20px; height: 20px; fill: #fff; flex: none; }
.tp-yt:hover { background: #e32636; color: #fff; }
.tp-yt span { animation: tpYtPulse 1.6s ease-in-out infinite; }
@keyframes tpYtPulse { 50% { opacity: .55; } }
@media (prefers-reduced-motion: reduce) { .tp-yt span { animation: none; } }
@media (max-width: 380px) { .tp-yt span { display: none; } .tp-yt { padding: 0 8px; } }

/* Level columns: a category block may continue in the next column between rows (no big empty gaps at the bottom) */
.nt-masonry > .nt-sec { break-inside: auto; display: block; }
.nt-masonry .nt-head, .nt-masonry .nt-card, .nt-masonry .nt-row, .nt-masonry .nt-ad { break-inside: avoid; }
.nt-masonry .nt-head { break-after: avoid; }
.nt-masonry .nt-card { break-after: avoid; }
.nt-ad img { max-height: 440px; width: auto; max-width: 100%; object-fit: contain; display: block; margin: 0 auto; border-radius: 6px; }

/* ---- Live visitors ---- */
.vis-dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: #22c55e; box-shadow: 0 0 0 0 rgba(34,197,94,.7); animation: visPulse 1.8s infinite; flex: none; }
@keyframes visPulse { 70% { box-shadow: 0 0 0 8px rgba(34,197,94,0); } 100% { box-shadow: 0 0 0 0 rgba(34,197,94,0); } }
.vis-pill { display: inline-flex; align-items: center; gap: 7px; padding: 4px 12px; border-radius: 999px; background: rgba(255,255,255,.1); font-size: clamp(12.5px, .9vw, 14.5px); font-weight: 600; white-space: nowrap; }
.vis-pill b { color: #ff5c6c; font-weight: 800; }
.pro-footer .pf-visitors { display: flex; flex-wrap: wrap; gap: 12px clamp(20px, 3vw, 56px); padding-block: 22px; border-top: 1px solid rgba(255,255,255,.09); }
.pro-footer .pfv { display: inline-flex; align-items: center; gap: 10px; }
.pro-footer .pfv b { font-size: clamp(20px, 1.8vw, 30px); color: #ff5c6c; font-weight: 800; line-height: 1; }
.pro-footer .pfv small { font-size: clamp(13.5px, 1vw, 16px); color: #aab2bd; }
@media (prefers-reduced-motion: reduce) { .vis-dot { animation: none; } }

/* smaller unbreakable pieces → columns finish almost level */
.nt-masonry .nt-card-img { aspect-ratio: 16 / 9; }
.nt-masonry .nt-ad img { max-height: 340px; }

/* header banner (hi-res DTPR 2170x395, ~5.5:1): show at natural proportions, centred in the free width */
@media (min-width: 1024px) {
  .nt-brand-ad img { width: 100%; height: auto; max-height: clamp(96px, 11vw, 190px); object-fit: contain; margin-inline: auto; }
}

/* ads fill the whole column width (no side margins, no height cap) */
.nt-ad, .nt-ad .ad-slider, .nt-ad .ad-slide, .nt-ad a { display: block; width: 100%; }
.nt-ad img, .nt-masonry .nt-ad img { width: 100% !important; max-width: 100% !important; height: auto !important; max-height: none !important; object-fit: cover; border-radius: 8px; }

/* ===== Fixed ad size: every home ad is the same full-width 3:4 box (rotating creatives never change the layout) ===== */
.nt-masonry .nt-ad { position: relative; display: block; width: 100%; aspect-ratio: 3 / 4; overflow: hidden; border-radius: 8px; background: #eef0f3; }
.nt-masonry .nt-ad .ad-slider { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.nt-masonry .nt-ad .ad-slide { position: absolute; inset: 0; width: 100%; height: 100%; }
.nt-masonry .nt-ad a, .nt-masonry .nt-ad .ad-slide > a { display: block; width: 100%; height: 100%; }
.nt-masonry .nt-ad img { width: 100% !important; height: 100% !important; max-width: none !important; max-height: none !important; object-fit: cover !important; object-position: center top; margin: 0 !important; border-radius: 0 !important; display: block; }

/* ===== JS-packed masonry (shortest column first) + extra section styles ===== */
.nt-masonry.packed { column-count: auto; display: flex; align-items: flex-start; gap: calc(var(--nt-gap) * .8); }
.nt-masonry.packed > .nt-col-p { flex: 1 1 0; min-width: 0; }
.nt-masonry.packed .nt-sec { display: block; width: 100%; margin: 0 0 clamp(22px, 2.2vw, 40px); }
.nt-masonry.packed .nt-col-p > .nt-sec:last-child { margin-bottom: 0; }

/* style B — feature */
.nt-s-feature .nt-ov-feat { height: auto; aspect-ratio: 16 / 10; margin-bottom: 8px; border-radius: 8px; }
.nt-s-feature .nt-ov-feat .nt-ov-txt b { font-size: clamp(17px, 1.3vw, 23px); -webkit-line-clamp: 3; }
/* style C — ranked list */
.nt-rank { list-style: none; margin: 0; padding: 0; counter-reset: rk; }
.nt-rank li { display: grid; grid-template-columns: clamp(34px, 2.8vw, 48px) 1fr; gap: 12px; padding: 12px 0; border-top: 1px solid #eceef1; align-items: start; }
.nt-rank li:first-child { border-top: 0; padding-top: 0; }
.nt-rank .rk { font-size: clamp(30px, 2.8vw, 46px); line-height: .95; font-weight: 800; color: transparent; -webkit-text-stroke: 1.6px var(--brand, #e11d2e); font-family: var(--f-ui, inherit); }
.nt-rank li.lead .rk { -webkit-text-stroke-color: #111316; }
.nt-rank h4 { font-size: clamp(14.5px, 1.1vw, 18px); line-height: 1.45; font-weight: 700; color: var(--heading, #111316); }
.nt-rank h4 a:hover { color: var(--brand-dark, #ca9700); }
.nt-rank li.lead h4 { font-size: clamp(16px, 1.25vw, 21px); margin-top: 10px; }
.nt-rank .rk-img { display: block; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 8px; }
.nt-rank .rk-img img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* extra rows: hidden until the packer reveals them to level a short column */
.nt-masonry .extra { display: none !important; }
.nt-masonry .extra.show { display: grid !important; }

/* ===== Social icons: real brand colours (YouTube red, Facebook blue, X black, Instagram gradient, WhatsApp green) ===== */
.dyn-follow .fl, .nt-bar-social .dyn-follow .fl, .site-footer .dyn-follow .fl, .pro-footer .foot-follow a.fl { transition: transform .15s ease, filter .15s ease, box-shadow .15s ease; }
.dyn-follow .fl.fl-yt, .pro-footer .foot-follow a.fl.fl-yt { background: #ff0000; }
.dyn-follow .fl.fl-fb, .pro-footer .foot-follow a.fl.fl-fb { background: #1877f2; }
.dyn-follow .fl.fl-x,  .pro-footer .foot-follow a.fl.fl-x  { background: #000; box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.55); }
.dyn-follow .fl.fl-ig, .pro-footer .foot-follow a.fl.fl-ig { background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%); }
.dyn-follow .fl.fl-wa, .pro-footer .foot-follow a.fl.fl-wa { background: #25d366; }
.dyn-follow .fl:hover, .pro-footer .foot-follow a.fl:hover, .site-footer .dyn-follow .fl:hover { filter: brightness(1.12); transform: translateY(-2px); }
.dyn-follow .fl svg, .pro-footer .foot-follow a.fl svg { fill: #fff; }
.dyn-follow .fl.fl-ig svg g, .dyn-follow .fl.fl-ig svg rect, .dyn-follow .fl.fl-ig svg circle { stroke: #fff; }
.pro-footer .foot-follow a.fl:hover svg { fill: #fff; }
/* a touch larger in the desktop top bar so the logos read clearly */
.nt-bar-social .dyn-follow.sm { gap: 9px; }
.nt-bar-social .dyn-follow.sm .fl { width: 30px; height: 30px; }
.nt-bar-social .dyn-follow.sm .fl svg { width: 16px; height: 16px; }

/* front video band: list always fills the player's height — more videos + even spacing, no empty area at the bottom */
@media (min-width: 1101px) {
  .live-yt.band .live-yt-list { display: flex; flex-direction: column; justify-content: space-between; gap: 10px; }
  .live-yt.band .live-yt-list li { flex: 0 0 auto; }
}

/* ---- Web Stories rail above the footer (desktop): full width, 9:16 cards fill the row ---- */
@media (min-width: 821px) {
  .nt-stories { padding-block: 8px clamp(24px, 3vw, 44px); background: #fff; }
  .nt-stories .wrap { max-width: none; padding-inline: 0; }
  .nt-stories .n18-head h2 { font-size: clamp(18px, 1.5vw, 26px); font-weight: 800; }
  .nt-stories .vs-rail { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 5 * 16px) / 6); gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; padding-bottom: 6px; }
  .nt-stories .vs-card { scroll-snap-align: start; aspect-ratio: 9 / 16; width: auto; min-width: 0; border-radius: 12px; overflow: hidden; }
  .nt-stories .vs-card img { width: 100%; height: 100%; object-fit: cover; }
}
@media (min-width: 1500px) { .nt-stories .vs-rail { grid-auto-columns: calc((100% - 7 * 16px) / 8); } }

/* banner just above the footer: full width, no side gaps */
@media (min-width: 821px) {
  .tp-ad-prefooter, .tp-ad.tp-ad-prefooter { max-width: none; width: 100%; padding-inline: 0; background: transparent; }
  .tp-ad-prefooter img { width: 100% !important; max-width: 100% !important; height: auto !important; max-height: clamp(110px, 12vw, 220px); object-fit: contain; display: block; margin: 0 auto; }
}

/* equal column ends: leftover height is spread as even gaps between a column's blocks */
.nt-masonry.packed > .nt-col-p { display: flex; flex-direction: column; justify-content: space-between; }
.nt-masonry.packed > .nt-col-p > .nt-sec { flex: 0 0 auto; }

/* ---- Trending Stories: posts keep scrolling upward (pauses on hover) ---- */
.nt-c-trend { --half: calc((var(--nt-h) - var(--nt-gap)) / 2); }
.nt-trend-view { position: relative; height: calc(var(--half) * 2 + var(--nt-gap)); overflow: hidden; -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 22px, #000 calc(100% - 22px), transparent 100%); mask-image: linear-gradient(to bottom, transparent 0, #000 22px, #000 calc(100% - 22px), transparent 100%); }
.nt-trend-track { display: flex; flex-direction: column; animation: ntTrendUp calc(var(--n) * 6s) linear infinite; will-change: transform; }
.nt-trend-view:hover .nt-trend-track { animation-play-state: paused; }
.nt-trend-set { display: flex; flex-direction: column; gap: var(--nt-gap); padding-bottom: var(--nt-gap); }
.nt-trend-set .nt-ov-half { height: var(--half); margin: 0; flex: 0 0 auto; }
@keyframes ntTrendUp { to { transform: translateY(-50%); } }
@media (min-width: 821px) and (max-width: 1099px) { .nt-c-trend { --half: calc((var(--nt-h) * .7 - var(--nt-gap)) / 2); } }
@media (prefers-reduced-motion: reduce) { .nt-trend-track { animation: none; } .nt-trend-view { overflow-y: auto; -webkit-mask-image: none; mask-image: none; } .nt-trend-set[aria-hidden] { display: none; } }

/* ===== Trending Stories v2: dark ranked ticker that keeps scrolling up ===== */
.nt-trend-view { height: var(--nt-h); background: #0e1013; border-radius: 12px; padding: 0 12px; box-shadow: 0 10px 26px -16px rgba(0,0,0,.6); -webkit-mask-image: none; mask-image: none; }
.nt-trend-view::before, .nt-trend-view::after { content: ""; position: absolute; left: 0; right: 0; height: 26px; z-index: 2; pointer-events: none; }
.nt-trend-view::before { top: 0; background: linear-gradient(#0e1013, rgba(14,16,19,0)); }
.nt-trend-view::after { bottom: 0; background: linear-gradient(rgba(14,16,19,0), #0e1013); }
.nt-trend-set { gap: 0; padding: 8px 0 0; }
.nt-tr-item { display: grid; grid-template-columns: 30px clamp(78px, 6.6vw, 112px) minmax(0, 1fr); gap: 12px; align-items: center; padding: 11px 0; border-bottom: 1px solid rgba(255,255,255,.09); color: #fff; text-decoration: none; }
.nt-tr-item:hover .nt-tr-txt b { color: #ff5c6c; }
.nt-tr-rank { font-size: clamp(26px, 2.2vw, 36px); line-height: 1; font-weight: 800; color: transparent; -webkit-text-stroke: 1.5px #e11d2e; text-align: center; font-family: var(--f-ui, inherit); }
.nt-tr-img { display: block; aspect-ratio: 4 / 3; border-radius: 8px; overflow: hidden; background: #1c1f26; }
.nt-tr-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s; }
.nt-tr-item:hover .nt-tr-img img { transform: scale(1.06); }
.nt-tr-txt { min-width: 0; }
.nt-tr-txt b { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; font-size: clamp(13.5px, 1vw, 16px); line-height: 1.45; font-weight: 700; transition: color .15s; }
.nt-tr-txt small { display: block; margin-top: 5px; font-size: clamp(11.5px, .8vw, 13px); color: #98a1ad; }
.nt-tr-txt em { font-style: normal; color: #e11d2e; font-weight: 700; margin-right: 8px; }
.nt-tr-txt em::after { content: "·"; margin-left: 8px; color: #6b7480; }
.nt-home .nt-tr-item { color: #fff; }
.nt-home .nt-tr-item:hover .nt-tr-txt b { color: #ff5c6c; }


/* homepage: full-width video band; live cricket sits under the advertisement in the first masonry column */
.nt-body { display: block; margin-bottom: clamp(24px, 2.6vw, 40px); }
.nt-body .live-yt.band .live-yt-frame { aspect-ratio: auto; height: clamp(360px, 33vw, 560px); }
.nt-stack { display: block; }
.nt-stack > .nt-sec { margin-bottom: clamp(20px, 2vw, 32px); }
.live-cricket { display: flex; flex-direction: column; }
.live-cricket-frame { position: relative; height: 500px; border-radius: 8px; overflow: hidden; background: transparent; }
.live-cricket-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; display: block; }
/* sports & cricket strip (under the video + cricket row) */
.nt-body.has-strip { margin-bottom: clamp(24px, 2.6vw, 40px); }
.nt-sports-strip { margin-bottom: clamp(30px, 3.4vw, 60px); }
.nt-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--nt-gap); }
.nt-strip-card { min-width: 0; }
.nt-strip-img { position: relative; display: block; aspect-ratio: 16 / 10; overflow: hidden; border-radius: 8px; background: #14171c; }
.nt-strip-img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.nt-strip-card:hover .nt-strip-img img { transform: scale(1.04); }
.nt-strip-card h3 { margin: 12px 0 0; font-size: clamp(15px, 1.05vw, 19px); line-height: 1.45; font-weight: 700; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.nt-strip-card h3 a { color: var(--heading, #111316); }
.nt-strip-card h3 a:hover { color: var(--brand-dark, #ca9700); }
@media (min-width: 821px) and (max-width: 1099px) { .nt-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* breaking-news ticker is on every page: keep the footer clear of it (desktop) */
@media (min-width: 821px) { body:has(.nt-ticker) { padding-bottom: 46px; } }