/* ==========================================================================
   Industries hub + trade pages — page-specific CSS.
   Reuses tokens.css mode vars (--pwp-bg/--pwp-fg/--pwp-card/--pwp-line/
   --pwp-accent-text) and components.css primitives (.pwp-btn, .pwp-eyebrow,
   .pwp-sectionhead). Only new component patterns live here.
   ========================================================================== */

/* ---- breadcrumb bar (dark, sits under header, distinct tonal break) ---- */
.pwp-crumbbar {
  padding-block: var(--pwp-space-4);
  border-block-end: 1px solid var(--pwp-line);
}
.pwp-crumb {
  display: flex;
  flex-wrap: wrap;
  gap: var(--pwp-space-2);
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 0.8rem;
  color: var(--pwp-fg-muted);
}
.pwp-crumb li { display: flex; align-items: center; gap: var(--pwp-space-2); }
.pwp-crumb a { color: var(--pwp-fg-muted); text-decoration: none; }
.pwp-crumb a:hover, .pwp-crumb a:focus-visible { color: var(--pwp-accent-text); }
.pwp-crumb li[aria-current="page"] { color: var(--pwp-fg); }

/* ---- hero visual: dashboard proof card ---- */
.pwp-indhero__visual {
  display: grid;
  gap: var(--pwp-space-6);
  margin-block-start: var(--pwp-space-8);
}
@media (min-width: 1024px) {
  .pwp-indhero__visual { grid-template-columns: 1.3fr 0.9fr; align-items: center; margin-block-start: 0; }
  .pwp-hero__grid.pwp-indhero__grid { grid-template-columns: 1fr; }
}
.pwp-indhero__dash {
  background: var(--pwp-surface-800);
  border: 1px solid var(--pwp-border-dark-strong);
  border-radius: var(--pwp-radius-lg, 12px);
  padding: var(--pwp-space-6);
  color: var(--pwp-ink-inverse);
}
.pwp-indhero__dash h2 {
  margin: 0 0 var(--pwp-space-2);
  font-family: var(--pwp-font-display);
  font-size: 0.95rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--pwp-ink-inverse);
}
.pwp-indhero__dashsub { margin: 0 0 var(--pwp-space-5); font-size: 0.8rem; color: var(--pwp-ink-inverse-muted); }
.pwp-indhero__metrics {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--pwp-space-4);
  margin: 0 0 var(--pwp-space-5);
  padding: 0;
  list-style: none;
}
.pwp-indhero__metrics dt { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--pwp-ink-inverse-muted); margin: 0; }
.pwp-indhero__metrics dd { margin: 2px 0 0; font-size: 1.05rem; font-weight: 700; color: var(--pwp-accent-bright); }
.pwp-indhero__tasks { display: grid; gap: var(--pwp-space-2); margin: 0; padding: 0; list-style: none; font-size: 0.82rem; color: var(--pwp-ink-inverse-muted); border-block-start: 1px solid var(--pwp-border-dark); padding-block-start: var(--pwp-space-4); }
.pwp-indhero__tasks li { display: flex; justify-content: space-between; gap: var(--pwp-space-3); }
.pwp-indhero__photo {
  inline-size: 100%;
  block-size: clamp(240px, 34vw, 420px);
  object-fit: cover;
  border-radius: var(--pwp-radius-lg, 12px);
  border: 1px solid var(--pwp-border-dark-strong);
}

/* ---- outcome strip list re-skin for graphite mode ---- */
.pwp-indvalue { --pwp-section-y: var(--pwp-space-8); }
.pwp-indvalue__grid { display: grid; gap: var(--pwp-space-7); }
@media (min-width: 1024px) { .pwp-indvalue__grid { grid-template-columns: 1.2fr 0.8fr; align-items: start; } }
.pwp-indvalue__list { display: grid; gap: var(--pwp-space-4); margin: 0; padding: 0; list-style: none; }
.pwp-indvalue__list li { display: flex; gap: var(--pwp-space-4); align-items: flex-start; }
.pwp-valuestrip__no {
  flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  inline-size: 2rem; block-size: 2rem;
  border: 1px solid var(--pwp-line-strong);
  border-radius: 999px;
  font-size: 0.75rem; font-weight: 700; color: var(--pwp-accent-text);
}
.pwp-indvalue__point { padding-block-start: 4px; }
.pwp-indvalue__card {
  background: var(--pwp-surface-700);
  border: 1px solid var(--pwp-border-dark-strong);
  border-radius: var(--pwp-radius-sm);
  padding: var(--pwp-space-6);
  display: grid;
  gap: var(--pwp-space-4);
}
.pwp-indvalue__kicker { margin: 0; text-transform: uppercase; font-size: 0.72rem; letter-spacing: 0.06em; color: var(--pwp-accent-text); }
.pwp-indvalue__cardtitle { margin: 0; font-family: var(--pwp-font-display); font-size: 1.1rem; text-transform: uppercase; }
.pwp-indvalue__note { margin: 0; font-size: 0.8rem; color: var(--pwp-fg-muted); }

/* ---- diagnostic band A-D ---- */
.pwp-diag__grid {
  display: grid;
  gap: var(--pwp-space-6);
}
@media (min-width: 640px) { .pwp-diag__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1240px) { .pwp-diag__grid { grid-template-columns: repeat(4, 1fr); } }
.pwp-diag__card {
  background: var(--pwp-card);
  border: 1px solid var(--pwp-line);
  border-radius: var(--pwp-radius-sm);
  padding: var(--pwp-space-6);
  display: grid;
  gap: var(--pwp-space-4);
  align-content: start;
}
.pwp-diag__label { margin: 0; font-family: var(--pwp-font-display); font-size: 0.95rem; text-transform: uppercase; letter-spacing: 0.02em; }
.pwp-diag__list { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--pwp-space-3); font-size: 0.9rem; }
.pwp-diag__list li { padding-inline-start: var(--pwp-space-5); position: relative; }
.pwp-diag__list li::before { content: "—"; position: absolute; inset-inline-start: 0; color: var(--pwp-accent-text); }
.pwp-diag__math { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--pwp-space-2); font-size: 0.9rem; }
.pwp-diag__math li { padding-block: var(--pwp-space-2); border-block-end: 1px dashed var(--pwp-line); }
.pwp-diag__math li:last-child { border-block-end: none; }
.pwp-diag__result { font-size: 1.3rem; font-weight: 700; color: var(--pwp-accent-text); }
.pwp-diag__bottomline { margin: 0; padding-block-start: var(--pwp-space-3); border-block-start: 1px solid var(--pwp-line); font-size: 0.9rem; }
.pwp-diag__cover { inline-size: 96px; block-size: 128px; object-fit: cover; border-radius: var(--pwp-radius-xs); border: 1px solid var(--pwp-line); }
.pwp-diag__blurb { font-size: 0.9rem; margin: 0; }
.pwp-diag__cta { justify-self: start; }

/* ---- PPS + PWP band ---- */
.pwp-ppsw__head { max-inline-size: 68ch; margin-block-end: var(--pwp-space-7); }
.pwp-ppsw__strap { margin: var(--pwp-space-2) 0 0; color: var(--pwp-fg-muted); font-size: 0.95rem; }
.pwp-ppsw__grid { display: grid; gap: var(--pwp-space-6); }
@media (min-width: 640px) { .pwp-ppsw__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1240px) { .pwp-ppsw__grid { grid-template-columns: repeat(4, 1fr); } }
.pwp-ppsw__card {
  border: 1.5px solid var(--pwp-accent);
  border-radius: var(--pwp-radius-sm);
  padding: var(--pwp-space-6);
  display: grid;
  gap: var(--pwp-space-4);
  align-content: start;
  background: color-mix(in oklab, var(--pwp-bg) 92%, var(--pwp-accent) 8%);
}
.pwp-ppsw__label { margin: 0; font-family: var(--pwp-font-display); font-size: 0.9rem; text-transform: uppercase; }
.pwp-ppsw__list { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--pwp-space-3); font-size: 0.88rem; }
.pwp-ppsw__list li { padding-inline-start: var(--pwp-space-5); position: relative; }
.pwp-ppsw__list li::before { content: "—"; position: absolute; inset-inline-start: 0; color: var(--pwp-accent-text); }
.pwp-ppsw__list--bridge li { font-weight: 500; }

/* ---- proof + cost-of-waiting + CTA band ---- */
.pwp-proof__grid { display: grid; gap: var(--pwp-space-8); }
@media (min-width: 1024px) { .pwp-proof__grid { grid-template-columns: repeat(2, 1fr); } }
.pwp-proof__list { margin: 0 0 var(--pwp-space-4); padding: 0; list-style: none; display: grid; gap: var(--pwp-space-2); font-size: 0.95rem; }
.pwp-proof__note { font-size: 0.82rem; color: var(--pwp-fg-muted); }
.pwp-cost__table { width: 100%; border-collapse: collapse; margin: var(--pwp-space-4) 0; font-size: 0.92rem; }
.pwp-cost__table th, .pwp-cost__table td { text-align: left; padding: var(--pwp-space-3); border-block-end: 1px solid var(--pwp-line); }
.pwp-cost__statement { font-size: 1rem; }
.pwp-directcta {
  margin-block-start: var(--pwp-space-8);
  padding: var(--pwp-space-7);
  background: var(--pwp-card);
  border: 1px solid var(--pwp-line-strong);
  border-radius: var(--pwp-radius-lg, 12px);
  display: grid;
  gap: var(--pwp-space-4);
  justify-items: start;
}

/* ---- related pages + tools band ---- */
.pwp-related__grid { display: grid; gap: var(--pwp-space-8); }
@media (min-width: 900px) { .pwp-related__grid { grid-template-columns: 0.8fr 1.2fr; } }
.pwp-related__list { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--pwp-space-3); }
.pwp-related__list a { text-decoration: none; color: var(--pwp-fg); font-weight: 600; }
.pwp-related__list a:hover, .pwp-related__list a:focus-visible { color: var(--pwp-accent-text); }
.pwp-toolcards { display: grid; gap: var(--pwp-space-5); grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); }
.pwp-toolcard {
  border: 1px solid var(--pwp-line);
  border-radius: var(--pwp-radius-sm);
  padding: var(--pwp-space-5);
  display: grid;
  gap: var(--pwp-space-3);
  align-content: start;
  background: var(--pwp-card);
}
.pwp-toolcard--dark { background: var(--pwp-surface-900); border-color: var(--pwp-border-dark-strong); color: var(--pwp-ink-inverse); }
.pwp-toolcard--dark .pwp-toolcard__title,
.pwp-toolcard--dark .pwp-toolcard__copy { color: var(--pwp-ink-inverse); }
.pwp-toolcard__icon { color: var(--pwp-accent-text); }
.pwp-toolcard__title { margin: 0; font-family: var(--pwp-font-display); font-size: 1rem; text-transform: uppercase; }
.pwp-toolcard__copy { margin: 0; font-size: 0.88rem; }
.pwp-toolcard .pwp-btn { justify-self: start; }
.pwp-related__viewall { margin-block-start: var(--pwp-space-6); }

/* ---- Hub page: industry grid ---- */
.pwp-indhub__grid { display: grid; gap: var(--pwp-space-6); grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.pwp-indhub__card { display: grid; border: 1px solid var(--pwp-line); border-radius: var(--pwp-radius-sm); overflow: hidden; background: var(--pwp-card); text-decoration: none; color: var(--pwp-fg); }
.pwp-indhub__card:hover, .pwp-indhub__card:focus-visible { border-color: var(--pwp-accent); }
.pwp-indhub__thumb { inline-size: 100%; block-size: 170px; object-fit: cover; }
.pwp-indhub__body { padding: var(--pwp-space-5); display: grid; gap: var(--pwp-space-3); }
.pwp-indhub__title { margin: 0; font-family: var(--pwp-font-display); font-size: 1.05rem; text-transform: uppercase; }
.pwp-indhub__hook { margin: 0; font-size: 0.9rem; color: var(--pwp-fg-muted); }
.pwp-indhub__link { font-weight: 700; color: var(--pwp-accent-text); font-size: 0.85rem; }

@media (prefers-reduced-motion: reduce) {
  .pwp-indhero__photo, .pwp-diag__card, .pwp-ppsw__card, .pwp-indhub__card { transition: none; }
}

/* ---- Industries hub (public/industries/index.html) ---- */
.pwp-hubhero__intro { max-inline-size: 62ch; font-size: 1.05rem; color: var(--pwp-ink-inverse-muted); }
.pwp-hubgrid { display: grid; gap: var(--pwp-space-6); grid-template-columns: 1fr; }
@media (min-width: 640px) { .pwp-hubgrid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .pwp-hubgrid { grid-template-columns: repeat(3, 1fr); } }
.pwp-hubcard {
  display: grid;
  gap: var(--pwp-space-3);
  border: 1px solid var(--pwp-line);
  border-radius: var(--pwp-radius-sm);
  overflow: hidden;
  background: var(--pwp-surface);
  text-decoration: none;
  color: inherit;
}
.pwp-hubcard__photo { inline-size: 100%; block-size: 160px; object-fit: cover; display: block; }
.pwp-hubcard__body { padding: var(--pwp-space-5); display: grid; gap: var(--pwp-space-2); }
.pwp-hubcard__name { margin: 0; font-family: var(--pwp-font-display); font-size: 1.05rem; text-transform: uppercase; }
.pwp-hubcard__hook { margin: 0; font-size: 0.92rem; color: var(--pwp-fg-muted); }
.pwp-hubcard__link { font-weight: 600; color: var(--pwp-accent-text); }
.pwp-hubcard:hover .pwp-hubcard__link,
.pwp-hubcard:focus-visible .pwp-hubcard__link { text-decoration: underline; }
.pwp-hubcta {
  max-inline-size: 60ch;
  display: grid;
  gap: var(--pwp-space-4);
}

/* ======================================================================
   Premium craft pass — Industries hub + trade pages
   Header-safe breadcrumb, calmer heroes, editorial measures, live cards.
   Copy untouched; tokens only.
   ====================================================================== */

/* breadcrumb must clear the fixed desktop header */
@media (min-width: 1024px) {
  .pwp-crumbbar { padding-block-start: calc(var(--pwp-header-h-condensed) + var(--pwp-space-4)); }
}

/* heroes: no full-viewport dead space, editorial measure */
.pwp-page--industries-index #hero,
[class*="pwp-page--industries-"] #hero {
  min-block-size: 0;
  padding-block: clamp(var(--pwp-space-8), 8vw, var(--pwp-space-10));
  display: block;
}

.pwp-page--industries-index .pwp-hero__title,
[class*="pwp-page--industries-"] .pwp-hero__title {
  max-inline-size: 26ch;
  font-size: clamp(2rem, 3.6vw, 3.5rem);
  line-height: 1.06;
  letter-spacing: -0.015em;
  text-wrap: balance;
}

.pwp-hubhero__intro { max-inline-size: 54ch; }

[class*="pwp-page--industries-"] .pwp-hero__lead,
[class*="pwp-page--industries-"] .pwp-hero__body,
[class*="pwp-page--industries-"] #hero p { max-inline-size: 58ch; }

/* hub cards: even imagery, quiet lift, sliding arrow */
.pwp-hubcard__photo { block-size: auto; aspect-ratio: 16 / 10; }

.pwp-hubcard {
  transition: transform var(--pwp-dur-2, 300ms) var(--pwp-ease, ease),
              border-color var(--pwp-dur-2, 300ms) var(--pwp-ease, ease),
              box-shadow var(--pwp-dur-2, 300ms) var(--pwp-ease, ease);
}

.pwp-hubcard:hover,
.pwp-hubcard:focus-visible {
  transform: translateY(-4px);
  border-color: var(--pwp-accent);
  box-shadow: var(--pwp-shadow-lg);
}

.pwp-hubcard__link {
  display: inline-flex;
  gap: var(--pwp-space-2);
  transition: gap var(--pwp-dur-1, 160ms) var(--pwp-ease, ease);
}

.pwp-hubcard:hover .pwp-hubcard__link,
.pwp-hubcard:focus-visible .pwp-hubcard__link { gap: var(--pwp-space-3); text-decoration: none; }

/* trade page bodies: live surfaces on the recurring card patterns */
.pwp-diag__card,
.pwp-ppsw__card {
  transition: transform var(--pwp-dur-2, 300ms) var(--pwp-ease, ease),
              border-color var(--pwp-dur-2, 300ms) var(--pwp-ease, ease);
}

.pwp-diag__card:hover,
.pwp-ppsw__card:hover { transform: translateY(-3px); border-color: var(--pwp-accent); }

@media (prefers-reduced-motion: reduce) {
  .pwp-hubcard,
  .pwp-diag__card,
  .pwp-ppsw__card { transition: none; }
  .pwp-hubcard:hover,
  .pwp-diag__card:hover,
  .pwp-ppsw__card:hover { transform: none; }
}

/* ------------------------------------------------------------------
   Phone hero fit — long CTA sub-labels were forcing the copy column
   wider than the screen on four of the five trade pages.
   ------------------------------------------------------------------ */
[class*="pwp-page--industries-"] .pwp-hero__grid > * { min-inline-size: 0; }

@media (max-width: 47.99em) {
  [class*="pwp-page--industries-"] .pwp-hero__copy,
  [class*="pwp-page--industries-"] .pwp-hero__copy > * { min-inline-size: 0; max-inline-size: 100%; }

  [class*="pwp-page--industries-"] .pwp-hero__actions { display: grid; gap: var(--pwp-space-3); }
  [class*="pwp-page--industries-"] .pwp-hero__actions .pwp-btn { inline-size: 100%; min-inline-size: 0; }
  [class*="pwp-page--industries-"] .pwp-hero__actions .pwp-btn__stack,
  [class*="pwp-page--industries-"] .pwp-hero__actions .pwp-btn__sub {
    min-inline-size: 0;
    white-space: normal;
    overflow-wrap: anywhere;
  }
}

/* ======================================================================
   Who It's For hero (task 3) — split copy / fit-check panel
   ====================================================================== */
.pwp-page--industries-index #hero.pwp-whohero {
  padding-block: calc(var(--pwp-header-h) + clamp(var(--pwp-space-6), 5vw, var(--pwp-space-8)))
                 clamp(var(--pwp-space-8), 6vw, var(--pwp-space-10));
}
@media (min-width: 1024px) {
  .pwp-page--industries-index #hero.pwp-whohero {
    padding-block: calc(var(--pwp-header-h) + clamp(var(--pwp-space-7), 4.5vw, var(--pwp-space-9)))
                   clamp(var(--pwp-space-9), 6vw, var(--pwp-space-10));
  }
}
.pwp-whohero__grid {
  display: grid;
  gap: clamp(var(--pwp-space-7), 5vw, var(--pwp-space-9));
  align-items: center;
}
@media (min-width: 900px) {
  .pwp-whohero__grid { grid-template-columns: minmax(0, 1.12fr) minmax(0, 0.88fr); }
}
.pwp-whohero__copy { display: grid; gap: var(--pwp-space-5); min-inline-size: 0; }
.pwp-page--industries-index .pwp-whohero .pwp-eyebrow {
  max-inline-size: none;
  white-space: nowrap;
  font-size: clamp(0.6rem, 1.35vw, 0.72rem);
  letter-spacing: 0.11em;
}
@media (max-width: 430px) {
  .pwp-page--industries-index .pwp-whohero .pwp-eyebrow {
    white-space: normal;
    text-wrap: balance;
    letter-spacing: 0.08em;
  }
}
.pwp-page--industries-index .pwp-whohero .pwp-hero__title {
  margin: 0;
  max-inline-size: 24ch;
  font-size: clamp(2rem, 3.5vw, 3.6rem);
  text-wrap: balance;
}

.pwp-whohero__lead {
  margin: 0;
  max-inline-size: 46ch;
  font-size: clamp(1rem, 1.15vw, 1.12rem);
  line-height: 1.65;
  color: var(--pwp-ink-inverse-muted);
}
.pwp-whohero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--pwp-space-4);
  margin-block-start: var(--pwp-space-2);
}
.pwp-whohero__actions .pwp-btn--primary {
  flex-direction: column;
  gap: 2px;
  align-items: flex-start;
  text-align: start;
  padding-block: var(--pwp-space-3);
}
.pwp-whohero__actions .pwp-btn--primary small {
  font-size: 0.66rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  opacity: 0.78;
  font-weight: 600;
}

/* fit-check panel */
.pwp-fitcheck {
  --pwp-glass-bg: var(--pwp-glass-bg-dark);
  --pwp-glass-edge: var(--pwp-border-dark-strong);
  padding: clamp(var(--pwp-space-6), 3vw, var(--pwp-space-7));
  border-radius: var(--pwp-radius-lg);
  min-inline-size: 0;
  color: var(--pwp-ink-inverse);
}
.pwp-fitcheck__label {
  margin: 0 0 var(--pwp-space-5);
  font-family: var(--pwp-font-display);
  font-size: 0.7rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--pwp-accent-bright);
}
.pwp-fitcheck__rows { display: grid; gap: 0; margin: 0; }
.pwp-fitcheck__row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--pwp-space-3);
  padding-block: var(--pwp-space-4);
  border-block-start: 1px solid var(--pwp-border-dark);
}
.pwp-fitcheck__row:first-child { border-block-start: 0; padding-block-start: 0; }
.pwp-fitcheck__row dt {
  position: relative;
  margin: 0;
  padding-inline-start: 1.6rem;
  font-size: 0.82rem;
  color: var(--pwp-ink-inverse-muted);
}
.pwp-fitcheck__row dt::before {
  content: "";
  position: absolute;
  inset-inline-start: 0;
  inset-block-start: 0.35em;
  inline-size: 0.62rem;
  block-size: 0.34rem;
  border-inline-start: 2px solid var(--pwp-accent-bright);
  border-block-end: 2px solid var(--pwp-accent-bright);
  transform: rotate(-45deg);
}
.pwp-fitcheck__row dd {
  margin: 0;
  font-family: var(--pwp-font-display);
  font-size: clamp(0.95rem, 1.1vw, 1.05rem);
  font-weight: 700;
  color: var(--pwp-ink-inverse);
}
.pwp-fitcheck__foot {
  margin: var(--pwp-space-5) 0 0;
  padding-block-start: var(--pwp-space-4);
  border-block-start: 1px solid var(--pwp-border-dark);
  font-size: 0.8rem;
  color: var(--pwp-ink-inverse-muted);
}

/* ---- Who It's For: fit strip (task 4) ---- */
.pwp-fitstrip__title {
  max-inline-size: 22ch;
  margin-block-end: clamp(var(--pwp-space-6), 4vw, var(--pwp-space-8));
}
.pwp-fitstrip__grid {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  border-block-start: 1px solid var(--pwp-line);
}
@media (min-width: 640px) { .pwp-fitstrip__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .pwp-fitstrip__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.pwp-fitstrip__cell {
  display: grid;
  gap: var(--pwp-space-2);
  align-content: start;
  min-inline-size: 0;
  padding: clamp(var(--pwp-space-5), 3vw, var(--pwp-space-7)) var(--pwp-space-5);
  padding-inline-start: 0;
  border-block-end: 1px solid var(--pwp-line);
  transition: background-color var(--pwp-dur-base, 300ms) var(--pwp-ease-out, ease);
}
@media (min-width: 640px) {
  .pwp-fitstrip__cell { padding-inline-start: clamp(var(--pwp-space-4), 2vw, var(--pwp-space-6)); border-inline-start: 1px solid var(--pwp-line); }
  .pwp-fitstrip__cell:first-child { padding-inline-start: 0; border-inline-start: 0; }
}
@media (min-width: 1024px) {
  .pwp-fitstrip__cell:nth-child(n) { border-inline-start: 1px solid var(--pwp-line); }
  .pwp-fitstrip__cell:first-child { border-inline-start: 0; padding-inline-start: 0; }
}
.pwp-fitstrip__cell:hover { background: color-mix(in oklab, var(--pwp-fg) 3%, transparent); }
.pwp-fitstrip__figure {
  font-family: var(--pwp-font-display);
  font-size: clamp(1.9rem, 3.2vw, 2.9rem);
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--pwp-fg);
  overflow-wrap: anywhere;
}
.pwp-fitstrip__cell:hover .pwp-fitstrip__figure { color: var(--pwp-accent-text); }
.pwp-fitstrip__label {
  font-size: 0.82rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--pwp-fg-muted);
}
@media (prefers-reduced-motion: reduce) { .pwp-fitstrip__cell { transition: none; } }

/* ---- Who It's For: editorial trade cards (task 5) ---- */
#hub-grid .pwp-hubgrid { gap: clamp(var(--pwp-space-4), 2vw, var(--pwp-space-6)); }
@media (min-width: 1024px) {
  #hub-grid .pwp-hubgrid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  #hub-grid .pwp-hubcard { grid-column: span 2; }
  #hub-grid .pwp-hubcard:nth-child(1),
  #hub-grid .pwp-hubcard:nth-child(2) { grid-column: span 3; }
}
#hub-grid .pwp-hubcard {
  position: relative;
  gap: 0;
  border-radius: var(--pwp-radius-sm);
  border-color: var(--pwp-line);
  background: var(--pwp-surface);
  overflow: hidden;
  isolation: isolate;
}
#hub-grid .pwp-hubcard__photo {
  aspect-ratio: 16 / 9;
  filter: grayscale(0.55) contrast(1.05) brightness(0.9);
  transform: scale(1.01);
  transition: filter var(--pwp-dur-3, 560ms) var(--pwp-ease-out, ease),
              transform var(--pwp-dur-3, 560ms) var(--pwp-ease-out, ease);
}
@media (min-width: 1024px) {
  #hub-grid .pwp-hubcard:nth-child(1) .pwp-hubcard__photo,
  #hub-grid .pwp-hubcard:nth-child(2) .pwp-hubcard__photo { aspect-ratio: 16 / 7; }
}
#hub-grid .pwp-hubcard:hover .pwp-hubcard__photo,
#hub-grid .pwp-hubcard:focus-visible .pwp-hubcard__photo {
  filter: grayscale(0) contrast(1.02) brightness(1);
  transform: scale(1.045);
}
#hub-grid .pwp-hubcard__body {
  position: relative;
  padding: clamp(var(--pwp-space-5), 2.4vw, var(--pwp-space-7));
  gap: var(--pwp-space-3);
  align-content: start;
}
#hub-grid .pwp-hubcard__index {
  font-family: var(--pwp-font-display);
  font-size: 0.78rem;
  letter-spacing: 0.22em;
  color: var(--pwp-fg-muted);
}
#hub-grid .pwp-hubcard__index::after {
  content: "";
  display: block;
  inline-size: 28px;
  block-size: 2px;
  margin-block-start: var(--pwp-space-2);
  background: var(--pwp-accent);
  transition: inline-size var(--pwp-dur-2, 300ms) var(--pwp-ease-out, ease);
}
#hub-grid .pwp-hubcard:hover .pwp-hubcard__index::after,
#hub-grid .pwp-hubcard:focus-visible .pwp-hubcard__index::after { inline-size: 64px; }
#hub-grid .pwp-hubcard__name {
  font-size: clamp(1.05rem, 1.5vw, 1.35rem);
  line-height: 1.15;
  letter-spacing: -0.005em;
}
#hub-grid .pwp-hubcard__hook {
  max-inline-size: 42ch;
  font-size: 0.95rem;
  line-height: 1.55;
}
#hub-grid .pwp-hubcard__link {
  margin-block-start: var(--pwp-space-2);
  font-size: 0.82rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
#hub-grid .pwp-hubcard:hover,
#hub-grid .pwp-hubcard:focus-visible { transform: translateY(-4px); border-color: var(--pwp-accent); }
@media (prefers-reduced-motion: reduce) {
  #hub-grid .pwp-hubcard__photo { transition: none; transform: none; }
  #hub-grid .pwp-hubcard:hover .pwp-hubcard__photo { transform: none; }
}

/* ---- Who It's For: buyer journey (task 6) ---- */
.pwp-journey__inner { display: grid; gap: clamp(var(--pwp-space-6), 4vw, var(--pwp-space-9)); }
.pwp-journey__head { display: grid; gap: var(--pwp-space-3); max-inline-size: 60ch; }
.pwp-journey__lead { margin: 0; color: var(--pwp-ink-inverse-muted); max-inline-size: 46ch; }
.pwp-journey__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0;
  border-block-start: 1px solid color-mix(in oklab, var(--pwp-ink-inverse) 18%, transparent);
}
@media (min-width: 768px) { .pwp-journey__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .pwp-journey__list { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.pwp-journey__step {
  position: relative;
  min-inline-size: 0;
  display: grid;
  gap: var(--pwp-space-2);
  align-content: start;
  padding: clamp(var(--pwp-space-5), 2.6vw, var(--pwp-space-7)) var(--pwp-space-5)
           clamp(var(--pwp-space-6), 3vw, var(--pwp-space-8)) 0;
  border-block-end: 1px solid color-mix(in oklab, var(--pwp-ink-inverse) 14%, transparent);
  transition: background-color var(--pwp-dur-2, 300ms) var(--pwp-ease-out, ease);
}
@media (min-width: 768px) {
  .pwp-journey__step { padding-inline-start: clamp(var(--pwp-space-4), 2vw, var(--pwp-space-6)); border-inline-start: 1px solid color-mix(in oklab, var(--pwp-ink-inverse) 14%, transparent); }
  .pwp-journey__step:nth-child(odd) { border-inline-start: 0; padding-inline-start: 0; }
}
@media (min-width: 1200px) {
  .pwp-journey__step:nth-child(odd) { border-inline-start: 1px solid color-mix(in oklab, var(--pwp-ink-inverse) 14%, transparent); padding-inline-start: clamp(var(--pwp-space-4), 2vw, var(--pwp-space-6)); }
  .pwp-journey__step:first-child { border-inline-start: 0; padding-inline-start: 0; }
}
.pwp-journey__step:hover { background: color-mix(in oklab, var(--pwp-ink-inverse) 4%, transparent); }
.pwp-journey__num {
  font-family: var(--pwp-font-display);
  font-size: 0.78rem;
  letter-spacing: 0.22em;
  color: var(--pwp-accent-text-on-dark, var(--pwp-accent));
}
.pwp-journey__name {
  margin: 0;
  font-family: var(--pwp-font-display);
  font-size: clamp(1.05rem, 1.5vw, 1.25rem);
  text-transform: uppercase;
  line-height: 1.2;
  color: var(--pwp-ink-inverse);
}
.pwp-journey__copy { margin: 0; color: var(--pwp-ink-inverse-muted); font-size: 0.95rem; line-height: 1.55; max-inline-size: 34ch; }
.pwp-journey__link {
  margin-block-start: var(--pwp-space-2);
  display: inline-flex;
  gap: var(--pwp-space-2);
  align-items: center;
  font-size: 0.8rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--pwp-ink-inverse);
  text-decoration: none;
  transition: gap var(--pwp-dur-1, 160ms) var(--pwp-ease-out, ease), color var(--pwp-dur-1, 160ms) var(--pwp-ease-out, ease);
}
.pwp-journey__link:hover,
.pwp-journey__link:focus-visible { gap: var(--pwp-space-3); color: var(--pwp-accent); }
@media (prefers-reduced-motion: reduce) { .pwp-journey__step, .pwp-journey__link { transition: none; } }

/* Task 7 — Who it's not for + role fit */
.pwp-notfor { display: grid; gap: clamp(var(--pwp-space-7), 5vw, var(--pwp-space-10)); }
.pwp-notfor__head { display: grid; gap: var(--pwp-space-3); max-inline-size: 52ch; }
.pwp-notfor__list {
  list-style: none; margin: 0; padding: 0; display: grid; gap: 0;
  border-block-start: 1px solid var(--pwp-line);
}
.pwp-notfor__item {
  display: grid; gap: var(--pwp-space-1);
  padding-block: clamp(var(--pwp-space-4), 2.4vw, var(--pwp-space-6));
  border-block-end: 1px solid var(--pwp-line);
  position: relative;
}
.pwp-notfor__item::before {
  content: ""; position: absolute; inset-inline-start: calc(-1 * clamp(var(--pwp-space-4), 3vw, var(--pwp-space-8)));
  inset-block: 0; inline-size: 2px; background: var(--pwp-accent);
  transform: scaleY(0); transform-origin: top; transition: transform 300ms var(--pwp-ease, ease);
}
.pwp-notfor__item:hover::before { transform: scaleY(1); }
.pwp-notfor__name { margin: 0; font-size: var(--pwp-step-1, 1.125rem); font-weight: 600; letter-spacing: -0.01em; }
.pwp-notfor__why { margin: 0; color: var(--pwp-ink-muted, var(--pwp-fg-muted)); max-inline-size: 62ch; }
@media (min-width: 900px) {
  .pwp-notfor__item { grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); align-items: baseline; gap: clamp(var(--pwp-space-5), 3vw, var(--pwp-space-8)); }
}

.pwp-roles {
  display: grid;
  gap: clamp(var(--pwp-space-7), 5vw, var(--pwp-space-10));
}
.pwp-roles__head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: var(--pwp-space-4);
  max-inline-size: none;
}
.pwp-roles__head .pwp-eyebrow {
  margin: 0;
}
.pwp-roles__head .pwp-sectionhead__title {
  margin: 0;
  padding-inline-start: clamp(var(--pwp-space-5), 3vw, var(--pwp-space-8));
  border-inline-start: 1px solid var(--pwp-line-strong);
}
.pwp-roles__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-block-start: 1px solid var(--pwp-line-strong);
  border-inline-start: 1px solid var(--pwp-line-strong);
  counter-reset: pwp-role;
}
.pwp-roles__row {
  position: relative;
  min-block-size: clamp(180px, 16vw, 240px);
  padding: clamp(var(--pwp-space-5), 3vw, var(--pwp-space-7));
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: var(--pwp-space-3);
  border-block-end: 1px solid var(--pwp-line-strong);
  border-inline-end: 1px solid var(--pwp-line-strong);
  counter-increment: pwp-role;
  overflow: hidden;
  transition: background-color var(--pwp-dur-base) var(--pwp-ease-out);
}
.pwp-roles__row::before {
  content: "0" counter(pwp-role);
  position: absolute;
  inset-block-start: var(--pwp-space-4);
  inset-inline-end: var(--pwp-space-4);
  font-family: var(--pwp-font-display);
  font-size: var(--pwp-fs-micro);
  letter-spacing: var(--pwp-track-label);
  color: var(--pwp-ink-inverse-muted);
}
.pwp-roles__row:hover { background: color-mix(in oklab, var(--pwp-fg) 4%, transparent); }
.pwp-roles__role {
  margin: 0;
  max-inline-size: 14ch;
  font-family: var(--pwp-font-display);
  font-size: clamp(1.5rem, 3vw, 2.65rem);
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: 0;
  text-transform: uppercase;
  color: var(--pwp-accent-text);
}
.pwp-roles__change {
  margin: 0;
  max-inline-size: 42ch;
  color: var(--pwp-ink-inverse-muted);
}
@media (max-width: 767px) {
  .pwp-roles__head {
    grid-template-columns: 1fr;
    align-items: start;
  }
  .pwp-roles__head .pwp-sectionhead__title {
    padding-inline-start: 0;
    padding-block-start: var(--pwp-space-4);
    border-inline-start: 0;
    border-block-start: 1px solid var(--pwp-line-strong);
  }
  .pwp-roles__list { grid-template-columns: 1fr; }
  .pwp-roles__row { min-block-size: 164px; }
}
@media (prefers-reduced-motion: reduce) {
  .pwp-notfor__item::before, .pwp-roles__row { transition: none; }
}

/* Task 8 — Closing CTA: modern professional minimalist */
#hub-cta {
  position: relative;
  min-block-size: min(620px, calc(100svh - var(--pwp-header-h-condensed)));
  padding-block: clamp(var(--pwp-space-8), 7vw, var(--pwp-space-10));
  display: grid;
  align-items: center;
  overflow: hidden;
}
.pwp-hubcta {
  position: relative;
  z-index: 0;
  max-inline-size: 880px;
  margin-inline: auto;
  padding-inline: clamp(0px, 3vw, var(--pwp-space-7));
  justify-items: center;
  text-align: center;
  gap: clamp(var(--pwp-space-4), 2vw, var(--pwp-space-6));
}
.pwp-hubcta__index {
  position: absolute;
  z-index: -1;
  inset-block-start: clamp(-3rem, -5vw, -1.25rem);
  inset-inline-end: clamp(0px, 3vw, var(--pwp-space-7));
  font-family: var(--pwp-font-display);
  font-size: clamp(7rem, 15vw, 12rem);
  font-weight: 700;
  line-height: 0.8;
  color: color-mix(in oklab, var(--pwp-fg) 5%, transparent);
  user-select: none;
  pointer-events: none;
}
.pwp-hubcta .pwp-sectionhead__title {
  margin: 0;
  max-inline-size: 18ch;
  font-size: clamp(2.25rem, 5vw, 4.25rem);
  line-height: 1.02;
  letter-spacing: 0;
  text-transform: uppercase;
  text-wrap: balance;
}
.pwp-hubcta .pwp-sectionhead__title span {
  color: var(--pwp-accent-text);
}
.pwp-hubcta p {
  margin: 0;
  max-inline-size: 62ch;
  color: var(--pwp-ink-muted, var(--pwp-fg-muted));
  font-size: clamp(0.98rem, 1.3vw, 1.125rem);
  line-height: 1.7;
  text-wrap: balance;
}
.pwp-hubcta .pwp-btn {
  min-inline-size: min(100%, 292px);
}
@media (max-width: 639px) {
  #hub-cta {
    min-block-size: 0;
    padding-block: var(--pwp-space-9);
  }
  .pwp-hubcta { padding-inline: 0; }
  .pwp-hubcta__index {
    inset-block-start: -2rem;
    inset-inline-end: 0;
    font-size: 7rem;
  }
  .pwp-hubcta .pwp-sectionhead__title {
    max-inline-size: 15ch;
    font-size: clamp(2rem, 10vw, 2.75rem);
  }
  .pwp-hubcta .pwp-btn { inline-size: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .pwp-hubcta { transition: none; }
}
/* widen the breathing room before the final band */
#roles { padding-block-end: clamp(var(--pwp-space-9, 4rem), 8vw, 7rem); }

/* Visual layer */
.pwp-indvalue__list li { display: flex; align-items: center; gap: var(--pwp-space-3); flex-wrap: wrap; }
.pwp-indvalue__list li {
  display: grid;
  grid-template-columns: auto auto 1fr;
  align-items: center;
  gap: var(--pwp-space-3);
}