/* Hubs, archives, recherche, 404, pagination. */

.hub-hero { padding: 82px 0 66px; background: var(--paper); border-bottom: 1px solid var(--line); }

.breadcrumbs {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-bottom: 26px;
  color: var(--muted);
  font-family: var(--latin);
  font-size: 9px;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.breadcrumbs span { color: var(--champagne); }
.breadcrumbs a { color: var(--muted); }
.breadcrumbs a:hover { color: var(--plum); }

.hub-heading { display: grid; grid-template-columns: 1.1fr .9fr; gap: 70px; align-items: end; }
.hub-heading h1 { margin: 0; font-family: var(--serif); font-size: clamp(52px, 6vw, 80px); font-weight: 500; letter-spacing: -.045em; line-height: 1.08; }
.hub-heading p { margin: 0 0 8px; max-width: 520px; color: var(--muted); font-size: 16px; }

.hub-tabs { display: grid; grid-template-columns: repeat(4, 1fr); border-bottom: 1px solid var(--line); background: var(--paper); }
.hub-tab { min-height: 105px; padding: 24px 22px; border-right: 1px solid var(--line); transition: background .25s ease; }
.hub-tab:first-child { border-left: 1px solid var(--line); }
.hub-tab:hover { background: rgba(234, 208, 213, .25); }
.hub-tab.is-current { background: var(--plum); color: #fff; }
.hub-tab.is-current small { color: var(--blush); }
.hub-tab small { display: block; color: var(--champagne); font-family: var(--latin); font-size: 9px; letter-spacing: .1em; }
.hub-tab strong { display: block; margin-top: 9px; font-family: var(--serif); font-size: 16px; font-weight: 500; }

.hub-feature { padding: 84px 0 100px; }
.hub-lead { display: grid; grid-template-columns: 1.35fr .65fr; gap: 38px; align-items: stretch; }
.hub-lead-image { display: block; min-height: 540px; overflow: hidden; }
.hub-lead-image img,
.hub-lead-image .bs-image-fallback { width: 100%; height: 100%; min-height: 540px; }
.hub-lead-copy { display: flex; flex-direction: column; justify-content: center; padding: 44px 18px 44px 12px; }
.hub-lead-copy h2 { margin: 0; font-family: var(--serif); font-size: clamp(33px, 4vw, 48px); font-weight: 500; line-height: 1.28; }
.hub-lead-copy p { margin: 20px 0 28px; color: var(--muted); }

.archive { padding: 100px 0 120px; background: #f5efea; }
.archive-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 24px; margin-bottom: 42px; }
.archive-toolbar h2 { margin: 0; font-family: var(--serif); font-size: 36px; font-weight: 500; }
.archive-toolbar .header-search { max-width: 320px; width: 100%; }
.archive-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 42px 24px; }

.bs-related { background: var(--ivory); border-top: 1px solid var(--line); padding: 80px 0 90px; }

.post-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 60px; border-top: 1px solid var(--line); padding-top: 30px; }
.post-nav a { display: block; }
.post-nav-next { text-align: right; }
.post-nav small { display: block; margin-bottom: 8px; color: var(--muted); font-family: var(--latin); font-size: 9px; letter-spacing: .12em; text-transform: uppercase; }
.post-nav strong { font-family: var(--serif); font-size: 17px; font-weight: 500; line-height: 1.4; }

/* Pagination : habillage de the_posts_pagination(). */
.pagination { margin-top: 60px; }
.pagination .nav-links { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; }
.pagination .page-numbers {
  display: grid;
  place-items: center;
  min-width: 38px;
  height: 38px;
  padding: 0 10px;
  border: 1px solid var(--line);
  font-family: var(--latin);
  font-size: 10px;
}
.pagination .page-numbers.current { color: #fff; background: var(--plum); border-color: var(--plum); }
.pagination .page-numbers:hover { border-color: var(--plum); }
.pagination .screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); }

.bs-404-grid { margin-top: 20px; border-top: 1px solid var(--line); }
.bs-404-home { margin-top: 40px; }
