/* Homepage layout alignment (desktop). Loaded last, homepage only (everything is scoped to .csru-home).
   One shell width for the hero, the three-column area (left ad rail + content + right ad rail) and the full-width sections,
   so their left and right edges line up; ad slots keep a reserved height so the page does not jump while ads load. */

@media (min-width: 992px) {
  /* the three-column area uses the SAME shell as the hero and the full-width sections (was 1540px with 15px padding: edges 30-45px off) */
  html body .csru-home .csru-home-rail-container.csru-home-rail-container {
    max-width: var(--ui-container, 1600px) !important;
    width: calc(100% - 48px) !important;
    padding: 0 !important;
    gap: 28px !important;
  }
  /* the content column keeps all the room the rails leave over; sections inside it need no extra side padding */
  body .csru-home .csru-home-content-column .container { padding-left: 0 !important; padding-right: 0 !important; }
}

/* Reserved ad space (standard sizes): no jump when a creative loads. A slot with no ad stays hidden by the existing rules. */
.csru-home-sidebar .csru-sidebar-slot.csru-ad-format-medium { min-height: 250px; }
.csru-home-sidebar .csru-sidebar-slot.csru-ad-format-tall,
.csru-home-sidebar .csru-sidebar-slot.csru-ad-format-slim { min-height: 600px; }
.csru-home-sidebar .csru-ad-creative-wrapper { display: block; }

/* ---- Top story section (inside the rail shell, between the ad rails) ----
   Row 1: one lead story, picture left / text right.  Then four cards, two per row, picture on top (same card as every other section):
   equal heights in a row, date always at the bottom, no empty gaps.  One type scale (see the bottom of this file). */
@media (min-width: 992px) {
  body .csru-home .csru-hero .container,
  body .csru-home .csru-home-content-column .csru-hero-shell { max-width: none !important; width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; }
  body .csru-home .csru-hero { padding-top: 0 !important; margin-bottom: 8px; }
  body .csru-home .csru-hero-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; grid-auto-rows: auto !important; gap: 16px !important; align-items: stretch; }
  body .csru-home .csru-hero-card .csru-card-media { background: #fff !important; }
  body .csru-home .csru-hero-card .csru-card-image-caption { display: none !important; }
  body .csru-home .csru-hero-card .csru-card-desc:not(#ui-a) { display: none !important; }
  body .csru-home .csru-hero-card .csru-card-title:not(#ui-a) { -webkit-line-clamp: unset !important; overflow-wrap: break-word; margin: 4px 0 0 !important; }
  body .csru-home .csru-hero-card .csru-card-body { display: flex; flex-direction: column; flex: 1 1 auto; min-width: 0; padding: .85rem 1rem 1rem !important; }
  body .csru-home .csru-hero-card .csru-card-foot { margin-top: auto; padding-top: .6rem; }
  body .csru-home .csru-hero-card .csru-card-foot .csru-card-link:not(#ui-a) { display: none !important; }

  /* the four cards: vertical, same height per row */
  body .csru-home .csru-hero-card:not(.csru-hero-card-lead) { display: flex !important; flex-direction: column; }
  body .csru-home .csru-hero-card:not(.csru-hero-card-lead) .csru-card-title:not(#ui-a) { min-height: calc(3 * 1.32em) !important; }

  /* lead story: full row, picture left, text right */
  body .csru-home .csru-hero-card-lead { grid-column: 1 / -1 !important; grid-row: auto !important; display: grid !important; grid-template-columns: minmax(0, 58%) minmax(0, 1fr); align-items: stretch; }
  body .csru-home .csru-hero-card-lead .csru-card-media { grid-column: 1; grid-row: 1; align-self: start; border-radius: calc(var(--radius, 14px) - 1px) 0 0 calc(var(--radius, 14px) - 1px) !important; }
  body .csru-home .csru-hero-card-lead .csru-card-body { grid-column: 2; grid-row: 1; padding: 1.1rem 1.3rem !important; }
  body .csru-home .csru-hero-card-lead .csru-card-title:not(#ui-a) { min-height: 0 !important; margin-bottom: .55rem !important; }
  body .csru-home .csru-hero-card-lead .csru-card-desc:not(#ui-a) { display: -webkit-box !important; -webkit-line-clamp: 3 !important; margin-bottom: .5rem !important; }
  body .csru-home .csru-hero-card-lead .csru-card-foot .csru-card-link:not(#ui-a) { display: inline-flex !important; }
}
/* narrow column (rails on both sides, 992-1099px): cards one per row, lead picture on top */
@media (min-width: 992px) and (max-width: 1099px) {
  body .csru-home .csru-hero-grid { grid-template-columns: minmax(0, 1fr) !important; }
  body .csru-home .csru-hero-card-lead { grid-template-columns: minmax(0, 1fr); }
  body .csru-home .csru-hero-card-lead .csru-card-media { border-radius: calc(var(--radius, 14px) - 1px) calc(var(--radius, 14px) - 1px) 0 0 !important; }
  body .csru-home .csru-hero-card-lead .csru-card-body { grid-column: 1; grid-row: 2; }
}

/* ---- One smaller, consistent card type scale on desktop (all homepage sections): title 15px, text 13.5px, date and button 12.5px ---- */
@media (min-width: 992px) {
  body .csru-home .csru-card .csru-card-title:not(#ui-a) { font-size: 15px !important; line-height: 1.32 !important; }
  body .csru-home .csru-card .csru-card-desc:not(#ui-a) { font-size: 13.5px !important; line-height: 1.5 !important; }
  body .csru-home .csru-card .csru-card-meta:not(#ui-a),
  body .csru-home .csru-card .csru-card-link:not(#ui-a) { font-size: 12.5px !important; }
  body .csru-home .csru-card .csru-card-tags:not(#ui-a) { font-size: 11px !important; }
  body .csru-home .csru-hero-card-lead .csru-card-title:not(#ui-a) { font-size: 20px !important; line-height: 1.28 !important; }
  body .csru-home .csru-hero-card-lead .csru-card-desc:not(#ui-a) { font-size: 14px !important; }
  body .csru-home .csru-section-head h2, body .csru-home .csru-section-title { font-size: 1.5rem; }
}

/* ---- Every section between the ad rails uses the same card grid: 2 columns (3 on very wide screens, partners 3 / 4) so dates and titles are never cut ---- */
@media (min-width: 992px) {
  body .csru-home .csru-home-content-column .csru-grid-4:not(#ui-a) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 16px !important; }
  body .csru-home .csru-home-content-column .csru-grid-6:not(#ui-a) { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 16px !important; }
}
@media (min-width: 1600px) {
  body .csru-home .csru-home-content-column .csru-grid-4:not(#ui-a) { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  body .csru-home .csru-home-content-column .csru-grid-6:not(#ui-a) { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
  body .csru-home .csru-hero-grid:not(#ui-a) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

/* ---- Tidy edges and rhythm: every section between the rails starts on the same left edge as the top story, same gap between sections ---- */
@media (min-width: 992px) {
  body .csru-home .csru-home-content-column .container:not(#ui-a),
  body .csru-home .csru-home-content-column .csru-hero .container:not(#ui-a) { max-width: none !important; width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; margin: 0 !important; }
  body .csru-home .csru-home-content-column .csru-section:not(#ui-a) { padding-top: 28px !important; padding-bottom: 28px !important; margin: 0 !important; }
  body .csru-home .csru-home-content-column .csru-section-tinted:not(#ui-a) { background: transparent !important; }
  body .csru-home .csru-home-content-column .csru-card-foot { align-items: center; gap: 8px; }
  body .csru-home .csru-home-content-column .csru-card-meta { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
}

/* ---- Smaller cards, shorter text (all homepage card sections): title 3 lines max, excerpt 2 lines max, each ends with "..." ---- */
body .csru-home .csru-card .csru-card-title:not(#ui-a) { display: -webkit-box !important; -webkit-box-orient: vertical; -webkit-line-clamp: 3 !important; line-clamp: 3 !important; overflow: hidden !important; }
body .csru-home .csru-card .csru-card-desc:not(#ui-a) { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2 !important; line-clamp: 2 !important; overflow: hidden !important; }
body .csru-home .csru-hero-card-lead .csru-card-title:not(#ui-a) { -webkit-line-clamp: 4 !important; line-clamp: 4 !important; }
@media (min-width: 992px) {
  body .csru-home .csru-hero-card:not(.csru-hero-card-lead) .csru-card-desc:not(#ui-a) { display: none !important; }
  body .csru-home .csru-hero-card-lead .csru-card-desc:not(#ui-a) { display: -webkit-box !important; -webkit-line-clamp: 3 !important; line-clamp: 3 !important; }
  body .csru-home .csru-card .csru-card-title:not(#ui-a) { font-size: 14.5px !important; }
  body .csru-home .csru-card .csru-card-desc:not(#ui-a) { font-size: 13px !important; }
}
body .csru-home .csru-hero-card:not(.csru-hero-card-lead) .csru-card-title:not(#ui-a) { margin-bottom: .55rem !important; }