/* ==========================================================================
   Brand page (/for-brands). Layers on home.css + platform.css (prefix pb-).
   Same system as the University page: wide shell, shared --t-* type scale,
   monsters are separate transparent PNGs placed by CSS (swap the file, keep
   the class), each block sized to the window height on laptops, compact
   stacked cards on phones.
   ========================================================================== */
.pb-page { background: #fefcf6; }
.pb-page h1, .pb-page h2, .pb-page h3 { letter-spacing: -.035em; }
.pb-page main .hm-shell { max-width: min(1340px, calc(100vw - 3rem)); }
.pb-page main > section { padding-block: clamp(0.75rem, 2.4vh, 1.75rem); }
.pb-mon { display: block; height: auto; }

/* ---------- shared bits ---------- */
.pb-eyebrow { margin: 0 0 0.5rem; text-align: center; font-size: clamp(0.8125rem, 1.9vh, 1rem); font-weight: 900; letter-spacing: 0.28em; text-transform: uppercase; color: var(--hm-orange); }
.pb-eyebrow--lime { color: #c8f562; }
.pb-eyebrow--dark { color: var(--hm-ink); }
.pb-eyebrow--left { text-align: left; }
.pb-h { margin: 0; text-align: center; font-size: var(--t-h); line-height: 1.04; font-weight: 900; text-wrap: balance; }
.pb-h b { color: var(--hm-orange); }
.pb-h--left { text-align: left; }
.pb-h--light { color: #fff; }
.pb-lead { margin: 0.75rem 0 0; font-size: var(--t-lead); line-height: 1.4; color: #2a2f37; }
.pb-pill { display: inline-block; padding: 0.3rem 0.9rem; border-radius: 999px; background: #c8f562; font-size: clamp(0.6875rem, 1.6vh, 0.8125rem); font-weight: 900; letter-spacing: 0.12em; text-transform: uppercase; color: #14171c; }
.pb-pill--c { margin-inline: auto; display: table; }
.pb-tag { display: inline-block; padding: 0.25rem 0.75rem; border-radius: 999px; background: var(--hm-orange); color: #fff; font-size: 0.75rem; font-weight: 900; letter-spacing: 0.12em; text-transform: uppercase; }
.pb-ck { flex: 0 0 auto; display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: #c8f562; color: #14171c; }
.pb-ck svg { width: 13px; height: 13px; }
.pb-checks { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: clamp(0.2rem, 0.9vh, 0.45rem); font-size: var(--t-body); line-height: 1.3; }
.pb-checks li { display: flex; align-items: center; gap: 0.625rem; }
.pb-ghost { border: 2px solid #fff; background: transparent; color: #fff; }
.pb-ghost:hover { background: #fff; color: #0c1c34; }
.pb-lime { background: #c8f562; color: #14171c; }
.pb-lime:hover { background: #c8f562; }

/* ---------- 01 Hero (same build as the University hero) ---------- */
/* the deal card: built live (no art, no video) */
.pb-deal__chip { position: absolute; right: 3em; top: -1.9em; display: inline-flex; align-items: center; gap: 0.7em; padding: 0.8em 1.4em; border-radius: 1.2em; background: #fff; box-shadow: 0 0.5em 1.6em rgba(0,0,0,.25); font-size: 1.25em; font-weight: 700; white-space: nowrap; }
.pb-deal__chip i { display: grid; place-items: center; width: 1.9em; height: 1.9em; border-radius: 50%; background: #2f9e44; color: #fff; }
.pb-deal__chip i svg { width: 1.1em; height: 1.1em; }
.pb-deal__chip b { font-size: 1.3em; font-weight: 900; }
.pb-deal__thumb { position: relative; flex: 0 0 41%; display: flex; align-items: flex-end; justify-content: center; overflow: hidden; border-radius: 1.3em; background: linear-gradient(165deg, #aee9df 0%, #5fc9c2 100%); }
.pb-deal__mon { width: 100%; height: 92%; object-fit: contain; object-position: 50% 100%; }
.pb-deal__body { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; justify-content: space-between; gap: 1em; }
.pb-deal__r3 { display: grid; grid-template-columns: 1fr 1fr; gap: 1.4em; }
.pb-deal__ch { display: flex; gap: 0.6em; margin-top: 0.5em; }
.pb-deal__ch i { display: grid; place-items: center; width: 2.1em; height: 2.1em; color: #9aa0a9; }
.pb-deal__ch i svg { width: 100%; height: 100%; }
.pb-deal__r2 { padding-top: 1.1em; border-top: 0.15em solid #e6e8ec; }
.pb-deal__r4 { display: flex; flex-wrap: wrap; align-items: center; gap: 0.8em; }
.pb-pill2 { display: inline-flex; align-items: center; gap: 0.5em; padding: 0.5em 0.9em; border-radius: 99em; background: #e5f6ea; font-size: 1em; font-weight: 700; white-space: nowrap; }
.pb-pill2--r { background: #fde9e3; }
.pb-pill2 i { display: block; width: 1.3em; height: 1.3em; }
.pb-pill2 i svg { width: 100%; height: 100%; }
.pb-deal__btn { margin-left: auto; padding: 0.8em 1.8em; border-radius: 99em; background: var(--hm-orange); color: #fff; font-size: 1.2em; font-weight: 900; }

/* ---------- 02 Proof ---------- */
.pb-proof { background: #fefcf6; padding-top: clamp(1.25rem, 4vh, 2.5rem) !important; }
.pb-proof__inner { display: grid; grid-template-columns: 1fr; justify-items: center; gap: 0.5rem; text-align: center; }
.pb-proof__mon { width: 36%; max-width: 150px; }
.pb-proof .pb-h { max-width: 1000px; }
.pb-proof__stats { display: grid; grid-template-columns: 1fr; gap: 0.5rem; width: 100%; max-width: 1000px; margin-top: clamp(0.5rem, 2.4vh, 1.5rem); }
.pb-pstat b { display: block; font-size: clamp(3rem, 11vh, 6.5rem); font-weight: 900; line-height: 0.95; letter-spacing: -.05em; color: #f95a10; }
.pb-pstat span { display: block; font-size: var(--t-body); font-weight: 900; line-height: 1.2; }
@media (min-width: 900px) {
  .pb-proof__inner { grid-template-columns: clamp(130px, 22vh, 220px) 1fr; align-items: center; justify-items: stretch; gap: clamp(1rem, 3vw, 3rem); }
  .pb-proof__mon { grid-row: 1 / 3; width: 100%; max-width: none; align-self: end; }
  .pb-proof__inner > .pb-h, .pb-proof__stats { grid-column: 2; margin-inline: auto; }
  .pb-proof__stats { grid-template-columns: repeat(3, 1fr); }
  .pb-pstat { padding-inline: 1rem; }
  .pb-pstat + .pb-pstat { border-left: 1.5px solid #d8d5c8; }
}

/* ---------- 03 Problem ---------- */
.pb-prob { background: #071939; color: #fff; }
.pb-prob__grid { display: grid; grid-template-columns: 1fr; gap: 1rem; align-items: center; }
.pb-prob__copy .pb-eyebrow { text-align: left; }
.pb-prob__copy .pb-h { text-align: left; }
.pb-prob__copy .pb-h u { color: #c8f562; text-decoration: none; }
.pb-prob__cards { display: flex; flex-direction: column; gap: clamp(0.5rem, 1.4vh, 0.875rem); }
.pb-pc { display: grid; grid-template-columns: 36% 1fr; min-height: 132px; overflow: hidden; border-radius: 18px; background: #f8f1e7; color: #14171c; }
.pb-pc__stage { position: relative; background: #f8f1e7; overflow: hidden; }
.pb-pc__art { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; object-position: 50% 100%; padding: 0.375rem 0.375rem 0; box-sizing: border-box; }
.pb-pc__stage--scene .pb-pc__art { object-fit: cover; object-position: 50% 30%; padding: 0; }
.pb-pc__t { align-self: center; padding: 0.625rem 1rem; }
.pb-pc h3 { margin: 0 0 0.25rem; font-size: var(--t-card); line-height: 1.1; font-weight: 900; }
.pb-pc p { margin: 0; font-size: var(--t-body); line-height: 1.38; color: #2a2f37; }
@media (min-width: 900px) {
  .pb-prob__grid { grid-template-columns: 0.82fr 1.5fr; gap: 2rem; }
  .pb-pc { --ph: clamp(120px, calc((100vh - 73px - 8vh - 1.5rem) / 3), 300px); grid-template-columns: var(--ph) 1fr; height: var(--ph); min-height: 0; }
  .pb-pc__t { padding: 0.5rem 1.5rem; }
}
@media (max-width: 899px) { .pb-pc p { font-size: 0.9375rem; } .pb-pc h3 { font-size: 1.1875rem; } .pb-pc__t { padding: 0.75rem 0.875rem; } }

/* ---------- 04 Solution ---------- */
.pb-sol { background: #fff; }
.pb-sol__grid { display: grid; grid-template-columns: 1fr; gap: 1.25rem; align-items: center; }
.pb-sol__copy .pb-h { margin-top: 0.5rem; text-align: left; }
.pb-sol__copy .pb-h span { display: inline; }
.pb-sol__copy .pb-lead { max-width: 560px; }
.pb-steps { list-style: none; margin: clamp(0.5rem, 1.8vh, 1.125rem) 0 clamp(0.625rem, 2vh, 1.25rem); padding: 0; display: flex; flex-direction: column; gap: clamp(0.5rem, 1.6vh, 1rem); }
.pb-steps li { display: flex; gap: 1rem; align-items: flex-start; }
.pb-steps__n { flex: 0 0 auto; display: grid; place-items: center; width: clamp(38px, 5.6vh, 52px); height: clamp(38px, 5.6vh, 52px); border-radius: 50%; background: #c8f562; font-size: 1.375rem; font-weight: 900; }
.pb-steps h3 { margin: 0; font-size: var(--t-card); line-height: 1.1; font-weight: 900; }
.pb-steps p { margin: 0.2rem 0 0; font-size: var(--t-small); line-height: 1.34; color: #2a2f37; }
/* deals tablet, built live */
.pb-solart { position: relative; container-type: inline-size; width: min(100%, 600px, calc((100vh - 170px) * 0.92)); margin-inline: auto; padding-bottom: 4%; }
.pb-tab { width: 82%; box-sizing: border-box; padding: 2.2cqw; border: 0.7cqw solid #e4e6ea; border-radius: 3.4cqw; background: #fff; box-shadow: 0 2cqw 5cqw rgba(20,30,60,.14); font-size: 2cqw; }
.pb-tab__top { display: flex; align-items: center; gap: 1em; }
.pb-tab__top b { margin-right: auto; font-size: 2.1em; font-weight: 900; }
.pb-tab__sel { padding: 0.45em 1em; border: 1px solid #d5d8de; border-radius: 0.7em; font-size: 1.1em; font-weight: 700; }
.pb-tab__ic { display: grid; place-items: center; width: 2.5em; height: 2.5em; border: 1px solid #d5d8de; border-radius: 0.7em; }
.pb-tab__ic svg { width: 1.3em; height: 1.3em; }
.pb-tab__stats { display: grid; grid-template-columns: 1fr 1fr; gap: 0.8em; margin-top: 1em; }
.pb-tab__stats div { display: flex; align-items: center; gap: 0.7em; padding: 0.9em 1em; border: 1px solid #e3e5ea; border-radius: 0.8em; font-size: 1.05em; font-weight: 700; }
.pb-tab__stats i { display: block; width: 1.9em; height: 1.9em; color: #4a4f57; }
.pb-tab__stats i svg { width: 100%; height: 100%; }
.pb-tab__h { margin: 1.1em 0 0.6em; font-size: 1.4em; font-weight: 900; }
.pb-tab__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1em 0.9em; }
.pb-tab__c u { display: block; height: 0.8em; margin-top: 0.7em; border-radius: 0.4em; background: #dcdee3; }
.pb-tab__c u.s { width: 60%; margin-top: 0.45em; }
.pb-tab__c s { display: flex; align-items: center; gap: 0.4em; margin-top: 0.6em; font-size: 1em; font-weight: 700; text-decoration: none; }
.pb-tab__c s i { flex: 0 0 40%; height: 0.8em; border-radius: 0.4em; background: #dcdee3; }
.pb-tab__th { display: flex; align-items: flex-start; justify-content: center; aspect-ratio: 1 / 1.05; overflow: hidden; border-radius: 0.9em; }
.pb-tab__th--teal { background: #bfe9e2; } .pb-tab__th--orange { background: #fcd9b8; } .pb-tab__th--pink { background: #f9cfe0; }
.pb-tab__th--blue { background: #cfe3f8; } .pb-tab__th--lilac { background: #e1d3f4; }
.pb-tab__mon { width: 150%; max-width: none; height: auto; margin-top: -4%; flex: none; }
.pb-solart__mon { position: absolute; right: -1%; bottom: 0; width: 44%; z-index: 2; }
@media (min-width: 900px) { .pb-sol__grid { grid-template-columns: 1.05fr 0.95fr; gap: 2rem; } .pb-solart { margin-right: 0; } }

/* ---------- Three ways ---------- */
.pb-three { background: #fdf8ee; }
.pb-three__h { margin-top: 0.375rem; }
.pb-three__sub { margin-top: 0.25rem; text-align: center; }
.pb-three__grid { display: grid; grid-template-columns: 1fr; gap: 0.75rem; margin-top: clamp(0.5rem, 1.8vh, 1.125rem); }
.pb-way { display: flex; flex-direction: column; align-items: flex-start; gap: 0.375rem; padding: 0.625rem 0.625rem 0.875rem; border: 1.5px solid #e6e1d2; border-radius: 18px; background: #fffefa; }
.pb-way__stage { align-self: stretch; display: flex; align-items: flex-end; justify-content: center; height: clamp(120px, 22vh, 230px); overflow: hidden; border-radius: 12px; }
.pb-way__stage--peach { background: #fdeadb; } .pb-way__stage--green { background: #e3f6c8; } .pb-way__stage--blue { background: #dfe9f7; }
.pb-way__mon { height: 100%; width: auto; max-width: 90%; object-fit: contain; object-position: 50% 100%; }
.pb-way .pb-tag { margin: 0.25rem 0 0 0.375rem; }
.pb-way h3 { margin: 0 0 0 0.375rem; font-size: var(--t-card); line-height: 1.1; font-weight: 900; }
.pb-way p { margin: 0 0.375rem; font-size: var(--t-body); line-height: 1.34; color: #3a3f47; }
.pb-way .pb-checks { margin: 0.25rem 0.375rem 0; font-size: var(--t-small); }
.pb-three__cta { text-align: center; margin-top: clamp(0.5rem, 1.6vh, 1rem); }
@media (min-width: 900px) { .pb-three__grid { grid-template-columns: repeat(3, 1fr); gap: 1rem; } .pb-way__stage { height: clamp(100px, 18vh, 200px); } }

/* ---------- 05 Features ---------- */
.pb-feat { background: #071939; color: #fff; }
.pb-feat__head { position: relative; text-align: center; }
.pb-feat__head .pb-h .o { color: #f4682b; } .pb-feat__head .pb-h .l { color: #c8f562; }
.pb-feat__lead { max-width: 720px; margin: clamp(0.5rem, 1.6vh, 1rem) auto 0; color: #dfe2e6; }
.pb-feat__mon { display: none; }
.pb-feat__cards { display: grid; grid-template-columns: 1fr; gap: 0.625rem; margin-top: clamp(0.75rem, 2vh, 1.25rem); }
.pb-fc { display: grid; grid-template-columns: 40% 1fr; align-items: center; gap: 0.5rem; padding: 0.375rem 0.75rem 0.375rem 0.375rem; border-radius: 16px; background: #fbf6ec; color: #14171c; }
.pb-fc__art { display: block; width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.pb-fc h3 { margin: 0 0 0.2rem; font-size: clamp(1.0625rem, 2.6vh, 1.5rem); line-height: 1.1; font-weight: 900; }
.pb-fc p { margin: 0; font-size: var(--t-small); line-height: 1.32; color: #2a2f37; }
@media (min-width: 900px) {
  .pb-feat__head { padding-inline: clamp(160px, 24vh, 300px); }
  .pb-feat__mon { display: block; position: absolute; right: 0; bottom: -4px; height: clamp(120px, 24vh, 250px); width: auto; }
  .pb-feat__cards { grid-template-columns: 1fr 1fr; gap: clamp(0.5rem, 1.4vh, 0.875rem); }
  .pb-fc { grid-template-columns: 0.9fr 1.1fr; gap: 0.75rem; height: clamp(110px, 18vh, 190px); }
}
@media (max-width: 899px) { .pb-fc { min-height: 96px; } .pb-fc h3 { font-size: 1.0625rem; } .pb-fc p { font-size: 0.875rem; } }

/* ---------- 06 Case study ---------- */
.pb-case { background: #c8f562; }
.pb-case .pb-h span { color: var(--hm-orange); }
.pb-cs { display: grid; grid-template-columns: 1fr; margin-top: clamp(0.5rem, 1.8vh, 1.125rem); overflow: hidden; border: 2px solid #0f1c3d; border-radius: 22px; background: #fdf8ee; }
.pb-cs__photo { position: relative; display: flex; align-items: flex-end; justify-content: center; min-height: 240px; margin: 0.625rem; border-radius: 14px; background: #071939; overflow: hidden; }
.pb-cs__mon { position: absolute; left: 50%; bottom: 0; height: 94%; width: auto; transform: translateX(-50%); }
.pb-cs__cap { position: absolute; left: 4%; bottom: 6%; padding: 0.4rem 0.9rem; border-radius: 10px; background: #fff; color: #14171c; font-size: 0.875rem; font-weight: 700; }
.pb-cs__copy { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: clamp(0.4rem, 1.4vh, 0.875rem); padding: 1.25rem 1.5rem; }
.pb-cs__copy h3 { margin: 0; font-size: var(--t-card); line-height: 1.1; font-weight: 900; }
.pb-cs__stat { display: flex; align-items: center; gap: 1.25rem; padding: 0.375rem 1.25rem; border-radius: 12px; background: #d9f68a; }
.pb-cs__stat b { font-size: clamp(2.5rem, 9vh, 5rem); font-weight: 900; line-height: 1; letter-spacing: -.05em; }
.pb-cs__stat i { align-self: stretch; width: 2px; background: #14171c; opacity: .7; margin-block: 0.5rem; }
.pb-cs__stat span { font-size: clamp(1.125rem, 3vh, 1.75rem); font-weight: 900; }
.pb-cs__copy p { margin: 0; font-size: var(--t-body); line-height: 1.4; color: #2a2f37; }
.pb-cq { display: grid; grid-template-columns: 1fr; gap: 0.625rem; margin-top: clamp(0.5rem, 1.6vh, 1rem); }
.pb-quote { margin: 0; padding: 0.75rem 1.125rem; border-radius: 18px; background: #fdf8ee; display: grid; grid-template-columns: auto 1fr; gap: 0.25rem 0.875rem; align-items: center; }
.pb-av { display: grid; place-items: center; width: clamp(48px, 8vh, 64px); height: clamp(48px, 8vh, 64px); border-radius: 50%; background: #d9d8de; overflow: hidden; }
.pb-av svg { width: 70%; height: 70%; } .pb-av svg * { fill: #aeb1ba; }
.pb-quote footer b { display: block; font-size: var(--t-body); }
.pb-quote footer small { display: block; font-size: var(--t-small); color: #4a4f57; }
.pb-quote p { grid-column: 1 / -1; margin: 0.25rem 0 0; padding-top: 0.5rem; border-top: 2px solid #c8f562; font-size: var(--t-small); line-height: 1.38; }
@media (min-width: 900px) {
  .pb-cs { grid-template-columns: 1.3fr 1fr; }
  .pb-cs__photo { min-height: 0; height: clamp(200px, 35vh, 380px); }
  .pb-cq { grid-template-columns: repeat(3, 1fr); gap: 1rem; }
}

/* ---------- 07 Why Athios (navy, like University) ---------- */
.pb-why { background: #071939; color: #fff; }
.pb-why .pb-eyebrow, .pb-why .pb-h { text-align: left; }
.pb-why__stage { position: relative; margin-top: clamp(1.5rem, 5vh, 3rem); }
.pb-why__duo { display: flex; align-items: flex-end; justify-content: center; gap: 0.25rem; margin: 0 0 -0.25rem; }
.pb-why__duo .pb-mon { width: 46%; max-width: 230px; }
.pb-why .pl-table-wrap { overflow: visible; }
.pb-why .pl-table { min-width: 0; width: 100%; table-layout: fixed; border: 0; border-radius: 18px; background: #fbf7ee; color: #14171c; font-size: var(--t-small); }
.pb-why .pl-table thead th { padding-top: clamp(0.5rem, 1.6vh, 0.9rem); background: #fbf7ee; font-size: var(--t-body); }
.pb-why .pl-table tbody th { background: #0b1f48; color: #fff; border-bottom-color: rgba(255,255,255,.12); white-space: nowrap; }
.pb-why .pl-table thead th:first-child { background: #0b1f48; color: #fff; }
.pb-why .pl-table .is-athios { background: #c8f562; color: #14171c; border-left: 0; border-right: 0; box-shadow: none; }
.pb-why .pl-table tbody tr:last-child .is-athios { border-bottom: 0; box-shadow: none; }
.pb-why .pl-table thead .is-athios { position: relative; padding-top: 2.15rem; font-size: var(--t-card); }
.pb-why .pl-table__badge { top: 0.4rem; padding: 0.3rem 0.8rem; font-size: 0.625rem; }
.pb-why .pl-table td, .pb-why .pl-table th { padding-block: clamp(0.3rem, 1.1vh, 0.65rem); }
.pb-why .pl-table th:nth-child(1) { width: 20%; } .pb-why .pl-table th:nth-child(2) { width: 26%; }
.pb-why .pl-table th:nth-child(3) { width: 28%; } .pb-why .pl-table th:nth-child(4) { width: 26%; }
@media (min-width: 900px) {
  .pb-why .pb-h { max-width: 52%; }
  .pb-why__duo { position: absolute; right: 2%; bottom: 100%; margin: 0; gap: 0; z-index: 2; pointer-events: none; }
  .pb-why__duo .pb-mon { width: auto; max-width: none; height: clamp(130px, 21vh, 205px); }
  .pb-why .pl-table-wrap { width: 92%; margin-inline: auto; }
}
@media (max-width: 899px) {
  .pb-why .pl-table { font-size: 0.75rem; line-height: 1.25; }
  .pb-why .pl-table th, .pb-why .pl-table td { padding: 0.5rem 0.3rem; vertical-align: middle; }
  .pb-why .pl-table thead th { font-size: 0.625rem; letter-spacing: -0.01em; line-height: 1.15; padding-top: 2.1rem; vertical-align: bottom; overflow-wrap: break-word; }
  .pb-why .pl-table thead .is-athios { font-size: 0.875rem; padding-top: 2.4rem; }
  .pb-why .pl-table__badge { font-size: 0.4375rem; padding: 0.2rem 0.4rem; white-space: normal; text-align: center; line-height: 1.1; width: 90%; letter-spacing: 0.04em; top: 0.35rem; }
  .pb-why .pl-table tbody th { white-space: normal; font-size: 0.6875rem; }
  .pb-why .pl-cell { flex-direction: column; align-items: flex-start; gap: 0.25rem; white-space: normal; }
  .pb-why .pl-cell span { overflow-wrap: break-word; word-break: normal; hyphens: none; }
  .pb-why .pl-mark { width: 16px; height: 16px; font-size: 0.5625rem; }
  .pb-why .pl-table th:nth-child(1) { width: 22%; } .pb-why .pl-table th:nth-child(2) { width: 24%; }
  .pb-why .pl-table th:nth-child(3) { width: 28%; } .pb-why .pl-table th:nth-child(4) { width: 26%; }
}

/* ---------- 08 FAQ ---------- */
.pb-faq { background: #c8f562; }
.pb-faq__head { display: grid; grid-template-columns: 1fr; gap: 0.75rem; align-items: center; padding: clamp(0.75rem, 2vh, 1.25rem) clamp(1rem, 2.5vw, 1.75rem); border: 2px solid #0f1c3d; border-radius: 22px; background: #fdf8ee; }
.pb-faq__head .pb-eyebrow { margin-bottom: 0.25rem; }
.pb-faq__sub { margin: 0.5rem 0 0; font-size: var(--t-lead); line-height: 1.38; color: #14171c; }
.pb-faq__list { display: grid; grid-template-columns: 1fr; margin-top: clamp(0.5rem, 1.6vh, 1rem); padding: clamp(0.25rem, 1vh, 0.625rem) clamp(1rem, 2vw, 1.5rem); border: 2px solid #0f1c3d; border-radius: 22px; background: #fdf8ee; }
.pb-q { padding: clamp(0.4rem, 1.3vh, 0.8rem) 0; border-top: 2px solid #0f1c3d; }
.pb-q:first-child { border-top: 0; }
.pb-q h3 { margin: 0 0 0.2rem; font-size: clamp(1rem, 2.3vh, 1.375rem); line-height: 1.15; font-weight: 900; color: #0f1c3d; }
.pb-q p { margin: 0; font-size: clamp(0.875rem, 1.95vh, 1.125rem); line-height: 1.36; color: #14171c; }
@media (min-width: 900px) {
  .pb-faq__head { grid-template-columns: 1fr auto; }
  .pb-faq__list { grid-template-columns: 1fr 1fr; column-gap: clamp(1.5rem, 3vw, 3rem); }
  .pb-q:nth-child(2) { border-top: 0; }
}

/* ---------- 09 Final CTA + guide ---------- */
.pb-final { background: #fefcf6; padding-bottom: 0 !important; }
.pb-final__band { position: relative; display: grid; grid-template-columns: 1fr; align-items: center; overflow: hidden; padding: clamp(1rem, 3vh, 2rem) 1.25rem; border-radius: 26px; background: #0a1b3a; color: #fff; text-align: center; }
.pb-final__l, .pb-final__r { display: block; height: auto; width: 40%; max-width: 180px; margin-inline: auto; }
.pb-final__l { order: 1; } .pb-final__copy { order: 0; } .pb-final__r { order: 2; }
.pb-final__copy h2 { margin: 0; font-size: var(--t-h); line-height: 1.02; font-weight: 900; color: #fff; text-wrap: balance; }
.pb-final__copy h2 span { display: block; }
.pb-final__copy p { margin: clamp(0.5rem, 1.4vh, 0.875rem) auto 0; max-width: 560px; font-size: var(--t-lead); line-height: 1.4; color: #e3e8ef; }
.pb-final__btns { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.75rem; margin-top: clamp(0.625rem, 2vh, 1.25rem); }
.pb-gb { background: #fefcf6; padding-top: clamp(0.5rem, 2vh, 1.25rem); }
@media (min-width: 900px) {
  .pb-final__band { padding-inline: clamp(180px, 20vw, 300px); }
  .pb-final__copy h2 { font-size: min(var(--t-h), 3.4vw); }
  .pb-final__l, .pb-final__r { display: block; position: absolute; bottom: 0; width: auto; max-width: none; height: clamp(170px, 29vh, 280px); margin: 0; }
  .pb-final__r { height: clamp(140px, 23vh, 225px); }
  .pb-final__l { left: clamp(1rem, 2vw, 2rem); bottom: 0.25rem; }
  .pb-final__r { right: clamp(1rem, 2vw, 2rem); bottom: 0.25rem; }
  .pb-gb .pl-gb__grid { grid-template-columns: 1fr 0.95fr; gap: 3rem; }
  .pb-gb .pl-gb__copy { padding-left: clamp(0px, 3vw, 3rem); }
}

/* ---------- Phones and tablets ---------- */
@media (max-width: 899px) {
  .pb-page main > section { padding-block: 1rem; }
  .pb-h { font-size: clamp(1.75rem, 7.6vw, 2.375rem); }
  .pb-deal__mon { height: 80%; object-position: 50% 0; }
  .pb-deal__chip { top: -4.5cqw; right: 5cqw; font-size: 2.2cqw; }
  .pb-deal__body { gap: 0; justify-content: space-between; }
  .pb-deal__r3 { gap: 1em; } .pb-deal__r3:nth-of-type(2) { display: none; }
  .pb-deal__r4 .pb-pill2 { display: none; } .pb-deal__btn { margin: 0 auto 0 0; }
  .pb-proof__inner { gap: 0.25rem; } .pb-proof__mon { width: 34%; max-width: 130px; }
  .pb-pstat b { font-size: 3rem; }
  .pb-proof__stats { gap: 0.75rem; }
  .pb-prob__grid { gap: 1rem; }
  .pb-solart { width: min(100%, 480px); }
  .pb-three__grid { gap: 0.625rem; }
  .pb-way { display: grid; grid-template-columns: 38% 1fr; column-gap: 0.75rem; row-gap: 0.25rem; align-items: start; padding: 0.5rem; }
  .pb-way__stage { grid-row: 1 / 4; align-self: stretch; height: auto; min-height: 140px; }
  .pb-way > :not(.pb-way__stage) { grid-column: 2; }
  .pb-way > .pb-checks { grid-column: 1 / -1; padding-top: 0.25rem; }
  .pb-way .pb-tag, .pb-way h3, .pb-way p, .pb-way .pb-checks { margin-left: 0; margin-right: 0; }
  .pb-way .pb-tag { justify-self: start; }
  .pb-way h3 { font-size: 1.375rem; } .pb-way p { font-size: 0.9375rem; line-height: 1.3; } .pb-way .pb-checks { font-size: 0.9375rem; gap: 0.25rem; }
  .pb-feat__mon { display: block; width: 34%; max-width: 150px; height: auto; margin: 0.5rem auto 0; }
  .pb-cs__photo { min-height: 220px; }
  .pb-why .pb-eyebrow, .pb-why .pb-h { text-align: left; }
  .pb-why__duo { margin-top: 0.5rem; }
  .pb-final__band { padding-inline: 1rem; }
  .pb-final__band { grid-template-columns: 1fr 1fr; align-items: end; }
  .pb-final__copy { grid-column: 1 / -1; }
  .pb-final__l, .pb-final__r { width: 80%; max-width: 160px; margin-top: 0.75rem; }
  .pb-final__l { margin-left: auto; margin-right: 0; } .pb-final__r { margin-left: 0; margin-right: auto; }

  .pb-lead, .pb-faq__sub, .pb-final__copy p { font-size: 1rem; }
  .pb-steps h3 { font-size: 1.125rem; } .pb-steps p { font-size: 0.9375rem; line-height: 1.32; }
  .pb-steps { gap: 0.625rem; margin-block: 0.75rem; } .pb-steps__n { width: 38px; height: 38px; font-size: 1.125rem; }
  .pb-proof__stats { grid-template-columns: repeat(3, 1fr); gap: 0.25rem; }
  .pb-pstat { padding-inline: 0.25rem; } .pb-pstat b { font-size: 2.25rem; } .pb-pstat span { font-size: 0.75rem; }
  .pb-pstat + .pb-pstat { border-left: 1.5px solid #d8d5c8; }
  .pb-proof__mon { width: 28%; max-width: 110px; }
  .pb-cs { grid-template-columns: minmax(0, 1fr); }
  .pb-cs__photo { min-height: 190px; } .pb-cs__copy { padding: 0.875rem 1rem 1.125rem; gap: 0.5rem; }
  .pb-cs__stat b { font-size: 3rem; } .pb-cs__stat { gap: 0.875rem; padding: 0.25rem 1rem; } .pb-cs__stat span { font-size: 1.25rem; }
  .pb-cs__copy p, .pb-quote p { font-size: 0.9375rem; } .pb-quote footer b, .pb-quote footer small { font-size: 0.9375rem; }
  .pb-quote { padding: 0.625rem 0.875rem; } .pb-av { width: 48px; height: 48px; }
  .pb-why .pl-table th:nth-child(1) { width: 25%; } .pb-why .pl-table th:nth-child(2) { width: 24%; }
  .pb-why .pl-table th:nth-child(3) { width: 28%; } .pb-why .pl-table th:nth-child(4) { width: 23%; }
  .pb-why .pl-table tbody th { font-size: 0.625rem; padding-inline: 0.4rem; overflow-wrap: anywhere; }
  .pb-q { padding-block: 0.5rem; } .pb-q h3 { font-size: 1rem; } .pb-q p { font-size: 0.875rem; line-height: 1.34; }
  .pb-faq__list { padding-inline: 0.875rem; }
  .pb-fc { grid-template-columns: 36% 1fr; min-height: 84px; } .pb-feat__cards { gap: 0.5rem; }
  .pb-quote p { padding-top: 0.25rem; margin-top: 0; }
  .pb-cq { gap: 0.5rem; }
  .pb-q { padding-block: 0.4rem; } .pb-q h3 { font-size: 0.9375rem; margin-bottom: 0.1rem; } .pb-q p { font-size: 0.8125rem; line-height: 1.32; }
  .pb-faq__head { padding: 0.75rem 1rem; gap: 0.5rem; }
  .pb-faq__head .hm-btn { padding-block: 0.75rem; }
  .pb-feat__mon { width: 28%; max-width: 120px; margin-top: 0.25rem; }
  .pb-way { row-gap: 0.125rem; }
}

/* ---------- hero: supplied brand-marketer scene with live text on top ---------- */
.pb-hero { background: #fdfaf1; color: #14171c; overflow: hidden; padding-block: 0 !important; }
.pb-hero__stage { position: relative; container-type: inline-size; width: min(100%, calc((100vh - 73px) * 2.2)); margin-inline: auto; }
.pb-hero__img { display: block; width: 100%; height: auto; }
.pb-hero__text { position: absolute; left: 0; right: 0; top: 0; padding-top: 2.4cqw; text-align: center; }
.pb-hero__eyebrow { margin: 0 0 0.6cqw; font-size: max(0.75rem, 0.95cqw); font-weight: 900; letter-spacing: 0.3em; text-transform: uppercase; color: var(--hm-orange); }
.pb-hero__text h1 { margin: 0; font-size: min(var(--t-h), 3.5cqw); line-height: 1.04; font-weight: 900; color: #14171c; }
.pb-hero__text h1 span { display: block; }
.pb-hero__text h1 b { color: var(--hm-orange); }
.pb-hero__lead { margin: 1.1cqw auto 0; font-size: min(var(--t-lead), 1.55cqw); line-height: 1.36; color: #3a3f47; }
.pb-hero__btns { display: flex; justify-content: center; gap: 1cqw; margin-top: 1.3cqw; }
.pb-hero__btns .hm-btn { padding: 0.8rem 2rem; font-size: 0.8125rem; }
.pb-hero .pb-ghost { border: 2px solid #14171c; background: transparent; color: #14171c; }
.pb-hero .pb-ghost:hover { background: #14171c; color: #fff; }
@media (max-width: 899px) {
  .pb-hero__stage { width: 100%; }
  .pb-hero__text { position: static; padding: 1.25rem 1rem 0.5rem; }
  .pb-hero__eyebrow { font-size: 0.75rem; margin-bottom: 0.5rem; }
  .pb-hero__text h1 { font-size: clamp(1.75rem, 7.6vw, 2.375rem); }
  .pb-hero__text h1 span { display: inline; } .pb-hero__text h1 span:first-child { display: block; }
  .pb-hero__lead { font-size: clamp(0.9375rem, 3.9vw, 1.125rem); margin-top: 0.75rem; max-width: 34rem; }
  .pb-hero__btns { gap: 0.5rem; margin-top: 1rem; flex-wrap: nowrap; }
  .pb-hero__btns .hm-btn { padding: 0.8rem 1rem; font-size: 0.6875rem; white-space: nowrap; }
}

/* problem cards: wide scene art on the left, fading into the card */
@media (min-width: 900px) {
  .pb-pc { grid-template-columns: calc(var(--ph) * 1.9) 1fr; }
  .pb-pc__stage--scene .pb-pc__art { object-position: 50% 50%; -webkit-mask-image: linear-gradient(90deg, #000 86%, transparent); mask-image: linear-gradient(90deg, #000 86%, transparent); }
}

@media (max-width: 899px) {
  .pb-pc { grid-template-columns: 1fr; height: auto; }
  .pb-pc__stage--scene { aspect-ratio: 2 / 1; }
  .pb-pc__t { padding: 0.75rem 1rem 0.9rem; }
}

/* problem cards: human + monster scenes shown whole (2.15:1), soft edge only at the seam */
@media (min-width: 900px) {
  .pb-pc { grid-template-columns: calc(var(--ph) * 2.15) 1fr; }
  .pb-pc__stage--scene .pb-pc__art { object-position: 50% 50%; -webkit-mask-image: linear-gradient(90deg, #000 95%, transparent); mask-image: linear-gradient(90deg, #000 95%, transparent); }
  .pb-pc__t { padding: 0.5rem 1.25rem; }
}

/* three ways: human + monster scenes shown whole */
.pb-way__stage--scene { display: block; height: auto; aspect-ratio: 2.05 / 1; background: #fffefa; }
.pb-way__art { display: block; width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 899px) {
  .pb-way { display: flex; }
  .pb-way__stage--scene { align-self: stretch; grid-row: auto; min-height: 0; aspect-ratio: 2.05 / 1; }
  .pb-way > .pb-tag, .pb-way h3, .pb-way p, .pb-way .pb-checks { margin-inline: 0.375rem; }
  .pb-way > .pb-checks { padding-top: 0; }
}
@media (min-width: 900px) and (max-height: 760px) { .pb-way__stage--scene { aspect-ratio: auto; height: clamp(110px, 21vh, 160px); } .pb-way__art { object-position: 70% 40%; } }

/* why athios: one monster on the table's top-right corner, feet over the edge, clear of the Athios column */
@media (min-width: 900px) {
  .pb-why__duo { right: 1%; bottom: calc(100% - 1.75rem); }
  .pb-why__duo .pb-mon { height: clamp(170px, 27vh, 260px); }
}
.pb-feat__l2 { white-space: nowrap; } @media (min-width: 600px) { .pb-feat__l2 { display: block; } }

/* why athios: headline on one row now that the monster is gone */
@media (min-width: 900px) { .pb-why .pb-h { max-width: none; white-space: nowrap; font-size: min(var(--t-h), 3.6vw); } }
@media (min-width: 900px) { .pb-why .pl-table-wrap { width: 100%; } }

/* final band: one monster on the left, copy gets the room */
@media (min-width: 900px) {
  .pb-final__band { padding-inline: clamp(200px, 22vw, 330px) clamp(2rem, 5vw, 5rem); }
  .pb-final__copy h2 { font-size: min(var(--t-h), 3.6vw); }
}
@media (max-width: 899px) { .pb-final__band { grid-template-columns: 1fr; } .pb-final__l { margin-inline: auto; } }

/* solution: supplied marketer-at-laptop scene (deals panel + monster) */
.pb-sol { background: #fdfaf9; }
.pb-sol__scene { display: block; width: 100%; height: auto; }
@media (min-width: 900px) {
  .pb-sol__grid { grid-template-columns: 0.82fr 1.18fr; gap: 0; }
  .pb-sol__scene { -webkit-mask-image: linear-gradient(90deg, transparent, #000 7%); mask-image: linear-gradient(90deg, transparent, #000 7%); border-radius: 0 18px 18px 0; }
}

/* final band: copy centered in the band, monster tucked at the left */
@media (min-width: 900px) {
  .pb-final__band { padding-inline: clamp(190px, 19vw, 280px); }
  .pb-final__l { left: clamp(1.5rem, 3.5vw, 3.5rem); }
}
@media (min-width: 900px) {
  .pb-final__band { padding-inline: clamp(230px, 21vw, 310px); }
  .pb-final__copy h2 { font-size: min(var(--t-h), 3.1vw); }
  .pb-final__l { left: clamp(0.75rem, 1.5vw, 1.5rem); height: clamp(150px, 26vh, 250px); }
}

/* proof: headline and stats centered on the page like the hero; monster tucked left */
@media (min-width: 900px) {
  .pb-proof__inner { position: relative; display: block; text-align: center; }
  .pb-proof__mon { position: absolute; left: 0; bottom: 0; width: auto; height: clamp(150px, 26vh, 250px); max-width: none; }
  .pb-proof__inner > .pb-h, .pb-proof__stats { margin-inline: auto; }
  .pb-proof .pb-h { max-width: 900px; text-align: center; }
}
@media (min-width: 900px) { .pb-proof__stats { max-width: 880px; } }
@media (min-width: 900px) and (max-width: 1299px) { .pb-proof__mon { display: none; } }
@media (min-width: 900px) and (max-width: 1199px) { .pb-pc { grid-template-columns: 54% 1fr; height: auto; min-height: 150px; } .pb-pc__stage { min-height: 150px; } }

/* marketplace features: photo + live-UI scenes on the left of each card */
.pb-fc { padding: 0.375rem 0.875rem 0.375rem 0.375rem; }
.pb-fc__art { mix-blend-mode: normal; object-fit: cover; border-radius: 12px; aspect-ratio: 2 / 1; height: auto; }
@media (min-width: 900px) {
  .pb-fc { grid-template-columns: auto 1fr; height: auto; min-height: 0; }
  .pb-fc__art { height: clamp(100px, 17vh, 175px); width: auto; }
}
@media (max-width: 899px) { .pb-fc { grid-template-columns: 40% 1fr; } .pb-fc__art { width: 100%; } }
@media (min-width: 900px) and (max-height: 760px) { .pb-fc__art { height: clamp(90px, 15vh, 112px); } }

/* case study: supplied photo scene (athlete + monster) with live caption over its baked label */
.pb-cs__photo { background: #1a1a1a; }
.pb-cs__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; }
.pb-cs__cap { left: 2.4%; bottom: 3.4%; padding: 0.55rem 1.1rem; background: #0f1c3d; color: #fff; border-radius: 10px; }
.pb-quote__av { flex: 0 0 auto; width: 56px; height: 56px; border-radius: 50%; object-fit: cover; }
@media (max-width: 899px) { .pb-cs__img { object-position: 12% 40%; } .pb-cs__photo { min-height: 230px; } }

/* guide band: headline left, monster between the headline and the form card */
@media (min-width: 900px) {
  .pb-gb .pl-gb__grid { grid-template-columns: 1fr clamp(150px, 15vw, 230px) 0.95fr; grid-template-areas: "copy art form"; gap: clamp(1rem, 2.5vw, 2.5rem); align-items: center; }
  .pb-gb .pl-gb__copy { grid-area: copy; padding-left: 0; }
  .pb-gb .pl-gb__art { grid-area: art; width: 100%; max-height: clamp(200px, 38vh, 340px); object-fit: contain; align-self: end; }
  .pb-gb .pl-gb__form { grid-area: form; }
}

/* ---------- final CTA + free guide: one block ---------- */
.pb-cta { background: #fefcf6; padding-block: clamp(0.75rem, 2.2vh, 1.5rem) !important; }
.pb-cta__band { position: relative; overflow: hidden; border-radius: 26px 26px 0 0; background: #0a1b3a; color: #fff; }
.pb-cta__img { display: block; width: 100%; height: auto; }
.pb-cta__copy { position: relative; padding: 1rem 1.25rem 1.5rem; text-align: left; }
.pb-cta__copy h2 { margin: 0; font-size: clamp(1.625rem, 6.5vw, 2.25rem); line-height: 1.04; font-weight: 900; color: #fff; letter-spacing: -.035em; }
.pb-cta__u { color: var(--hm-orange); text-decoration: underline; text-decoration-thickness: 0.07em; text-underline-offset: 0.12em; }
.pb-cta__copy p { margin: 0.75rem 0 0; font-size: var(--t-lead); line-height: 1.4; color: #e3e8ef; }
.pb-cta__btns { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 1rem; }
.pb-cta__guide { padding: 1rem 1.25rem 1.25rem; border-radius: 0 0 26px 26px; background: #faf6ee; text-align: center; }
.pb-cta__tag { display: inline-block; padding: 0.25rem 0.9rem; border-radius: 999px; background: #c8f562; color: #14171c; font-size: 0.75rem; font-weight: 900; letter-spacing: 0.12em; text-transform: uppercase; }
.pb-cta__guide h3 { margin: 0.4rem 0 0; font-size: clamp(1.5rem, 5vw, 2.25rem); line-height: 1.05; font-weight: 900; color: #0f1c3d; letter-spacing: -.035em; }
.pb-cta__guide > p { margin: 0.5rem auto 0; max-width: 62rem; font-size: var(--t-body); line-height: 1.4; color: #2a2f37; }
.pb-cta__form { display: grid; grid-template-columns: 1fr; gap: 0.625rem; margin: 1rem auto 0; padding: 0.5rem; border: 1px solid #e6e1d2; border-radius: 18px; background: #fffefa; text-align: left; }
.pb-cta__f { display: block; margin: 0; }
.pb-cta__f span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.pb-cta__f input, .pb-cta__f select { width: 100%; box-sizing: border-box; padding: 0.875rem 1rem; border: 1.5px solid #d9d4c6; border-radius: 12px; background: #fff; font-family: inherit; font-size: 1rem; color: #14171c; }
.pb-cta__f input:focus, .pb-cta__f select:focus { outline: none; border-color: var(--hm-orange); }
.pb-cta__submit { width: 100%; white-space: nowrap; }
@media (min-width: 900px) {
  .pb-cta__img { height: clamp(210px, 40vh, 400px); width: 100%; object-fit: cover; object-position: 0 50%; }
  .pb-cta__copy { position: absolute; top: 0; bottom: 0; left: 49%; right: 3%; display: flex; flex-direction: column; justify-content: center; padding: 0; }
  .pb-cta__copy h2 { font-size: min(var(--t-h), 3.1vw); }
  .pb-cta__copy p { font-size: min(var(--t-lead), 1.25vw); }
  .pb-cta__form { grid-template-columns: 1.7fr 1fr 1fr; align-items: center; }
  .pb-cta__guide { padding: clamp(0.75rem, 2vh, 1.25rem) clamp(1rem, 3vw, 3rem) clamp(0.75rem, 2.4vh, 1.5rem); }
}
@media (max-width: 899px) { .pb-cta__band { border-radius: 22px 22px 0 0; } .pb-cta__guide { border-radius: 0 0 22px 22px; } }
@media (min-width: 900px) {
  .pb-cta__img { height: auto; object-fit: initial; }
  .pb-cta__copy { left: 51.5%; right: 2.5%; }
  .pb-cta__copy h2 { font-size: min(var(--t-h), 2.9vw); }
}
@media (max-width: 899px) { .pb-cta__guide > p { font-size: 0.9375rem; } .pb-cta__copy p { font-size: 1rem; } }

/* ---------- one type scale for every block headline, eyebrow and sub line ---------- */
.pb-hero__eyebrow, .pb-page .pb-eyebrow { font-size: clamp(0.8125rem, 1.9vh, 1rem); letter-spacing: 0.28em; }
.pb-hero__text h1, .pb-page .pb-h, .pb-cta__copy h2 { font-size: var(--t-h); line-height: 1.04; letter-spacing: -.035em; }
.pb-hero__lead, .pb-page .pb-lead, .pb-cta__copy p, .pb-cta__guide > p { font-size: var(--t-lead); line-height: 1.4; }
.pb-cta__guide h3 { font-size: var(--t-h); }
@media (min-width: 900px) {
  .pb-hero__text h1 { font-size: min(var(--t-h), 3.9cqw); }
  .pb-hero__lead { font-size: min(var(--t-lead), 1.75cqw); }
  .pb-hero__eyebrow { font-size: max(0.75rem, min(1rem, 1.1cqw)); }
  .pb-cta__copy h2 { font-size: min(var(--t-h), 3.4vw); }
  .pb-cta__copy p { font-size: min(var(--t-lead), 1.55vw); }
  .pb-why .pb-h { font-size: min(var(--t-h), 3.9vw); }
}
@media (max-width: 899px) {
  .pb-hero__text h1, .pb-page .pb-h, .pb-cta__copy h2, .pb-cta__guide h3 { font-size: clamp(1.75rem, 7.6vw, 2.375rem); }
  .pb-hero__lead, .pb-page .pb-lead, .pb-cta__copy p, .pb-cta__guide > p { font-size: clamp(0.9375rem, 3.9vw, 1.125rem); }
}
@media (min-width: 900px) { .pb-cta__copy h2 { font-size: min(var(--t-h), 3.9vw); } .pb-cta__copy p { font-size: min(var(--t-lead), 1.6vw); } .pb-cta__copy { left: 50.5%; } .pb-hero__eyebrow { font-size: max(0.8125rem, min(1rem, 1.1cqw)); } }
@media (min-width: 900px) {
  .pb-hero__text { padding-top: 1.3cqw; }
  .pb-hero__eyebrow { margin-bottom: 0.2cqw; }
  .pb-hero__text h1 { line-height: 1.0; }
  .pb-hero__lead { margin-top: 0.55cqw; line-height: 1.3; }
  .pb-hero__btns { margin-top: 0.8cqw; }
  .pb-hero__btns .hm-btn { padding: 0.55cqw 1.7cqw; }
}

/* problem cards: three matching 2.5:1 scenes, same scale for all monsters */
@media (min-width: 1200px) {
  .pb-pc { --ph2: calc(var(--ph) * 0.78); height: var(--ph2); grid-template-columns: calc(var(--ph2) * 2.8) 1fr; }
}
.pb-pc__stage--scene .pb-pc__art { object-position: 50% 50%; }

/* final band: headline on two rows beside the monsters, sized from the band width */
.pb-cta__band { container-type: inline-size; }
@media (min-width: 900px) {
  .pb-cta__copy h2 { font-size: min(var(--t-h), 3.3cqw); }
  .pb-cta__copy p { font-size: min(var(--t-lead), 1.55cqw); margin-top: 1.4cqw; }
  .pb-cta__btns { margin-top: 1.6cqw; }
  .pb-cta__copy { left: 49.5%; right: 1.5%; }
}
@media (min-width: 900px) { .pb-cta__img { max-height: calc(100vh - 73px - 330px); min-height: 250px; object-fit: cover; object-position: 0 50%; } }
.pb-cs__cap { left: auto; right: 2.4%; }
.pb-cs__img { object-position: 10% 40%; } @media (max-width: 899px) { .pb-cs__img { object-position: 8% 40%; } }