/*
 * 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);
}
