/* Times of Rising v1.6.2 — VISHNITA UI: focused Latest Stories responsive layout.
 * The feed is deliberately independent of generic card-grid rules so legacy media
 * queries cannot force oversized thumbnails or misaligned card bodies on phones.
 */
.tor-home-main .tor-latest-section { min-width: 0; }
.tor-home-main .tor-latest-section .tor-section-heading { align-items: flex-end; gap: 12px; }
.tor-home-main .tor-latest-section .tor-section-heading h2 { text-wrap: balance; }
.tor-home-main .tor-latest-section .tor-latest-grid > * { min-width: 0; }

/* Headline is the primary hierarchy; reserve the accent for labels and interaction. */
.tor-home-main .tor-latest-section .tor-latest-grid .tor-card-title a {
  color: var(--tor-heading-color, var(--tor-ink, #142b3a));
  transition: color .18s ease;
}
.tor-home-main .tor-latest-section .tor-latest-grid .tor-card-title a:hover,
.tor-home-main .tor-latest-section .tor-latest-grid .tor-card-title a:focus-visible {
  color: var(--tor-accent-dark, #a84223);
}

/* Small tablets: retain the image-led magazine card grid rather than stretching
   two-column list rows across an entire landscape tablet screen. */
@media (min-width: 601px) and (max-width: 700px) {
  .tor-home-main .tor-latest-section .tor-latest-grid:not(.tor-latest-layout-compact) {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: stretch;
    gap: 15px !important;
    border: 0;
    border-radius: 0;
    padding: 0;
    background: transparent;
  }
  .tor-home-main .tor-latest-section .tor-latest-grid:not(.tor-latest-layout-compact) > .tor-card {
    display: flex !important;
    flex-direction: column;
    gap: 0 !important;
    min-height: 0;
    padding: 0 !important;
    border: 1px solid var(--tor-line, #dfe6eb) !important;
    border-radius: var(--tor-card-radius, 12px) !important;
    background: var(--tor-surface, #fff) !important;
    box-shadow: var(--tor-card-shadow, 0 5px 22px rgba(20,43,58,.045)) !important;
    overflow: hidden !important;
  }
  .tor-home-main .tor-latest-section .tor-latest-grid:not(.tor-latest-layout-compact) > .tor-card .tor-card-media {
    width: 100%; height: auto !important; min-height: 0 !important; aspect-ratio: 16 / 10 !important; border-radius: 0;
  }
  .tor-home-main .tor-latest-section .tor-latest-grid:not(.tor-latest-layout-compact) > .tor-card .tor-card-media img,
  .tor-home-main .tor-latest-section .tor-latest-grid:not(.tor-latest-layout-compact) > .tor-card .tor-image-fallback {
    width: 100%; height: 100%; min-height: 0 !important; aspect-ratio: auto !important;
  }
  .tor-home-main .tor-latest-section .tor-latest-grid:not(.tor-latest-layout-compact) > .tor-card .tor-card-body { padding: 13px !important; }
  .tor-home-main .tor-latest-section .tor-latest-grid:not(.tor-latest-layout-compact) > .tor-card .tor-card-title { margin: 5px 0 7px !important; font-size: 17px !important; line-height: 1.28; }
  .tor-home-main .tor-latest-section .tor-latest-grid:not(.tor-latest-layout-compact) > .tor-ad-slot,
  .tor-home-main .tor-latest-section .tor-latest-grid:not(.tor-latest-layout-compact) > .tor-sponsored-placement { grid-column: 1 / -1; width: 100% !important; max-width: 100% !important; margin: 10px 0 !important; }
}

/* Phones: a restrained editorial list with a fixed, compact thumbnail and a
   content-first text panel. No tall image placeholders, stretched card bodies,
   floating text, or inconsistent boxes between stories. */
@media (max-width: 600px) {
  .tor-home-main .tor-latest-section .tor-section-heading { margin-bottom: 12px; padding-bottom: 13px; gap: 8px; }
  .tor-home-main .tor-latest-section .tor-section-heading h2 { font-size: clamp(23px, 6.4vw, 28px); line-height: 1.08; }
  .tor-home-main .tor-latest-section .tor-section-heading > .tor-text-link { gap: 5px; font-size: 10px; white-space: nowrap; }
  .tor-home-main .tor-latest-section .tor-section-heading > .tor-text-link > span { width: 19px; height: 19px; font-size: 11px; }

  .tor-home-main .tor-latest-section .tor-latest-grid,
  .tor-home-main .tor-latest-section .tor-latest-grid.tor-latest-layout-compact {
    display: flex !important;
    flex-direction: column;
    gap: 0 !important;
    padding: 0 12px;
    border: 1px solid var(--tor-line, #dfe6eb);
    border-radius: 11px;
    background: var(--tor-surface, #fff);
    overflow: visible;
  }
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card {
    display: grid !important;
    grid-template-columns: 86px minmax(0, 1fr) !important;
    grid-template-rows: minmax(0, 1fr);
    align-items: center;
    gap: 12px !important;
    width: 100%; min-width: 0; min-height: 0;
    margin: 0 !important; padding: 12px 0 !important;
    border: 0 !important;
    border-bottom: 1px solid var(--tor-line, #e6ebed) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
    transform: none !important;
  }
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card:last-of-type { border-bottom: 0 !important; }
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card:hover,
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card:focus-within { transform: none !important; box-shadow: none !important; }

  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card .tor-card-media {
    grid-column: 1; grid-row: 1; align-self: center;
    display: block; width: 86px; height: auto !important; min-height: 0 !important;
    aspect-ratio: 1.12 !important; border-radius: 7px; overflow: hidden;
    background: #e8eef0;
  }
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card .tor-card-media img,
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card .tor-image-fallback {
    display: block; width: 100%; height: 100%; min-height: 0 !important;
    aspect-ratio: auto !important; object-fit: cover; border-radius: inherit;
  }
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card .tor-image-fallback {
    display: grid; place-items: center;
    background: linear-gradient(145deg, #eef3f5 0%, #dfe9ee 100%);
  }
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card .tor-image-fallback-mark {
    width: 30px; height: 30px; border-color: rgba(38,75,87,.17);
  }
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card .tor-image-fallback-mark::before {
    top: 7px; left: 7px; width: 14px; height: 14px; border-width: 1.5px;
  }
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card .tor-image-fallback-mark::after {
    top: 14px; left: 3px; width: 24px; height: 1.5px;
  }

  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card .tor-card-body {
    grid-column: 2; grid-row: 1; align-self: center;
    display: flex; flex-direction: column; align-items: flex-start; justify-content: center;
    width: 100%; min-width: 0; min-height: 0; padding: 0 !important;
    background: transparent !important; overflow: hidden;
  }
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card .tor-sponsored-badge {
    display: inline-flex; align-items: center; max-width: 100%; margin: 0 0 4px;
    padding: 3px 6px; border-radius: 4px; font-size: 8px; line-height: 1.2;
  }
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card .tor-eyebrow {
    display: block; max-width: 100%; margin: 0; font-size: 8.5px; line-height: 1.25;
    letter-spacing: .075em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card .tor-card-title {
    width: 100%; max-width: 100%; margin: 4px 0 0 !important; padding: 0;
    font-size: 15px !important; font-weight: 760; line-height: 1.29; letter-spacing: -.018em;
    overflow-wrap: break-word; word-break: normal; hyphens: auto;
  }
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card .tor-card-title a {
    display: -webkit-box; max-width: 100%; max-height: 3.87em; overflow: hidden;
    -webkit-box-orient: vertical; -webkit-line-clamp: 3;
    line-height: inherit; overflow-wrap: break-word; word-break: normal; hyphens: auto;
  }
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card .tor-card-excerpt { display: none !important; }
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card .tor-card-meta,
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card .tor-meta {
    display: flex; flex-wrap: wrap; align-items: center; gap: 3px 5px;
    width: 100%; margin: 0 !important; padding: 5px 0 0 !important;
    border: 0 !important; font-size: 9px !important; line-height: 1.25;
    letter-spacing: 0; overflow-wrap: anywhere;
  }
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card .tor-meta-dot { font-size: 11px; line-height: 1; }

  /* Promotional units are full-width interruptions, never squeezed into one card column. */
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-ad-slot,
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-sponsored-placement {
    display: block; flex: 0 0 auto; grid-column: auto; align-self: stretch;
    width: 100% !important; max-width: 100% !important;
    margin: 12px 0 !important; box-sizing: border-box;
  }
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-ad-slot { padding: 10px 8px; }
}

@media (max-width: 380px) {
  .tor-home-main .tor-latest-section .tor-section-heading h2 { font-size: 23px; }
  .tor-home-main .tor-latest-section .tor-section-heading > .tor-text-link { font-size: 9px; }
  .tor-home-main .tor-latest-section .tor-latest-grid,
  .tor-home-main .tor-latest-section .tor-latest-grid.tor-latest-layout-compact { padding-inline: 9px; }
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card { grid-template-columns: 76px minmax(0, 1fr) !important; gap: 10px !important; padding: 10px 0 !important; }
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card .tor-card-media { width: 76px; border-radius: 6px; }
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card .tor-card-title { font-size: 14px !important; line-height: 1.27; }
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card .tor-card-meta,
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card .tor-meta { font-size: 8.5px !important; }
}

@media (prefers-reduced-motion: reduce) {
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card,
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card .tor-card-media img { transition: none !important; }
}


/* v1.6.3 responsive editorial refinement: scoped to the homepage feed so
   category cards and article recommendations remain unaffected. */
.tor-home-main .tor-latest-section {
  width: 100%;
  min-width: 0;
  container-type: inline-size;
}
.tor-home-main .tor-latest-section .tor-section-heading > div { min-width: 0; }
.tor-home-main .tor-latest-section .tor-section-heading h2 {
  max-width: 100%;
  overflow-wrap: anywhere;
}
.tor-home-main .tor-latest-section .tor-latest-grid {
  box-sizing: border-box;
  width: 100%;
}
.tor-home-main .tor-latest-section .tor-latest-grid > .tor-card {
  box-sizing: border-box;
}
.tor-home-main .tor-latest-section .tor-latest-grid > .tor-card .tor-card-title a {
  text-decoration-thickness: .06em;
  text-underline-offset: .13em;
}
@container (max-width: 560px) {
  .tor-home-main .tor-latest-section .tor-latest-grid:not(.tor-latest-layout-compact) {
    display: flex !important;
    flex-direction: column;
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .tor-home-main .tor-latest-section .tor-latest-grid:not(.tor-latest-layout-compact) > .tor-card {
    grid-template-columns: 82px minmax(0, 1fr) !important;
  }
}
@media (max-width: 600px) {
  .tor-home-main .tor-latest-section .tor-section-heading {
    align-items: flex-end;
    margin-bottom: 12px;
    padding-bottom: 12px;
  }
  .tor-home-main .tor-latest-section .tor-section-heading .tor-section-kicker {
    display: block;
    margin-bottom: 5px;
    font-size: 9px;
    line-height: 1.25;
    letter-spacing: .12em;
  }
  .tor-home-main .tor-latest-section .tor-section-heading h2 {
    font-size: clamp(22px, 6vw, 27px);
    line-height: 1.12;
  }
  .tor-home-main .tor-latest-section .tor-section-heading > .tor-text-link {
    flex: 0 0 auto;
    align-self: flex-end;
    padding-bottom: 2px;
  }
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card .tor-card-body {
    justify-content: flex-start;
  }
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card .tor-card-title {
    font-size: clamp(14px, 3.9vw, 15.5px) !important;
    line-height: 1.3;
    letter-spacing: -.012em;
  }
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card .tor-eyebrow {
    font-size: 8.5px;
    letter-spacing: .06em;
  }
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card .tor-card-meta,
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card .tor-meta {
    font-size: 9px !important;
  }
}
@media (max-width: 359px) {
  .tor-home-main .tor-latest-section .tor-latest-grid,
  .tor-home-main .tor-latest-section .tor-latest-grid.tor-latest-layout-compact {
    padding-inline: 8px;
  }
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card {
    grid-template-columns: 72px minmax(0, 1fr) !important;
    gap: 9px !important;
  }
  .tor-home-main .tor-latest-section .tor-latest-grid > .tor-card .tor-card-media {
    width: 72px;
    border-radius: 6px;
  }
  .tor-home-main .tor-latest-section .tor-section-heading h2 { font-size: 22px; }
  .tor-home-main .tor-latest-section .tor-section-heading > .tor-text-link { font-size: 9px; }
}
