/* ════════════════════════════════════════════════════════════════
   Penworthy — home page bundle
   Bento grid, hero stage, kit-line rows, product cards, scrollers,
   trust strip. Ported from design-reference/styles.css.
   ════════════════════════════════════════════════════════════════ */

/* Theme bento tile (featured kit per category) */
.pw-bento-tile {
  border-radius: var(--pw-r-lg);
  padding: 22px;
  position: relative;
  overflow: hidden;
  cursor: pointer;
  color: #fff;
  transition: transform .3s cubic-bezier(.22,.61,.36,1), box-shadow .3s cubic-bezier(.22,.61,.36,1);
}
.pw-bento-tile:hover { transform: translateY(-4px); box-shadow: var(--pw-shadow-lg); }
.pw-bento-blob {
  position: absolute; right: -44px; top: -44px;
  width: 168px; height: 168px; border-radius: 50%;
  background: rgba(255,255,255,.12); pointer-events: none;
}
/* Penworthy-lines bento tile */
.pw-bento-line {
  position: relative;
  border-radius: var(--pw-r-lg);
  padding: 22px;
  overflow: hidden;
  cursor: pointer;
  transition: transform .3s cubic-bezier(.22,.61,.36,1), box-shadow .3s cubic-bezier(.22,.61,.36,1);
}
.pw-bento-line:hover { transform: translateY(-4px); box-shadow: var(--pw-shadow-lg); }
.pw-line-explore { display: inline-flex; align-items: center; gap: 7px; font-weight: 700; font-size: 14.5px; }
.pw-line-explore svg { transition: transform .2s; }
.pw-bento-line:hover .pw-line-explore svg { transform: translateX(3px); }

/* Photo frame that holds an <image-slot> plus decorative stickers */
.pw-photo {
  position: relative;
  border-radius: var(--pw-r-xl);
  overflow: visible;
  background: var(--pw-blue-tint);
}
.pw-photo > image-slot {
  border-radius: inherit;
  display: block;
  width: 100%;
  height: 100%;
}
.pw-photo-clip { overflow: hidden; border-radius: inherit; }

/* ── Penworthy-lines bento (home) ── */
.pw-bento {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-auto-rows: minmax(236px, auto);
  gap: 20px;
  margin-top: 34px;
  grid-template-areas:
    "steam steam steam steam steam steam steam books books books books books"
    "steam steam steam steam steam steam steam sharp sharp sharp sharp sharp"
    "phon phon phon phon early early early early lang lang lang lang";
}
.pw-bcell {
  position: relative;
  border-radius: var(--pw-r-xl);
  padding: 26px;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  transition: transform .3s var(--pw-ease-out, cubic-bezier(.22,.61,.36,1)), box-shadow .3s var(--pw-ease-out, cubic-bezier(.22,.61,.36,1));
}
.pw-bcell:hover { transform: translateY(-4px); box-shadow: var(--pw-shadow-lg); }
.pw-bcell:hover .pw-line-explore svg { transform: translateX(3px); }
.pw-bcell .pw-line-explore { white-space: nowrap; }
.pw-lockup {
  max-width: 100%;
  display: block; width: auto; user-select: none;
  align-self: flex-start; flex-shrink: 0;
  object-fit: contain; object-position: left center;
}
.pw-bcell-tagline { font-family: var(--pw-display); font-weight: 700; line-height: 1.18; text-wrap: pretty; }
.pw-bcell-blurb { font-size: 14.5px; color: var(--pw-ink-2); line-height: 1.55; margin: 0; }

/* Crossfading product stage */
.pw-cyc { position: relative; overflow: hidden; background: #fff; }
.pw-cyc-img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: contain; box-sizing: border-box;
  opacity: 0; transform: scale(.92) rotate(-1.5deg);
  transition: opacity .4s ease, transform .55s var(--pw-ease-out, ease);
}
.pw-cyc-img.is-on { opacity: 1; transform: none; }
.pw-cyc-dots { display: flex; gap: 5px; align-items: center; }
.pw-cyc-dot {
  width: 7px; height: 7px; border-radius: 50%; padding: 0;
  border: none; cursor: pointer;
  background: rgba(3,55,89,.18);
  transition: transform .25s var(--pw-ease-spring, ease), background .2s;
}
.pw-cyc-dot.is-on { transform: scale(1.3); }
.pw-cyc-dot:focus-visible, .pw-cyc-arr:focus-visible { outline: 2px solid var(--pw-blue); outline-offset: 2px; }
.pw-cyc-nav { display: inline-flex; align-items: center; gap: 7px; }
.pw-cyc-arr {
  width: 22px; height: 22px; border-radius: 50%; padding: 0; flex-shrink: 0;
  background: #fff; color: var(--pw-blue); cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--pw-line);
  transition: transform .15s var(--pw-ease-out, ease), background .15s, color .15s;
}
.pw-cyc-arr:hover { transform: scale(1.12); background: var(--pw-blue); color: #fff; }
@keyframes pw-cyc-in { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: none; } }

/* Hero cell */
.pw-bhero { display: grid; grid-template-columns: 1fr 316px; gap: 30px; flex: 1; min-height: 0; }
.pw-bhero-copy { display: flex; flex-direction: column; gap: 13px; min-width: 0; }
.pw-bhero-stage { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.pw-bhero-stagewrap { position: relative; flex: 1; display: flex; min-height: 208px; }
.pw-bhero-stagewrap .pw-cyc { position: relative; flex: 1; box-shadow: var(--pw-shadow); }

/* Auto-cycler pause/play toggle (WCAG 2.2.2) — JS-rendered into the stage. */
.pw-cyc-toggle {
  position: absolute;
  right: 8px;
  bottom: 8px;
  z-index: 3;
  width: 28px;
  height: 28px;
  padding: 0;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  color: var(--pw-ink);
  border: 1px solid var(--pw-line);
  box-shadow: var(--pw-shadow-sm);
  cursor: pointer;
  transition: transform .15s var(--pw-ease-out, ease), background .15s;
}
.pw-cyc-toggle:hover { transform: scale(1.08); }
.pw-cyc-toggle svg { display: block; }
.pw-cyc-toggle:focus-visible { outline: 2px solid var(--pw-blue); outline-offset: 2px; }
.pw-bhero-ghost {
  position: absolute; inset: 8px; border-radius: 18px;
  background: rgba(255,255,255,.55); box-shadow: var(--pw-shadow-sm);
  transition: transform .5s var(--pw-ease-out, ease);
}
.pw-bhero-ghost.g1 { transform: rotate(3.2deg) translate(10px, -6px); }
.pw-bhero-ghost.g2 { transform: rotate(-2.8deg) translate(-11px, 5px); }
.pw-bcell:hover .pw-bhero-ghost.g1 { transform: rotate(5deg) translate(15px, -9px); }
.pw-bcell:hover .pw-bhero-ghost.g2 { transform: rotate(-4.4deg) translate(-16px, 8px); }
.pw-bhero-meta { display: flex; align-items: center; gap: 12px; }
.pw-bhero-kicker { font-size: 10.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.pw-bhero-title {
  font-family: var(--pw-display); font-weight: 700; font-size: 16px;
  color: var(--pw-ink); line-height: 1.2; margin-top: 2px;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.pw-bhero-price { font-size: 14.5px; font-weight: 700; color: var(--pw-ink-2); margin-top: 3px; }
.pw-bhero-thumbs { display: flex; gap: 8px; }
.pw-bhero-thumb {
  width: 46px; height: 46px; border-radius: 11px; background: #fff; padding: 4px;
  border: 2px solid transparent; box-shadow: var(--pw-shadow-sm); flex-shrink: 0;
  transition: transform .2s var(--pw-ease-out, ease), border-color .2s;
}
.pw-bhero-thumb img { width: 100%; height: 100%; object-fit: contain; }
.pw-bhero-thumb:hover { transform: translateY(-2px); }
.pw-bhero-thumb.is-on { border-color: currentColor; }

/* Book Sets fan */
.pw-fan { position: relative; flex: 0 0 242px; align-self: stretch; min-height: 150px; }
.pw-fan-card {
  position: absolute; right: 2px; top: 50%;
  width: 142px; height: 112px; margin-top: -56px;
  border-radius: 12px; background: #fff; overflow: hidden;
  box-shadow: 0 10px 26px rgba(2,28,46,.32);
  transform: var(--rest);
  transition: transform .5s var(--pw-ease-spring, ease), box-shadow .3s;
}
.pw-fan-card img { width: 100%; height: 100%; object-fit: contain; padding: 6px; box-sizing: border-box; }
.pw-bcell:hover .pw-fan-card { transform: var(--out); }
.pw-bcell:hover .pw-fan-card:hover { transform: var(--out) translateY(-6px) scale(1.09); }
.pw-fan-card:hover { z-index: 9 !important; box-shadow: 0 16px 36px rgba(2,28,46,.44); }
.pw-fan-price {
  position: absolute; right: 7px; bottom: 7px;
  font-size: 11.5px; font-weight: 700; color: var(--pw-blue-deep, var(--pw-blue));
  background: var(--pw-yellow); border-radius: 999px; padding: 2px 8px;
  opacity: 0; transform: translateY(4px);
  transition: opacity .25s, transform .25s var(--pw-ease-out, ease);
}
.pw-bcell:hover .pw-fan-price { opacity: 1; transform: none; }

/* Stay Sharp polaroid */
.pw-polaroid {
  width: 188px; background: #fff; border-radius: 12px; padding: 9px;
  box-shadow: var(--pw-shadow); align-self: center; flex-shrink: 0;
  transition: transform .45s var(--pw-ease-spring, ease), box-shadow .3s;
}
.pw-bcell:hover .pw-polaroid { transform: translateY(-3px) scale(1.04); box-shadow: var(--pw-shadow-lg); }
.pw-polaroid-cap { padding: 8px 4px 0; animation: pw-cyc-in .3s both; }
.pw-polaroid-cap .t {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  font-family: var(--pw-display); font-weight: 700; font-size: 12.5px;
  color: var(--pw-ink); line-height: 1.22;
}
.pw-polaroid-cap .p { display: block; font-size: 12px; font-weight: 700; margin-top: 2px; }

/* Mini featured-kit chip */
.pw-bmini-prod {
  position: relative;
  display: flex; align-items: center; gap: 11px;
  background: #fff; border-radius: 14px; padding: 8px 12px 8px 8px;
  box-shadow: var(--pw-shadow-sm);
  transition: transform .25s var(--pw-ease-out, ease), box-shadow .25s;
}
.pw-bmini-prod:hover { transform: translateY(-2px); box-shadow: var(--pw-shadow); }
.pw-bmini-meta { min-width: 0; animation: pw-cyc-in .3s both; }
.pw-bmini-meta .k { font-size: 10px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
.pw-bmini-meta .t {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  font-family: var(--pw-display); font-weight: 700; font-size: 13.5px;
  line-height: 1.22; color: var(--pw-ink); margin-top: 1px;
}
.pw-bmini-meta .p { font-size: 13px; font-weight: 700; color: var(--pw-ink-2); margin-top: 2px; }

@media (max-width: 1120px) {
  .pw-bento {
    grid-template-areas:
      "steam steam steam steam steam steam steam steam steam steam steam steam"
      "books books books books books books sharp sharp sharp sharp sharp sharp"
      "phon phon phon phon early early early early lang lang lang lang";
  }
}
@media (max-width: 980px) {
  .pw-bento {
    grid-template-areas:
      "steam steam steam steam steam steam steam steam steam steam steam steam"
      "books books books books books books books books books books books books"
      "sharp sharp sharp sharp sharp sharp sharp sharp sharp sharp sharp sharp"
      "phon phon phon phon phon phon early early early early early early"
      "lang lang lang lang lang lang lang lang lang lang lang lang";
  }
  /* Stay Sharp's bottom-right sticker sits right above this cell's corner here */
  .pw-stk-mini { display: none; }
}
@media (max-width: 780px) {
  .pw-bento { display: flex; flex-direction: column; }
  .pw-bhero { grid-template-columns: 1fr; }
}

/* Kit-line editorial row (layout B) */
.pw-line-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 56px;
  border-radius: var(--pw-r-xl);
  padding: 40px;
  position: relative;
  overflow: hidden;
}
.pw-line-row.rev { direction: rtl; }
.pw-line-row.rev > * { direction: ltr; }

/* Product card used in featured rows */
.pw-prod {
  background: #fff;
  border: 1px solid var(--pw-line);
  border-radius: var(--pw-r-md);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform .25s cubic-bezier(.22,.61,.36,1), box-shadow .25s;
  cursor: pointer;
}
.pw-prod:hover { transform: translateY(-4px); box-shadow: var(--pw-shadow-lg); }
.pw-prod-body { padding: 14px 15px 16px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.pw-prod-kit { font-size: 11.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.pw-prod-title { font-family: var(--pw-display); font-weight: 700; font-size: 15.5px; color: var(--pw-ink); line-height: 1.25; }
.pw-prod-foot { margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.pw-prod-price { font-family: var(--pw-display); font-weight: 700; font-size: 18px; color: var(--pw-ink); }

/* Horizontal scroller for featured carousel (layout B) */
.pw-scroller {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 300px;
  gap: 20px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding: 6px 2px 20px;
  scrollbar-width: thin;
}
.pw-scroller > * { scroll-snap-align: start; }

/* Compact "popular right now" strip — small vertical kit cards that fit the hero's open space */
.pw-mini-scroller {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 120px;
  gap: 11px;
  min-width: 0;
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x proximity;
  padding: 2px 2px 7px;
  scrollbar-width: thin;
  -webkit-overflow-scrolling: touch;
}
.pw-mini-scroller > * { scroll-snap-align: start; }
.pw-mini {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--pw-line);
  border-radius: 13px;
  overflow: hidden;
  cursor: pointer;
  transition: transform .2s cubic-bezier(.22,.61,.36,1), box-shadow .2s;
}
.pw-mini:hover { transform: translateY(-3px); box-shadow: var(--pw-shadow); }
.pw-mini .cover { border-radius: 0; }
.pw-mini-body { padding: 7px 9px 9px; display: flex; flex-direction: column; gap: 1px; }
.pw-mini-kit { font-size: 8.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; line-height: 1.25; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pw-mini-title {
  font-family: var(--pw-display); font-weight: 700; font-size: 11.5px;
  color: var(--pw-ink); line-height: 1.12;
  display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;
}
.pw-mini-price { font-family: var(--pw-display); font-weight: 700; font-size: 11.5px; color: var(--pw-ink); }

/* "What's inside" feature tile */
.pw-inside {
  border-radius: var(--pw-r-lg);
  padding: 28px;
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 210px;
}

/* Marquee trust strip */
.pw-trust {
  display: flex; align-items: center; flex-wrap: wrap; gap: 12px 30px;
}
.pw-trust-item { display: inline-flex; align-items: center; gap: 10px; font-size: 14.5px; font-weight: 600; color: var(--pw-ink-2); }
.pw-trust-item svg { color: var(--pw-blue); flex-shrink: 0; }

@media (max-width: 900px) {
  .pw-line-row { grid-template-columns: 1fr; gap: 28px; }
  .pw-line-row.rev { direction: ltr; }
}

/* ── Editorial hero: floating copy card becomes a stacked card ── */
@media (max-width: 980px) {
  .hero-ed-card {
    position: static !important;
    transform: none !important;
    max-width: none !important;
    margin: -70px 14px 0 !important;
  }
}

/* ── Decorative stickers that would collide with text on small screens ── */
@media (max-width: 860px) {
  .pw-stk-hide-sm { display: none !important; }
}

/* ── Small-screen polish for section shells ── */
@media (max-width: 640px) {
  .pw-line-row { padding: 26px 22px; }
}

/* ── Bento cells: media stacks under copy on small screens ── */
@media (max-width: 640px) {
  .pw-bfan-row { flex-direction: column; }
  .pw-bfan-row .pw-fan { flex: 0 0 auto; align-self: center; width: 242px; min-height: 158px; margin-top: 6px; }
  .pw-bsharp-row { flex-direction: column; }
  .pw-bsharp-row .pw-polaroid { align-self: center; margin-top: 6px; }
}

/* ── Hero eyebrow: one pill per phrase on small screens ── */
@media (max-width: 640px) {
  .pw-hero-eyebrow { background: none !important; padding: 0 !important; gap: 8px !important; }
  .pw-hero-eyebrow .pw-eb-dot { display: none; }
  .pw-hero-eyebrow .pw-eb-chip { background: var(--pw-yellow-light); border-radius: 999px; padding: 8px 14px; }
}

/* — page-specific conversions appended below — */

/* ════════════════════════════════════════════════════════════════
   Warm home layout — inline-style conversions (front-page.php +
   template-parts/home/*). Ported from design-reference/pages/home.jsx
   + home-sections.jsx. Only the top/bottom section padding is set here;
   .page keeps the responsive horizontal gutters.
   ════════════════════════════════════════════════════════════════ */

/* ── Section vertical rhythm ── */
.pw-home-hero { padding-top: 56px; padding-bottom: 30px; }
.pw-home-trust { padding-top: 26px; padding-bottom: 6px; }
.pw-home-bento { padding-top: 64px; }
.pw-home-inside { padding-top: 64px; }
.pw-home-booksets { padding-top: 64px; }
.pw-home-why { padding-top: 72px; }
.pw-home-cw { padding-top: 72px; }
.pw-home-testimonials { padding-top: 76px; }
.pw-home-final { padding-top: 76px; padding-bottom: 20px; }

/* ── Marker highlight behind a hero word ── */
.pw-hl { position: relative; display: inline-block; }
.pw-hl > span { position: relative; z-index: 1; }
.pw-hl::after {
  content: ""; position: absolute; left: -4px; right: -4px; bottom: 6px;
  height: 16px; background: var(--pw-yellow); border-radius: 4px; z-index: 0;
}

/* ── Shared section header (SectionHead) ── */
.pw-sechead { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; }
.pw-sechead.is-center { flex-direction: column; text-align: center; }
.pw-sechead.is-center .pw-sechead-main { max-width: 640px; margin: 0 auto; }
.pw-sechead h2 { font-size: clamp(28px, 3.6vw, 38px); line-height: 1.08; }
.pw-sechead-eyebrow { margin-bottom: 10px; }
.pw-sechead.is-center .pw-sechead-eyebrow { justify-content: center; }
.pw-sechead-sub { margin: 12px 0 0; color: var(--pw-ink-2); font-size: 16.5px; line-height: 1.6; max-width: 620px; }
.pw-sechead.is-center .pw-sechead-sub { margin-left: auto; margin-right: auto; }
.pw-sechead-link { cursor: pointer; white-space: nowrap; }

/* ── Hero (warm) ── */
.pw-hero-grid { display: grid; grid-template-columns: 1fr 1.06fr; gap: 64px; align-items: center; }
.pw-hero-copy { min-width: 0; }
.pw-hero-eyebrow {
  display: inline-flex; align-items: center; flex-wrap: wrap; gap: 9px;
  margin-bottom: 22px; padding: 8px 16px; background: var(--pw-yellow-light); border-radius: 999px;
}
.pw-eb-chip { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--pw-blue); font-weight: 700; letter-spacing: .03em; }
.pw-eb-dot { width: 4px; height: 4px; border-radius: 50%; background: var(--pw-blue); opacity: .35; }
.pw-hero-title { font-size: clamp(36px, 5.5vw, 58px); line-height: 1.04; font-weight: 700; color: var(--pw-blue); letter-spacing: -0.02em; }
.pw-hero-intro { margin-top: 24px; font-size: 18px; line-height: 1.65; color: var(--pw-ink-2); max-width: 520px; }
.pw-hero-ctas { display: flex; gap: 14px; margin-top: 32px; flex-wrap: wrap; }
.pw-hero-collage { position: relative; min-height: 500px; min-width: 0; }
.pw-hero-photos { display: grid; grid-template-columns: 1.35fr 1fr; grid-template-rows: auto auto; gap: 16px; }

/* ── Photo frame (fills the tinted .pw-photo box; label fallback when empty) ── */
.pw-photo-clip { position: absolute; inset: 0; border-radius: inherit; overflow: hidden; }
.pw-photo-clip img, .pw-photo-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pw-photo-r28 { border-radius: 28px; }
.pw-photo-r24 { border-radius: 24px; }
.pw-photo-ph {
  position: absolute; inset: 0; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 8px; text-align: center;
  padding: 20px; color: var(--pw-ink-3);
}
.pw-photo-ph-ic { opacity: .55; }
.pw-photo-ph-label { font-weight: 600; font-size: 14px; line-height: 1.4; }

/* ── Hero "Popular right now" mini strip ── */
.pw-hero-popular { margin-top: 14px; }
.pw-hero-popular-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.pw-hero-popular-eyebrow { font-size: 11px; }
.pw-hero-popular-all { cursor: pointer; font-size: 12px; }

/* ── Trust strip ── */
.pw-trust-strip {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px;
  padding: 22px 28px; background: var(--pw-bg-2); border-radius: var(--pw-r-lg);
}
.pw-trust-ic {
  width: 40px; height: 40px; border-radius: 12px; background: #fff;
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--pw-blue); flex-shrink: 0;
}
.pw-trust-txt { display: inline-flex; flex-direction: column; }
.pw-trust-t { display: block; font-weight: 700; color: var(--pw-ink); font-size: 14.5px; }
.pw-trust-s { display: block; font-size: 13px; color: var(--pw-ink-3); font-weight: 500; }

/* ── Kit-lines bento: per-line colours (ink via a custom property) ── */
.pw-bcell.line-steam { background: var(--pw-green-light); --pw-line-ink: #2C7A52; }
.pw-bcell.line-staysharp { background: var(--pw-blue-tint); --pw-line-ink: #0565A5; }
.pw-bcell.line-earlystart { background: var(--pw-yellow-light); --pw-line-ink: #8F650E; }
.pw-bcell.line-phonics { background: var(--pw-coral-light); --pw-line-ink: #B8421D; }
.pw-bcell.line-language { background: #EFEEF9; --pw-line-ink: #5E3F7A; }
.pw-bcell.line-booksets { background: var(--pw-blue); --pw-line-ink: #0565A5; }

.pw-bcell .pw-bcell-tagline { color: var(--pw-line-ink); }
.pw-bcell.line-booksets .pw-bcell-tagline { color: #fff; }
.pw-bcell .pw-line-explore { color: var(--pw-line-ink); margin-top: auto; padding-top: 14px; }
.pw-bcell.line-booksets .pw-line-explore { color: var(--pw-yellow); }
.pw-bcell .pw-bhero-kicker { color: var(--pw-line-ink); }
.pw-bcell .pw-bhero-thumbs { color: var(--pw-line-ink); }
.pw-bcell .pw-bmini-meta .k { color: var(--pw-line-ink); }
.pw-bcell .pw-polaroid-cap .p { color: var(--pw-line-ink); }

/* Bento hero cell */
.pw-bhero-tagline { font-size: 25px; max-width: 340px; }
.pw-bhero-blurb { max-width: 320px; }
.pw-bhero-cyc { display: block; border-radius: 18px; }
.pw-bhero-meta-link { flex: 1; min-width: 0; display: block; }

/* Bento fan cell (Book Sets) */
.pw-bfan-row { position: relative; display: flex; gap: 16px; flex: 1; min-width: 0; }
.pw-bfan-copy { display: flex; flex-direction: column; gap: 11px; flex: 1; min-width: 0; }
.pw-bfan-chip { background: #fff; border-radius: 13px; padding: 8px 13px; display: inline-flex; align-self: flex-start; max-width: 100%; }
.pw-bfan-tagline { font-size: 17.5px; }
.pw-bfan-deco { position: absolute; inset: 0; border-radius: inherit; overflow: hidden; pointer-events: none; }
.pw-bfan-deco-q { position: absolute; top: -12px; left: 36%; opacity: .13; transform: rotate(-10deg); }
.pw-bfan-deco-s { position: absolute; bottom: 10px; left: 18px; opacity: .16; }

/* Bento polaroid cell (Stay Sharp) */
.pw-bsharp-row { display: flex; gap: 18px; flex: 1; min-width: 0; }
.pw-bsharp-copy { display: flex; flex-direction: column; gap: 11px; flex: 1; min-width: 0; }
.pw-bsharp-tagline { font-size: 17.5px; max-width: 250px; }
.pw-polaroid-cyc { height: 112px; border: 1px solid var(--pw-line-2); border-radius: 8px; }
.pw-polaroid-link { display: block; color: inherit; }
.pw-polaroid-nav { display: flex; justify-content: center; padding-top: 7px; }

/* Bento mini cells (Phonics, Early Start, Language) */
.pw-bmini-inner { display: flex; flex-direction: column; gap: 12px; flex: 1; min-width: 0; }
.pw-bmini-tagline { font-size: 17.5px; }
.pw-bmini-cyc { width: 64px; height: 64px; flex-shrink: 0; border: 1px solid var(--pw-line-2); border-radius: 10px; }
.pw-bmini-prodwrap { position: relative; margin-top: auto; }
.pw-bmini-nav { position: absolute; top: -13px; right: 10px; z-index: 2; background: #fff; border-radius: 999px; padding: 3px 5px; box-shadow: var(--pw-shadow-sm); }
.pw-bmini-explore { margin-top: 0; padding-top: 2px; }

/* ── What's inside tiles ── */
.pw-inside-head { position: relative; }
.pw-inside-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-top: 34px; }
.pw-inside-ic {
  width: 54px; height: 54px; border-radius: 15px; background: #fff;
  display: inline-flex; align-items: center; justify-content: center;
}
.pw-inside-title { font-family: var(--pw-display); font-weight: 700; font-size: 19px; }
.pw-inside-text { margin: 0; font-size: 14px; color: var(--pw-ink-2); line-height: 1.6; }
.pw-inside.tone-blue { background: var(--pw-blue-tint); --pw-tile-ink: #0565A5; }
.pw-inside.tone-green { background: var(--pw-green-light); --pw-tile-ink: #2C7A52; }
.pw-inside.tone-coral { background: var(--pw-coral-light); --pw-tile-ink: #C0451E; }
.pw-inside.tone-yellow { background: var(--pw-yellow-light); --pw-tile-ink: #B98A2E; }
.pw-inside .pw-inside-ic { color: var(--pw-tile-ink); }
.pw-inside .pw-inside-title { color: var(--pw-tile-ink); }

/* ── Why families ── */
.pw-why-grid { display: grid; grid-template-columns: 1fr 1.02fr; gap: 60px; align-items: center; }
.pw-why-media { position: relative; }
.pw-why-copy { min-width: 0; }
.pw-why-text { margin-top: 14px; font-size: 17px; color: var(--pw-ink-2); line-height: 1.7; max-width: 500px; }
.pw-why-points { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 22px; margin-top: 26px; }
.pw-why-point { display: flex; gap: 11px; align-items: flex-start; }
.pw-why-check {
  width: 24px; height: 24px; border-radius: 50%; background: var(--pw-green-light);
  color: #2C7A52; display: inline-flex; align-items: center; justify-content: center;
  flex-shrink: 0; margin-top: 1px;
}
.pw-why-point-t { font-size: 15px; color: var(--pw-ink); font-weight: 600; line-height: 1.4; }
.pw-why-ctas { display: flex; gap: 14px; margin-top: 30px; flex-wrap: wrap; }

/* ── Book Sets band ── */
.pw-booksets-band { background: var(--pw-blue); border-radius: var(--pw-r-xl); padding: 46px 46px 40px; position: relative; overflow: hidden; }
.pw-booksets-head { position: relative; display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.pw-booksets-intro { max-width: 560px; }
.pw-booksets-chip { background: #fff; border-radius: 16px; padding: 12px 18px; display: inline-flex; }
.pw-booksets-title { color: #fff; font-size: clamp(28px, 3.6vw, 38px); margin-top: 20px; line-height: 1.1; }
.pw-booksets-text { color: rgba(255,255,255,.85); font-size: 16.5px; line-height: 1.65; margin-top: 12px; max-width: 500px; }
.pw-booksets-cta { margin-top: 20px; }
.pw-booksets-stk { align-self: flex-start; }
.pw-booksets-grid { position: relative; display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 18px; margin-top: 30px; }
.pw-booksets-card { background: #fff; border-radius: var(--pw-r-md); overflow: hidden; }
.pw-booksets-card-body { padding: 12px 13px 14px; }
.pw-booksets-card-title {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  font-family: var(--pw-display); font-weight: 700; font-size: 14.5px; color: var(--pw-ink);
  line-height: 1.25; min-height: 36px;
}
.pw-booksets-card .pw-prod-foot { margin-top: 8px; }
/* Band cards run 16px, not the 18px base (home-sections.jsx BookSetsBand). */
.pw-booksets-card .pw-prod-price { font-size: 16px; }

/* ── ClassWallet callout + schools card ── */
.pw-cw-grid { display: grid; grid-template-columns: 1.5fr 1fr; gap: 24px; }
.pw-cw-card {
  background: #EFEEF9; border-radius: var(--pw-r-xl); padding: 42px 44px;
  position: relative; overflow: hidden; display: flex; align-items: center; gap: 28px;
}
.pw-cw-card-main { flex: 1; }
.pw-cw-eyebrow { color: #6B5BB0; }
.pw-cw-heading { font-size: 30px; margin-top: 10px; color: #4B3B82; max-width: 440px; line-height: 1.15; }
.pw-cw-text { color: var(--pw-ink-2); max-width: 460px; line-height: 1.65; margin-top: 12px; font-size: 15.5px; }
.pw-cw-btn { background: #6B5BB0; color: #fff; }
.pw-cw-btn:hover { filter: brightness(1.08); }
.pw-cw-sticker { flex-shrink: 0; }
.pw-cw-schools { background: var(--pw-yellow-light); border-radius: var(--pw-r-xl); padding: 36px; position: relative; }
.pw-cw-schools-heading { font-size: 25px; margin-top: 10px; color: var(--pw-blue); }
.pw-cw-schools-text { color: var(--pw-ink-2); max-width: 320px; line-height: 1.6; margin-top: 10px; font-size: 15px; }
.pw-cw-schools-stk { opacity: .96; }

/* ── Testimonials band ── */
.pw-testimonials-band {
  background: var(--pw-blue); border-radius: var(--pw-r-xl); padding: 52px 48px;
  color: #fff; position: relative; overflow: hidden;
}
.pw-testimonials-inner { position: relative; z-index: 1; }
.pw-testimonials-eyebrow { font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--pw-yellow); margin-bottom: 12px; }
.pw-testimonials-title { color: #fff; font-size: clamp(26px, 3.2vw, 34px); max-width: 720px; }
.pw-testimonials-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin-top: 36px; }
.pw-testimonial-card { background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.18); border-radius: var(--pw-r-md); padding: 24px; }
.pw-testimonial-stars { color: var(--pw-yellow); display: flex; gap: 2px; margin-bottom: 12px; }
.pw-testimonial-quote { font-size: 15.5px; line-height: 1.55; color: rgba(255,255,255,.95); }
.pw-testimonial-by { margin-top: 16px; padding-top: 16px; border-top: 1px solid rgba(255,255,255,.15); font-size: 13px; }
.pw-testimonial-role { color: rgba(255,255,255,.7); }

/* ── Final CTA (bear band) ── */
.pw-final-band {
  background: var(--pw-yellow-light); border-radius: var(--pw-r-xl); padding: 52px 56px;
  position: relative; overflow: hidden; display: flex; align-items: center;
  justify-content: space-between; gap: 30px; flex-wrap: wrap;
}
.pw-final-copy { max-width: 540px; }
.pw-final-eyebrow { margin-bottom: 12px; }
.pw-final-title { font-size: clamp(32px, 4.4vw, 46px); color: var(--pw-blue); line-height: 1.04; }
.pw-final-text { margin-top: 14px; font-size: 17.5px; color: var(--pw-ink-2); line-height: 1.6; max-width: 470px; }
.pw-final-ctas { display: flex; gap: 14px; margin-top: 26px; flex-wrap: wrap; }
/* Right-anchored bear scales down before it can crowd the copy (hidden ≤860). */
@media (max-width: 1350px) { .pw-final-bear { height: 260px !important; } }
@media (max-width: 1150px) { .pw-final-bear { height: 180px !important; } }
@media (max-width: 1020px) { .pw-final-bear { height: 120px !important; } }

/* ── Scattered gold deco motifs for dark-blue bands (BlueDeco) ── */
.pw-bluedeco { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.pw-bluedeco-i { position: absolute; }

/* ── Warm-home responsive polish ── */
@media (max-width: 900px) {
  .pw-hero-collage { min-height: 0; }
}
@media (max-width: 860px) {
  .pw-cw-card { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 640px) {
  .pw-testimonials-band { padding: 34px 24px; }
  .pw-booksets-band { padding: 32px 24px 30px; }
  .pw-final-band { padding: 34px 26px; }
  .pw-cw-card, .pw-cw-schools { padding: 30px 26px; }
  .pw-hero-title { line-height: 1.06; }
  .pw-sechead { align-items: flex-start; }
}

/* ── Branded placeholder tile inside the tiny "Popular right now" cards:
      clamp the title so it never overflows the tile ── */
.pw-mini .cover { overflow: hidden; }
.pw-mini .pw-cover-ph-title {
  font-size: 11px;
  line-height: 1.15;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  overflow-wrap: break-word;
  padding: 0 4px;
}
.pw-mini .pw-cover-ph-cat, .pw-mini .pw-cover-ph-foot { display: none; }

/* ── Focal framing ──
   cover-crop keeps the CENTER by default, which decapitates people photos
   whose faces sit in the upper third. Positions tuned to the bundled photos;
   if the client swaps a photo via ACF and framing looks off, adjust here. */
.pw-hero-photos > .pw-photo:nth-child(2) img { object-position: 50% 30%; } /* kids at the table */
.pw-hero-photos > .pw-photo:nth-child(3) img { object-position: 50% 12%; } /* family reading — dad's hair at 4% */
.pw-why-photo img { object-position: 50% 18%; }                            /* square photo in a 1.27:1 frame */