/*
 * home-v2.css -- styles for the wholesale buying homepage (page-home-v2.php).
 *
 * Scoped under .pdf-home so nothing here can leak into the existing templates.
 * Uses the site's existing palette: navy #16224f, denim yellow #ffd700, near
 * black #1a1a1a, and the Montserrat/Raleway pair already loaded by the theme.
 */

.pdf-home {
  --navy: #16224f;
  --gold: #ffd700;
  --ink: #1a1a1a;
  --muted: #5a6070;
  --line: #e3e6ee;
  --wash: #f6f7fa;
  font-family: "Montserrat", "Raleway", system-ui, -apple-system, sans-serif;
  color: var(--ink);
}

.pdf-home .container { max-width: 1180px; }

.pdf-home .pdf-section { padding: 64px 0; }
.pdf-home .pdf-h2 {
  font-size: 32px;
  font-weight: 700;
  line-height: 1.2;
  margin: 0 0 12px;
  color: var(--navy);
}
.pdf-home .pdf-lede {
  font-size: 17px;
  color: var(--muted);
  max-width: 62ch;
  margin: 0 0 32px;
}
.pdf-home .pdf-center { text-align: center; margin-top: 36px; }

/* ---- buttons ---- */
.pdf-home .pdf-btn {
  display: inline-block;
  padding: 14px 26px;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
  text-decoration: none;
  border-radius: 3px;
  border: 2px solid transparent;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
.pdf-home .pdf-btn--primary { background: var(--gold); color: var(--ink); }
.pdf-home .pdf-btn--primary:hover { background: #e6c200; color: var(--ink); text-decoration: none; }
.pdf-home .pdf-btn--ghost { background: transparent; color: var(--navy); border-color: var(--navy); }
.pdf-home .pdf-btn--ghost:hover { background: var(--navy); color: #fff; text-decoration: none; }
.pdf-home .pdf-btn--sm { padding: 9px 10px; font-size: 11px; letter-spacing: 0; white-space: nowrap; }

/* ---- 1. hero ---- */
.pdf-home .pdf-hero {
  background-color: var(--navy);
  background-size: cover;
  background-position: center right;
  color: #fff;
  padding: 104px 0 88px;
}
.pdf-home .pdf-hero__title {
  font-size: 48px;
  line-height: 1.1;
  font-weight: 700;
  margin: 0 0 18px;
  color: #fff;
  max-width: 18ch;
}
.pdf-home .pdf-hero__sub {
  font-size: 19px;
  line-height: 1.55;
  color: #ccd3e6;
  max-width: 60ch;
  margin: 0 0 32px;
}
.pdf-home .pdf-hero__cta { display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 30px; }
.pdf-home .pdf-hero__cta .pdf-btn--ghost { color: #fff; border-color: rgba(255,255,255,.55); }
.pdf-home .pdf-hero__cta .pdf-btn--ghost:hover { background: #fff; color: var(--navy); border-color: #fff; }
.pdf-home .pdf-hero__meta {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 22px;
  margin: 0;
  padding: 0;
  font-size: 13px;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: #9fb0d4;
}
.pdf-home .pdf-hero__meta li + li::before {
  content: "·";
  margin-right: 22px;
  color: #55638e;
}
.pdf-home .pdf-hero__meta a { color: var(--gold); text-decoration: none; }

/* ---- 2. trust bar ---- */
.pdf-home .pdf-trust { background: var(--gold); padding: 26px 0; }
.pdf-home .pdf-trust__list {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px;
  text-align: center;
}
.pdf-home .pdf-trust__list strong { display: block; font-size: 21px; color: var(--ink); }
.pdf-home .pdf-trust__list span { display: block; font-size: 13px; color: #4a4526; margin-top: 3px; }

/* ---- 3. browse cards ---- */
.pdf-home .pdf-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.pdf-home .pdf-card {
  display: block;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: #fff;
  text-decoration: none;
  color: inherit;
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.pdf-home .pdf-card:hover {
  border-color: var(--navy);
  box-shadow: 0 6px 22px rgba(22,34,79,.10);
  transform: translateY(-2px);
  text-decoration: none;
}
.pdf-home .pdf-card__img { display: block; overflow: hidden; background: var(--wash); }
.pdf-home .pdf-card__img img {
  display: block; width: 100%; height: 190px; object-fit: cover;
  transition: transform .35s ease;
}
.pdf-home .pdf-card:hover .pdf-card__img img { transform: scale(1.04); }
.pdf-home .pdf-card__body { display: block; padding: 20px 22px 20px; }
.pdf-home .pdf-card__title { display: block; font-size: 19px; font-weight: 700; color: var(--navy); }
.pdf-home .pdf-card__desc { display: block; font-size: 14px; color: var(--muted); margin: 8px 0 14px; line-height: 1.5; }
.pdf-home .pdf-card__go { display: block; font-size: 13px; font-weight: 700; color: var(--ink); letter-spacing: .02em; }

/* ---- 4. live inventory ---- */
.pdf-home .pdf-live { background: var(--wash); }
.pdf-home .pdf-inv { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.pdf-home .pdf-inv__item {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 4px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.pdf-home .pdf-inv__swatch { display: block; background: var(--wash); }
.pdf-home .pdf-inv__swatch img { display: block; width: 100%; height: 132px; object-fit: cover; }
.pdf-home .pdf-inv__item > *:not(.pdf-inv__swatch) { margin-left: 20px; margin-right: 20px; }
.pdf-home .pdf-inv__head { margin-top: 16px; }
.pdf-home .pdf-inv__foot { margin-bottom: 20px; }
.pdf-home .pdf-inv__item--noimg .pdf-inv__head { margin-top: 20px; }
.pdf-home .pdf-inv__note {
  font-size: 13px; color: var(--muted); margin: 20px 0 0; font-style: italic;
}
.pdf-home .pdf-inv__head {
  display: flex; justify-content: space-between; align-items: baseline; gap: 10px;
  border-bottom: 1px solid var(--line); padding-bottom: 10px; margin-bottom: 12px;
}
.pdf-home .pdf-inv__mill { font-weight: 700; color: var(--navy); font-size: 15px; }
.pdf-home .pdf-inv__style {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 13px; color: var(--ink); background: var(--gold);
  padding: 2px 7px; border-radius: 3px;
}
.pdf-home .pdf-inv__desc { font-size: 14px; color: var(--muted); margin: 0 0 14px; line-height: 1.5; }
.pdf-home .pdf-inv__spec { margin: 0 0 16px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px 14px; }
.pdf-home .pdf-inv__spec div { display: flex; justify-content: space-between; gap: 8px; border-bottom: 1px dotted var(--line); padding-bottom: 4px; }
.pdf-home .pdf-inv__spec dt { font-size: 12px; color: var(--muted); text-transform: uppercase; letter-spacing: .03em; margin: 0; }
.pdf-home .pdf-inv__spec dd { font-size: 13px; font-weight: 700; margin: 0; }
.pdf-home .pdf-inv__foot { margin-top: auto; display: flex; flex-wrap: nowrap; gap: 6px; }

/* ---- 5. why ---- */
.pdf-home .pdf-why__list {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px 34px;
}
.pdf-home .pdf-why__list li {
  padding-left: 30px; position: relative; font-size: 15px; color: var(--muted); line-height: 1.55;
}
.pdf-home .pdf-why__list li::before {
  content: ""; position: absolute; left: 0; top: 7px;
  width: 14px; height: 8px; border-left: 3px solid var(--gold); border-bottom: 3px solid var(--gold);
  transform: rotate(-45deg);
}
.pdf-home .pdf-why__list strong { color: var(--ink); }

/* ---- 6. warehouses ---- */
.pdf-home .pdf-warehouse { background: var(--navy); }
.pdf-home .pdf-warehouse .pdf-h2 { color: #fff; }
.pdf-home .pdf-warehouse__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; margin-top: 28px; }
.pdf-home .pdf-warehouse__item { margin: 0; background: #101a3d; border-radius: 4px; overflow: hidden; }
.pdf-home .pdf-warehouse__item img { display: block; width: 100%; height: 190px; object-fit: cover; }
.pdf-home .pdf-warehouse__item figcaption { padding: 14px 16px 16px; }
.pdf-home .pdf-warehouse__name { display: block; color: #fff; font-weight: 700; font-size: 15px; line-height: 1.35; }
.pdf-home .pdf-warehouse__units { display: block; color: var(--gold); font-size: 13px; margin-top: 5px; }

/* ---- 7. steps ---- */
.pdf-home .pdf-steps__list {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; counter-reset: none;
}
.pdf-home .pdf-steps__list li { border-top: 3px solid var(--gold); padding-top: 16px; }
.pdf-home .pdf-steps__n {
  display: inline-block; font-size: 13px; font-weight: 700; color: var(--muted); margin-bottom: 6px;
}
.pdf-home .pdf-steps__list strong { display: block; font-size: 17px; color: var(--navy); margin-bottom: 6px; }
.pdf-home .pdf-steps__list span { font-size: 14px; color: var(--muted); line-height: 1.5; }

/* ---- 8. mills ---- */
.pdf-home .pdf-mills__list {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px;
}
.pdf-home .pdf-mills__list li {
  display: flex; justify-content: space-between; align-items: center; gap: 10px;
  border: 1px solid var(--line); border-radius: 3px; padding: 14px 16px; background: #fff;
}
.pdf-home .pdf-mills__list a { font-weight: 700; color: var(--navy); text-decoration: none; }
.pdf-home .pdf-mills__list a:hover { text-decoration: underline; }
.pdf-home .pdf-mills__list span { font-size: 12px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }

/* ---- 9/10/13. closeout, credibility, final ---- */
.pdf-home .pdf-closeout { background: var(--wash); text-align: center; }
.pdf-home .pdf-closeout .pdf-lede { margin-left: auto; margin-right: auto; }
.pdf-home .pdf-cred { padding: 34px 0; background: var(--ink); }
.pdf-home .pdf-cred__line { margin: 0; text-align: center; color: #fff; font-size: 17px; }
.pdf-home .pdf-about p { font-size: 16px; line-height: 1.7; color: var(--muted); max-width: 74ch; }
.pdf-home .pdf-final { background: var(--gold); text-align: center; }
.pdf-home .pdf-final .pdf-h2 { color: var(--ink); }
.pdf-home .pdf-final .pdf-lede { color: #4a4526; margin-left: auto; margin-right: auto; }
.pdf-home .pdf-final__cta { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }
.pdf-home .pdf-final .pdf-btn--primary { background: var(--ink); color: #fff; }
.pdf-home .pdf-final .pdf-btn--primary:hover { background: #000; }
.pdf-home .pdf-final .pdf-btn--ghost { border-color: var(--ink); color: var(--ink); }
.pdf-home .pdf-final .pdf-btn--ghost:hover { background: var(--ink); color: #fff; }

/* ---- 12. faq ---- */
.pdf-home .pdf-faq__list { max-width: 860px; }
.pdf-home .pdf-faq details {
  border: 1px solid var(--line); border-radius: 4px; background: #fff; margin-bottom: 10px;
}
.pdf-home .pdf-faq summary {
  cursor: pointer; padding: 16px 20px; font-weight: 700; color: var(--navy); font-size: 16px;
  list-style: none;
}
.pdf-home .pdf-faq summary::-webkit-details-marker { display: none; }
.pdf-home .pdf-faq summary::after { content: "+"; float: right; color: var(--muted); font-weight: 400; }
.pdf-home .pdf-faq details[open] summary::after { content: "\2212"; }
.pdf-home .pdf-faq details p { margin: 0; padding: 0 20px 18px; color: var(--muted); font-size: 15px; line-height: 1.6; }

/* ---- responsive ---- */
@media (max-width: 991px) {
  .pdf-home .pdf-cards,
  .pdf-home .pdf-inv,
  .pdf-home .pdf-mills__list { grid-template-columns: repeat(2, 1fr); }
  .pdf-home .pdf-warehouse__grid,
  .pdf-home .pdf-steps__list { grid-template-columns: repeat(2, 1fr); }
  .pdf-home .pdf-hero__title { font-size: 38px; }
}
@media (max-width: 640px) {
  .pdf-home .pdf-section { padding: 44px 0; }
  .pdf-home .pdf-hero { padding: 54px 0 44px; }
  .pdf-home .pdf-hero__title { font-size: 30px; }
  .pdf-home .pdf-hero__sub { font-size: 17px; }
  .pdf-home .pdf-h2 { font-size: 25px; }
  .pdf-home .pdf-cards,
  .pdf-home .pdf-inv,
  .pdf-home .pdf-mills__list,
  .pdf-home .pdf-why__list,
  .pdf-home .pdf-warehouse__grid,
  .pdf-home .pdf-steps__list,
  .pdf-home .pdf-trust__list { grid-template-columns: 1fr; }
  .pdf-home .pdf-hero__meta li + li::before { display: none; }
}

/* ---- 4b. design inspiration ----
   Deliberately compact: six cards, each pointing back at a fabric category.
   Its job is to help a designer pick a construction, not to be a lookbook. */
.pdf-home .pdf-apps__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.pdf-home .pdf-app {
  border: 1px solid var(--line); border-radius: 4px; background: #fff; overflow: hidden;
  display: flex; flex-direction: column;
}
.pdf-home .pdf-app__img { display: block; background: var(--wash); }
.pdf-home .pdf-app__img img { display: block; width: 100%; height: 170px; object-fit: cover; }
.pdf-home .pdf-app__body { display: block; padding: 18px 20px 20px; }
.pdf-home .pdf-app__title { display: block; font-size: 18px; font-weight: 700; color: var(--navy); }
.pdf-home .pdf-app__desc { display: block; font-size: 14px; color: var(--muted); margin: 7px 0 12px; line-height: 1.5; }
.pdf-home .pdf-app__link { font-size: 13px; font-weight: 700; color: var(--ink); text-decoration: none; }
.pdf-home .pdf-app__link:hover { color: var(--navy); text-decoration: underline; }
@media (max-width: 991px) { .pdf-home .pdf-apps__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .pdf-home .pdf-apps__grid { grid-template-columns: 1fr; } }

/* ---- clickable imagery ----
   Card images and their headings are links, so the whole visual block is a
   target rather than just the small text link underneath. */
.pdf-home .pdf-inv__swatch,
.pdf-home .pdf-app__img { display: block; overflow: hidden; }
.pdf-home .pdf-inv__swatch img,
.pdf-home .pdf-app__img img { transition: transform .35s ease; }
.pdf-home .pdf-inv__swatch:hover img,
.pdf-home .pdf-app__img:hover img { transform: scale(1.04); }
.pdf-home a.pdf-inv__mill { text-decoration: none; }
.pdf-home a.pdf-inv__mill:hover { text-decoration: underline; }
.pdf-home a.pdf-app__title { text-decoration: none; }
.pdf-home a.pdf-app__title:hover { color: var(--ink); text-decoration: underline; }
.pdf-home .pdf-warehouse__item a { display: block; }
.pdf-home .pdf-warehouse__item img { transition: transform .35s ease; }
.pdf-home .pdf-warehouse__item a:hover img { transform: scale(1.05); }

/* ---- mills thumbnails ---- */
.pdf-home .pdf-mills__list li { display: block; padding: 0; border: 1px solid var(--line); overflow: hidden; }
.pdf-home .pdf-mill { display: block; text-decoration: none; color: inherit; }
.pdf-home .pdf-mill__img { display: block; overflow: hidden; background: var(--wash); }
.pdf-home .pdf-mill__img img { display: block; width: 100%; height: 120px; object-fit: cover; transition: transform .35s ease; }
.pdf-home .pdf-mill:hover .pdf-mill__img img { transform: scale(1.05); }
.pdf-home .pdf-mill__body { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 12px 16px; }
.pdf-home .pdf-mill__name { font-weight: 700; color: var(--navy); }
.pdf-home .pdf-mill:hover .pdf-mill__name { text-decoration: underline; }
.pdf-home .pdf-mill__country { font-size: 12px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }

/* ---- ordering steps with imagery ---- */
/* Grid rather than flow, so a step missing its image still lines up with the
   others instead of floating its number and title up the column. */
.pdf-home .pdf-steps__list li {
  border-top: 0; padding-top: 0;
  display: grid; grid-template-rows: auto auto auto 1fr; align-content: start;
}
.pdf-home .pdf-steps__list li:not(:has(.pdf-steps__img)) { padding-top: 164px; }
.pdf-home .pdf-steps__img { display: block; margin-bottom: 14px; border-radius: 4px; overflow: hidden; background: var(--wash); }
.pdf-home .pdf-steps__img img { display: block; width: 100%; height: 150px; object-fit: cover; }
.pdf-home .pdf-steps__n {
  display: inline-flex; align-items: center; justify-content: center;
  width: 26px; height: 26px; border-radius: 50%;
  background: var(--gold); color: var(--ink); font-weight: 700; font-size: 13px; margin-bottom: 8px;
}

/* ---- header on the new homepage ----
   The theme styles the header specially on .home for the old full-bleed
   slider: header_main goes near-black and header_top carries a
   box-shadow: 0 40px 150px 60px #111 glow to darken the top of the slide.
   The new hero has its own gradient, so that glow just washes the header grey.
   Restore the same header the rest of the site uses. */
body.home .header_main {
  background-color: #152249;
  border-top: 1px solid #272626;
}
body.home .header_top {
  box-shadow: none;
  background-color: #111;
}

/* Steps 1 and 2 are actionable, so they read as links; 3 and 4 are what
   happens after you get in touch and stay as plain text. */
.pdf-home a.pdf-steps__img { display: block; overflow: hidden; border-radius: 4px; }
.pdf-home a.pdf-steps__img img { transition: transform .35s ease; }
.pdf-home a.pdf-steps__img:hover img { transform: scale(1.05); }
.pdf-home .pdf-steps__list strong a { color: var(--navy); text-decoration: none; }
.pdf-home .pdf-steps__list strong a:hover { text-decoration: underline; }
/* Non-breaking space so the arrow cannot end up alone on its own line when the
   step title wraps, which it does on "Request a swatch or pricing". */
.pdf-home .pdf-steps__li--link strong a::after { content: "\00a0→"; font-weight: 400; color: var(--muted); }
.pdf-home .pdf-faq__more { margin: 16px 0 0; font-size: 14px; font-weight: 700; }
.pdf-home .pdf-faq__more a { color: var(--navy); text-decoration: none; }
.pdf-home .pdf-faq__more a:hover { text-decoration: underline; }

/* ---- SEO landing + hub pages ---- */
.pdf-landing .pdf-crumbs { font-size: 13px; color: var(--muted); margin: 0 0 14px; }
.pdf-landing .pdf-crumbs a { color: var(--navy); text-decoration: none; }
.pdf-landing .pdf-crumbs a:hover { text-decoration: underline; }
.pdf-landing__h1 { font-size: 38px; margin-bottom: 14px; }
.pdf-landing__count {
  display: inline-block; background: var(--gold); color: var(--ink);
  padding: 9px 15px; border-radius: 3px; font-size: 15px; margin: 0 0 28px;
}
.pdf-landing__body { max-width: 74ch; }
.pdf-landing__body h2 { font-size: 23px; color: var(--navy); margin: 30px 0 10px; font-weight: 700; }
.pdf-landing__body p { font-size: 16px; line-height: 1.7; color: var(--muted); margin: 0 0 14px; }
.pdf-landing__body a { color: var(--navy); font-weight: 700; }
.pdf-hub__h { font-size: 20px; color: var(--navy); margin: 34px 0 14px; font-weight: 700; }
.pdf-related__list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px 24px; }
.pdf-related__list a { font-weight: 700; color: var(--navy); text-decoration: none; font-size: 15px; }
.pdf-related__list a:hover { text-decoration: underline; }
.pdf-landing__body .pdf-table { width: 100%; border-collapse: collapse; margin: 6px 0 18px; }
.pdf-landing__body .pdf-table th { text-align: left; background: var(--navy); color: #fff; padding: 10px 14px; font-size: 14px; }
.pdf-landing__body .pdf-table td { padding: 10px 14px; border-bottom: 1px solid var(--line); font-size: 15px; color: var(--muted); }
.pdf-landing__body .pdf-table tr:nth-child(even) td { background: var(--wash); }
/* header image on landing pages, guides and hubs */
.pdf-landing__img { margin: 0 0 24px; }
.pdf-landing__img img { display: block; width: 100%; height: 260px; object-fit: cover; border-radius: 4px; }
@media (max-width: 640px) { .pdf-landing__img img { height: 150px; } }

/* ---- comparison pages ---- */
.pdf-verdict {
  border-left: 4px solid var(--gold); background: var(--wash);
  padding: 18px 22px; margin: 0 0 30px; max-width: 74ch;
}
.pdf-verdict__label {
  display: block; font-size: 11px; font-weight: 700; letter-spacing: .09em;
  text-transform: uppercase; color: var(--muted); margin-bottom: 6px;
}
.pdf-verdict p { margin: 0; font-size: 17px; line-height: 1.6; color: var(--ink); }
.pdf-tablewrap { overflow-x: auto; margin: 0 0 22px; }
.pdf-table--cmp { min-width: 520px; }
/* Three-way comparisons need a wider floor or the cells cramp; .pdf-tablewrap
   scrolls it horizontally rather than letting the page do so. */
.pdf-table--cmp3 { min-width: 720px; }
.pdf-table--cmp thead th:first-child { width: 26%; background: transparent; }
.pdf-table--cmp tbody th {
  text-align: left; font-weight: 700; color: var(--navy); font-size: 14px;
  padding: 10px 14px; border-bottom: 1px solid var(--line); background: var(--wash);
}

/* --- "view more" disclosure --------------------------------------------- */
/* Checkbox-driven so no JavaScript is needed; see inc/more-toggle.php for why
   the hidden items stay in the DOM rather than being injected on toggle.

   Collapsing is opt-in per breakpoint. A grid declares how many items survive
   on small screens (--3/--4/--6) and, separately, on large ones (--d9). Most
   sections only collapse on mobile; Available Now is long enough to warrant it
   at every width. */
/* The browser re-anchors scroll when one of these grids changes height, which
   moved the mobile viewport 2,232px on expand with no input from the reader.
   js/more.js sets the position deliberately instead. */
.pdf-more__grid { overflow-anchor: none; }
/* Fixed, not absolute, and that is load-bearing. Clicking the label focuses
   this checkbox, and the browser scrolls a newly focused control into view --
   the control sits above the grid, so expanding threw the reader 2,232px up
   the page on mobile. Pinning it inside the viewport means there is never
   anything to scroll to. It stays a preceding sibling of the grid either way,
   which is all the selectors below need. */
.pdf-more__cb {
  position: fixed; top: 0; left: 0;
  width: 1px; height: 1px; margin: 0; padding: 0;
  opacity: 0; pointer-events: none; border: 0;
}
/* Hidden by default; each breakpoint below opts its controls back in. */
.pdf-more__btn { display: none; }
.pdf-more__btn {
  align-items: center; justify-content: center;
  min-height: 48px; padding: 0 22px;
  border: 1px solid var(--navy); border-radius: 4px;
  background: transparent; color: var(--navy);
  font-weight: 700; font-size: 13px; text-transform: uppercase;
  letter-spacing: .04em; cursor: pointer; user-select: none;
}
.pdf-more__btn:hover { background: var(--navy); color: #fff; }
/* State, not layout, so these belong outside the breakpoints. */
.pdf-more__cb:checked ~ .pdf-more__btn .pdf-more__on { display: none; }
.pdf-more__cb:not(:checked) ~ .pdf-more__btn .pdf-more__off { display: none; }
/* The checkbox is visually hidden but focusable, so the ring is drawn on the
   label instead. */
.pdf-more__cb:focus-visible ~ .pdf-more__btn {
  outline: 2px solid var(--gold); outline-offset: 2px;
}

@media (max-width: 767px) {
  .pdf-more__btn { display: flex; margin: 18px auto 0; }
  .pdf-more__cb:not(:checked) ~ .pdf-more--3 > :nth-child(n+4),
  .pdf-more__cb:not(:checked) ~ .pdf-more--4 > :nth-child(n+5),
  .pdf-more__cb:not(:checked) ~ .pdf-more--6 > :nth-child(n+7) { display: none; }
}

@media (min-width: 768px) {
  /* Only grids that declare a desktop cut show a control here. Full width
     reads as a section break on a phone but looks unanchored on a wide screen,
     so the desktop control is centred at its natural size. */
  .pdf-more__btn--desk { display: flex; width: fit-content; margin: 26px auto 0; }
  /* The grid is three columns wide, so six keeps two complete rows. */
  .pdf-more__cb:not(:checked) ~ .pdf-more--d6 > :nth-child(n+7) { display: none; }
}