/* NLS-Québec — Olivero subtheme approximating the legacy "Sky" look. */
:root {
  --color--primary-hue: 190;
  --color--primary-saturation: 49%;
  --color--primary-lightness: 50;
}
body { background-color: #fcfde9; }
.site-header, .site-header__inner, .site-header__fixable { background-color: #fcfde9; }

/* Remove Olivero's primary gradient/branding band behind the logo. */
.site-branding, .site-branding__inner {
  background: transparent !important;
  background-image: none !important;
}
.site-header__initial { background-color: transparent !important; }
.site-branding__name a { color: #4c4742 !important; }

main h1, main h2, main h3, .page-title { color: #4c4742; }
.text-content a, .text-long a { color: #1c6ea0; }
.text-content a:hover, .text-long a:hover { color: #42a9be; }
.site-footer { background-color: #2b3d40; }

/* ---- Sidebar: compact ---- */
.region--sidebar .block { margin-block-end: 1.5rem; }
.region--sidebar h2 { font-size: 1rem; margin-block-end: .5rem; }
#block-nlsq-sidebar-3 img { width: 28px; height: auto; }
#block-nlsq-sidebar-3 p { margin: 0 0 .25rem; }
.region--sidebar img { max-width: 100%; height: auto; }

/* ---- Front page card wall ---- */
/* Cover: full poster (or teaser fallback) with title below. */
.path-frontpage .view-id-frontpage_cards .card-cover img {
  display: block;
  width: 100%;
  height: auto;
}
.path-frontpage .view-id-frontpage_cards .card-teaser {
  padding: 1rem 1rem .25rem;
  display: -webkit-box;
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
/* Normalize body markup used as a teaser (drop big headings, broken inline imgs). */
.path-frontpage .view-id-frontpage_cards .card-teaser,
.path-frontpage .view-id-frontpage_cards .card-teaser * {
  font-size: .95rem !important;
  font-weight: 400 !important;
  font-style: normal !important;
  line-height: 1.45 !important;
  margin: 0 0 .4rem !important;
  color: #4c4742 !important;
  text-align: left !important;
}
.path-frontpage .view-id-frontpage_cards .card-teaser img { display: none !important; }
.path-frontpage .view-id-frontpage_cards .views-field-title { padding: .75rem 1rem 1rem; }
.path-frontpage .view-id-frontpage_cards .views-field-title a {
  display: block;
  color: #4c4742;
  font-weight: 700;
  font-size: 1.05rem;
  line-height: 1.3;
  text-decoration: none;
}
.path-frontpage .view-id-frontpage_cards .views-field-title a:hover { color: #1c6ea0; }

/* Row-major grid: newest items read left-to-right; equal-height rows (no gaps). */
.path-frontpage .view-id-frontpage_cards > .view-content {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
  margin-block: .5rem 1.5rem;
  align-items: start;
}
.path-frontpage .view-id-frontpage_cards .views-row {
  display: flex;
  flex-direction: column;
  margin: 0;
  background: #fff;
  border: 1px solid #e1dfdc;
  border-radius: 12px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, .08);
  overflow: hidden;
  transition: box-shadow .2s ease, transform .2s ease;
}
.path-frontpage .view-id-frontpage_cards .views-row:hover {
  box-shadow: 0 6px 16px rgba(0, 0, 0, .14);
  transform: translateY(-2px);
}
.path-frontpage .view-id-frontpage_cards .card-cover { flex: 0 0 auto; }

@media (max-width: 60rem) {
  .path-frontpage .view-id-frontpage_cards > .view-content { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 35rem) {
  .path-frontpage .view-id-frontpage_cards > .view-content { grid-template-columns: 1fr; }
}

/* ---- Wide screens only: widen content, slim margins, roomier sidebar. ---- */
/* Below 75rem Olivero stacks the sidebar BELOW the content (mobile-friendly). */
@media (min-width: 75rem) {
  .path-frontpage .main-content__container.container { max-width: 1680px; }
  .path-frontpage main.site-main { grid-column: 1 / 13 !important; }
  .path-frontpage .region--sidebar { grid-column: 13 / 15 !important; }
  .path-frontpage .region--content-above { display: none !important; }
  .path-frontpage .view-id-frontpage_cards,
  .path-frontpage .view-id-frontpage_cards > .view-content {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    max-width: none !important;
  }
}

/* Masonry columns (applied by js/cards.js): row-major order, gap-free packing. */
.path-frontpage .view-id-frontpage_cards .view-content.cards-masonry {
  display: flex !important;
  align-items: flex-start;
  gap: 1.5rem;
}
.path-frontpage .view-id-frontpage_cards .cards-col {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

/* ---- Article/page H1: tone down Olivero's 3.75rem desktop title ---- */
@media (min-width: 43.75rem) {
  .page-title,
  main h1.page-title { font-size: 1.75rem; line-height: 1.2; }
}

/* ---- Author-written headings inside body content render at Olivero's huge
   prose sizes (h1 = 3.75rem). Tone them down to sensible in-article sizes. ---- */
.text-content h1,
.field--name-body h1 { font-size: 1.75rem; line-height: 1.2; }
.text-content h2,
.field--name-body h2 { font-size: 1.4rem; line-height: 1.25; }
.text-content h3,
.field--name-body h3 { font-size: 1.2rem; line-height: 1.3; }
.text-content h4,
.field--name-body h4 { font-size: 1.05rem; line-height: 1.3; }
@media (min-width: 43.75rem) {
  .text-content h1,
  .field--name-body h1 { font-size: 2rem; }
  .text-content h2,
  .field--name-body h2 { font-size: 1.5rem; }
}

/* ---- Desktop: keep the primary nav on ONE line so it stays horizontal ---- */
/* Olivero switches to a hamburger when the menu wraps to two lines. We free up
   horizontal room (the account menu is redundant with the sidebar "Connexion
   membres" block), lift Olivero's nav width cap, and tighten spacing so all the
   top-level items fit one line across common desktop widths. */
@media (min-width: 75rem) {
  body:not(.is-always-mobile-nav) .header-nav .region--secondary-menu {
    display: none;
  }
  /* The header inner is a flexbox (branding | nav); let the nav take all the
     remaining width and spread the items evenly across it (instead of a cramped
     cluster pinned to the right edge with empty space on the left). */
  body:not(.is-always-mobile-nav) .header-nav {
    flex: 1 1 auto !important;
    max-width: none !important;
  }
  body:not(.is-always-mobile-nav) .primary-nav {
    flex: 1 1 auto;
    max-width: none !important;
  }
  body:not(.is-always-mobile-nav) .primary-nav__menu--level-1 {
    width: 100%;
    max-width: none !important;
    justify-content: space-between;
    gap: 0.85rem;
  }
  /* Trim the branding a touch so the nav gains horizontal room. */
  .site-branding__name { font-size: 1.5rem; white-space: nowrap; }
  .site-branding__logo img { max-height: 52px; width: auto; }
  .primary-nav__menu-link { font-size: .85rem !important; white-space: nowrap; }
  .primary-nav__menu-item--level-1 { margin-inline-end: 0 !important; }
  .primary-nav__menu-link--button.primary-nav__menu-link--has-children { padding-inline-end: .3rem; }
}