/* Figma 4242:3610. Loaded exclusively by page-products.php.
 * Desktop reference: 1440 × 4149, content width 1264, side gutters 88.
 * The homepage stylesheet is intentionally not a dependency. */
/* Match Figma's hhea metrics (1050 / -300 per 1000 units), rather than
 * the font's OS/2 typo metrics (760 / -240) selected by Chromium. */
@font-face {
    font-family: "BR Segma Products";
    src: url("assets/fonts/BRSegma-ExtraLight.otf") format("opentype");
    font-weight: 200; font-style: normal; font-display: swap;
    ascent-override: 105%; descent-override: 30%; line-gap-override: 0%;
}
@font-face {
    font-family: "BR Segma Products";
    src: url("assets/fonts/BRSegma-Light.otf") format("opentype");
    font-weight: 300; font-style: normal; font-display: swap;
    ascent-override: 105%; descent-override: 30%; line-gap-override: 0%;
}
@font-face {
    font-family: "BR Segma Products";
    src: url("assets/fonts/BRSegma-Regular.otf") format("opentype");
    font-weight: 400; font-style: normal; font-display: swap;
    ascent-override: 105%; descent-override: 30%; line-gap-override: 0%;
}
@font-face {
    font-family: "BR Segma Products";
    src: url("assets/fonts/BRSegma-Medium.otf") format("opentype");
    font-weight: 500; font-style: normal; font-display: swap;
    ascent-override: 105%; descent-override: 30%; line-gap-override: 0%;
}
@font-face {
    font-family: "BR Segma Products";
    src: url("assets/fonts/BRSegma-SemiBold.otf") format("opentype");
    font-weight: 600; font-style: normal; font-display: swap;
    ascent-override: 105%; descent-override: 30%; line-gap-override: 0%;
}
body.pyp-products-figma { --px-gutter: max(32px, calc((100% - 1264px) / 2)); background: #f5f5f5; }
.px-products { font-family: "BR Segma Products", Arial, sans-serif; font-weight: 400; color: #20261f; }
.px-products :is(h1,h2,h3,p,ul) { margin: 0; }
.px-products :is(h1,h2,h3) { font-family: inherit; text-wrap: initial; }
.px-products .px-eyebrow { display: block; color: #d8b98c; font-size: 12px; font-weight: 400; line-height: 15px; letter-spacing: 0; text-transform: uppercase; }
.px-products .px-container { width: min(1264px, calc(100% - 64px)); margin-inline: auto; }
.px-products :is(.px-index__head,.px-programs__head) h2 { margin-top: 8px; font-size: 48px; font-weight: 600; line-height: 62px; }
.px-products :is(.px-index__head,.px-programs__head) > p { color: #999; font-size: 16px; font-weight: 500; line-height: 26px; }
.px-products .px-hero { position: relative; display: flex; align-items: center; height: 600px; background: #fff; overflow: hidden; }
.px-products .px-hero__copy { position: relative; z-index: 1; width: 571px; max-width: calc(49.097222% - 88px); margin-left: var(--px-gutter); display: flex; flex-direction: column; gap: 24px; padding-block: 40px; }
.px-products .px-hero h1 { margin-top: 8px; color: #000; font-size: 48px; font-weight: 500; line-height: 48px; letter-spacing: -.96px; }
.px-products .px-hero__copy > p { padding-top: 7.2px; font-size: 16px; font-weight: 500; line-height: 26px; color: #999; }
.px-products .px-hero__image { position: absolute; inset: 0 0 0 auto; width: 50.902778%; height: 100%; object-fit: cover; object-position: center; }
.px-products .px-index { padding: 110px 0; background: #eee8dc; }
.px-products .px-index__head { display: flex; align-items: center; justify-content: space-between; gap: 40px; margin-bottom: 48px; }
.px-products .px-index__head > p { width: 491.64px; flex-shrink: 0; }
.px-products .px-index__groups { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); border-top: 1px solid rgba(32,38,31,.14); border-left: 1px solid rgba(32,38,31,.14); }
.px-products .px-index__group { min-width: 0; min-height: 476.5px; padding: 24px 16px; border-right: 1px solid rgba(32,38,31,.14); border-bottom: 1px solid rgba(32,38,31,.14); }
.px-products .px-index__group h3 { min-height: 50.5px; font-size: 20px; font-weight: 600; line-height: 27px; }
.px-products .px-index__group ul { list-style: none; padding: 0; }
.px-products .px-index__group li + li { border-top: 1px solid rgba(32,38,31,.09); }
.px-products .px-index__group a { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 46px; padding: 4px 0; color: #5c6156; font-size: 13px; line-height: 20px; }
.px-products .px-index__group:first-child li:first-child a { font-size: 14px; }
.px-products .px-index__group a span:last-child { flex: 0 0 10px; font-size: 13px; }
.px-products .px-index__group a:hover { color: #9c5b2e; }
.px-products .px-index__group h3 > a { min-height: 0; padding: 0; color: #20261f; font: inherit; line-height: inherit; }
.px-products .px-index__group h3 > a span { flex: 0 0 auto; color: #9c5b2e; font-size: .72em; }
.px-products .px-programs { background: #f5f5f5; padding: 110px 0; }
.px-products .px-programs__head { display: grid; grid-template-columns: minmax(0,680.8fr) minmax(0,503.2fr); gap: 80px; align-items: end; margin-bottom: 48px; }
.px-products .px-programs__head h2 { letter-spacing: -.96px; }
.px-products .px-programs__grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); grid-template-rows: 450px 450px; gap: 16px; padding-bottom: 6px; }
.px-products .px-card { position: relative; display: flex; align-items: flex-end; min-width: 0; height: 450px; overflow: hidden; color: #fff; background: #2e463c; }
.px-products .px-card__image { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; }
.px-products .px-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top,rgba(13,22,17,.82) 0%,rgba(13,22,17,.06) 66%); pointer-events: none; }
.px-products .px-card__body { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: flex-start; gap: 16px; width: 100%; padding: 24px; }
.px-products .px-card__copy { display: flex; flex-direction: column; gap: 8px; width: 100%; }
.px-products .px-card__meta { font-size: 12px; font-weight: 500; line-height: 17px; text-transform: uppercase; color: rgba(255,255,255,.68); }
.px-products .px-card h3 { min-height: 33px; font-size: 32px; font-weight: 500; line-height: 32.4px; letter-spacing: -.64px; color: #fff; }
.px-products .px-card p { min-height: 45px; font-size: 14px; font-weight: 500; line-height: 22.4px; color: rgba(255,255,255,.74); }
.px-products .px-card__link { padding-bottom: 3px; border-bottom: 1px solid rgba(255,255,255,.65); font-size: 12px; font-weight: 400; line-height: 18px; text-transform: uppercase; color: #fff; }
.px-products .px-card:hover .px-card__link { border-color: #fff; }
.px-products .px-package { position: relative; height: 437px; overflow: hidden; background: #e0dfda; }
.px-products .px-package__image { position: absolute; inset: 0; width: 100%; max-width: none; height: 100%; object-fit: cover; }
.px-products .px-package::after { content: ""; position: absolute; inset: -.5px 51.319444% .5px 0; pointer-events: none; background: linear-gradient(90deg,rgba(13,29,23,.395),rgba(13,29,23,.336) 35%,rgba(13,29,23,.101) 68%,rgba(13,29,23,0)); }
.px-products .px-package__inner { position: relative; z-index: 1; padding: 70px 0; }
.px-products .px-package__copy { width: 558px; max-width: 58%; display: flex; flex-direction: column; gap: 10px; }
.px-products .px-package .px-eyebrow { font-weight: 500; line-height: 12px; letter-spacing: 2.16px; }
.px-products .px-package h2 { color: #fff; font-size: 48px; font-weight: 600; line-height: 48px; letter-spacing: -.96px; }
.px-products .px-package p { padding-top: 14px; color: rgba(255,255,255,.78); font-size: 14px; font-weight: 400; line-height: 26px; }
.px-products .px-package__button { display: flex; width: 214px; height: 55px; align-items: center; justify-content: center; margin-top: 48px; background: #fff; color: #010101; font-size: 14px; font-weight: 500; line-height: 18px; letter-spacing: -.28px; }
.px-products .px-package__button:hover { background: #eee8dc; }
body.pyp-products-figma :is(a,button):focus-visible { outline: 2px solid #9c5b2e; outline-offset: 4px; }
/* Navigation inherits the approved shared component. Footer overrides remain page-scoped. */
html body.pyp-products-figma .pyp-footer { background: #14271f; font-family: "BR Segma Products", Arial, sans-serif; }
html body.pyp-products-figma .pyp-footer__cta { display: block !important; background: #efe8dc; }
html body.pyp-products-figma .pyp-footer__cta::after { display: none; }
html body.pyp-products-figma .pyp-footer__cta-inner { display: flex; flex-direction: column; align-items: center; gap: 48px; width: 100%; max-width: 1360px; min-height: 440.5px; margin: 0 auto; padding: 86px 48px; text-align: center; }
html body.pyp-products-figma .pyp-footer__cta-inner > div { width: 760px; max-width: 100%; }
html body.pyp-products-figma .pyp-footer__eyebrow { display: block; margin: 0; color: #a86335; font-size: 12px; font-weight: 500; line-height: 12px; letter-spacing: 0; }
html body.pyp-products-figma .pyp-footer__cta h2 { max-width: 706px; margin: 8px auto 0; padding-bottom: 16px; font: 600 48px/48px "BR Segma Products",Arial,sans-serif; color: #20261f; letter-spacing: -.96px; }
html body.pyp-products-figma .pyp-footer__cta h2 span { display: block; }
html body.pyp-products-figma .pyp-footer__cta p { margin: 8px 0 0; max-width: none; font: 300 14px/26px "BR Segma Products",Arial,sans-serif; color: rgba(32,55,46,.68); }
html body.pyp-products-figma .pyp-footer__cta a { display: flex; width: 213.83px; min-width: 213.83px; height: 54.5px; min-height: 54.5px; align-items: center; justify-content: center; padding: 16px 34px; border: 1px solid #9c5b2e; border-radius: 0; background: #9c5b2e; color: #f8f5ed; font: 400 14px/18px "BR Segma Products",Arial,sans-serif; letter-spacing: 0; text-transform: none; }



















/* Extra legacy marketing bands are not part of this approved product-page layout. */
html body.pyp-products-figma .pyp-mobile-dock { display: none; }
@media (min-width: 1328px) {
    /* Figma's 368px label extends 5.3px into the card's 24px right padding. */
    .px-products .px-card--umbrellas h3 { width: max-content; white-space: nowrap; }
}
@media (max-width: 1200px) {
    .px-products .px-desktop-break { display: none; }
    .px-products .px-hero { height: 540px; }
    .px-products .px-hero__copy { max-width: calc(49.097222% - 64px); }
    .px-products .px-index__head > p { width: 40%; }
    .px-products :is(.px-index__head,.px-programs__head) h2 { font-size: 40px; line-height: 48px; }
    .px-products .px-programs__head { gap: 40px; }
    .px-products .px-index__group h3 { font-size: 17px; }
    .px-products .px-card h3 { font-size: 27px; line-height: 30px; }
    
}
@media (max-width: 1000px) {
    .px-products .px-hero h1 { font-size: 40px; line-height: 42px; }
    .px-products .px-index__groups { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .px-products .px-index__group { min-height: 0; }
    .px-products .px-index__group h3 { min-height: 50.5px; font-size: 20px; }
    .px-products .px-programs__grid { grid-template-columns: repeat(2,minmax(0,1fr)); grid-template-rows: none; grid-auto-rows: 450px; padding: 0; }
    .px-products .px-package__image { height: 100%; width: 100%; bottom: 0; right: 0; object-fit: cover; }
    .px-products .px-package__copy { max-width: 65%; }
    .px-products .px-package h2 { font-size: 40px; line-height: 42px; }
    
    
}
@media (max-width: 700px) {
    body.pyp-products-figma { --px-gutter: 20px; padding-bottom: 0; }
    .px-products .px-container { width: calc(100% - 40px); }
    .px-products .px-hero { display: flex; flex-direction: column; height: auto; }
    .px-products .px-hero__copy { width: auto; max-width: none; margin: 0; padding: 56px 20px 40px; gap: 20px; }
    .px-products .px-hero h1 { font-size: 36px; line-height: 38px; letter-spacing: -.72px; }
    .px-products .px-hero__copy > p { font-size: 14px; line-height: 23px; padding-top: 0; }
    .px-products .px-hero__image { position: static; width: 100%; height: auto; aspect-ratio: 733 / 600; }
    .px-products :is(.px-index,.px-programs) { padding-block: 60px; }
    .px-products :is(.px-index__head,.px-programs__head) { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; margin-bottom: 32px; }
    .px-products :is(.px-index__head,.px-programs__head) > p { width: 100%; font-size: 14px; line-height: 23px; }
    .px-products :is(.px-index__head,.px-programs__head) h2 { font-size: 32px; line-height: 36px; letter-spacing: -.64px; }
    .px-products .px-index__groups { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .px-products .px-index__group { padding: 20px 12px; }
    .px-products .px-index__group h3 { min-height: 60px; font-size: 18px; line-height: 22px; }
    .px-products .px-index__group a { min-height: 48px; font-size: 12px; line-height: 19px; gap: 8px; }
    .px-products .px-index__group:first-child li:first-child a { font-size: 12px; }
    .px-products .px-programs__grid { grid-template-columns: minmax(0,1fr); grid-auto-rows: auto; gap: 16px; }
    .px-products .px-card { height: auto; min-height: 420px; aspect-ratio: 411 / 450; }
    .px-products .px-card__body { padding: 24px; }
    .px-products .px-card h3 { font-size: 30px; line-height: 32px; }
    .px-products .px-package { height: auto; min-height: 460px; }
    .px-products .px-package__inner { padding-block: 60px; }
    .px-products .px-package__copy { width: 100%; max-width: 100%; }
    .px-products .px-package h2 { font-size: 36px; line-height: 38px; letter-spacing: -.72px; }
    .px-products .px-package__image { object-position: 70% center; }
    .px-products .px-package::after { inset: 0; background: rgba(13,29,23,.5); }
    .px-products .px-package__button { margin-top: 32px; }
    .px-products .px-desktop-break { display: none; }
    html body.pyp-products-figma .pyp-footer__cta-inner { min-height: 0; padding: 64px 20px; gap: 32px; }
    html body.pyp-products-figma .pyp-footer__cta h2 { font-size: 32px; line-height: 34px; letter-spacing: -.64px; }
    html body.pyp-products-figma .pyp-footer__cta p { font-size: 14px; line-height: 23px; }
    
    
    
    
    
    
    
    
    
    
}

/* Products mobile reference: Figma 4325:6309, 390px canvas.
 * Append-only release: everything below is inactive above 700px.
 * Existing desktop PHP, CSS, typography and image srcsets remain unchanged. */
@media (max-width: 700px) {
  @layer pyp-site-typography {
    html body.pyp-products-figma .px-products p {
      font-size: 14px !important; font-weight: 500 !important; line-height: 23px !important;
    }
    html body.pyp-products-figma .px-products .px-card p { line-height: 22.4px !important; }
    html body.pyp-products-figma .pyp-footer__cta p {
      font-size: 14px !important; font-weight: 500 !important; line-height: 19.6px !important;
    }
  }
  html body.pyp-products-figma { --px-gutter: 24px; }
  html body.pyp-products-figma .pyp-header { padding: 8px 0; backdrop-filter: blur(5px); }
  html body.pyp-products-figma .pyp-header__bar { height: 36px; min-height: 36px; padding: 8px 24px; }
  html body.pyp-products-figma .pyp-header__logo { gap: 4px; align-items: flex-end; min-height: 0; height: 17.669px; }
  html body.pyp-products-figma .pyp-header__logo img { width: 103.034px; height: 17.669px; }
  html body.pyp-products-figma .pyp-header__logo span { font-size: 8px; line-height: 8px; letter-spacing: 0; }
  html body.pyp-products-figma .pyp-mobile-toggle { width: 20px; height: 20px; min-width: 20px; min-height: 20px; border: 0; padding: 0; gap: 4.545px; background: transparent; }
  html body.pyp-products-figma .pyp-mobile-toggle span { width: 20px; height: 1.364px; margin: 0; }
  html body.pyp-products-figma .px-container { width: calc(100% - 48px); }
  html body.pyp-products-figma .px-eyebrow { color: #a46629; }
  html body.pyp-products-figma .px-hero { height: 650px; }
  html body.pyp-products-figma .px-hero__copy { width: 100%; flex: 0 0 324px; padding: 56px 24px 40px; gap: 20px; }
  html body.pyp-products-figma .px-hero h1 { font-size: 32px !important; font-weight: 600; line-height: 38.4px !important; letter-spacing: -1.17px !important; }
  html body.pyp-products-figma .px-hero__image {
    content: image-set(url("assets/products-mobile-4325/hero.webp") 1x, url("assets/products-mobile-4325/hero@2x.webp") 2x);
    width: 100%; height: 326px; min-height: 0; flex: 1 1 326px; aspect-ratio: auto; object-fit: cover;
  }
  html body.pyp-products-figma :is(.px-index,.px-programs) { padding-block: 56px; }
  html body.pyp-products-figma .px-index__head { margin-bottom: 32px; }
  html body.pyp-products-figma .px-index__head h2 { font-size: clamp(29px,8.205128vw,32px); line-height: 36px; }
  html body.pyp-products-figma .px-index__groups {
    grid-template-columns: minmax(0,174.5fr) minmax(0,167fr);
    grid-template-rows: 509px 369px 312px;
    border-bottom: 0;
  }
  html body.pyp-products-figma .px-index__group { padding: 20px 12px; }
  html body.pyp-products-figma .px-index__group h3 { min-height: 44px; line-height: 22px; }
  html body.pyp-products-figma .px-index__group a { font-weight: 400; min-height: 48px; }
  html body.pyp-products-figma .px-index__group:nth-child(n/**/+3) a { min-height: 56px; }
  html body.pyp-products-figma .px-index__group a span:first-child { min-width: 0; }
  html body.pyp-products-figma .px-index__group:first-child li:nth-child(2) a span:first-child,
  html body.pyp-products-figma .px-index__group:first-child li:nth-child(4) a span:first-child { white-space: nowrap; }
  html body.pyp-products-figma .px-programs__head { gap: 16px; margin-bottom: 24px; }
  html body.pyp-products-figma .px-programs__head .px-eyebrow { color: #d8b98c; }
  html body.pyp-products-figma .px-programs__grid {
    display: flex; flex-wrap: nowrap; gap: 16px; padding: 0; height: 420px;
    overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory;
    overscroll-behavior-x: contain; scrollbar-width: none;
  }
  html body.pyp-products-figma .px-programs__grid::-webkit-scrollbar { display: none; }
  html body.pyp-products-figma .px-card { flex: 0 0 100%; width: 100%; height: 420px; min-height: 420px; aspect-ratio: auto; scroll-snap-align: start; scroll-snap-stop: always; }
  html body.pyp-products-figma .px-card--sofas .px-card__image {
    content: image-set(url("assets/products-mobile-4325/sofas.webp") 1x, url("assets/products-mobile-4325/sofas@2x.webp") 2x);
  }
  html body.pyp-products-figma .px-card h3 { font-size: 30px; line-height: 32px; }
  html body.pyp-products-figma .px-card__body { gap: 16px; padding: 24px; }
  html body.pyp-products-figma .px-package { height: 650px; min-height: 650px; }
  html body.pyp-products-figma .px-package__image {
    content: image-set(url("assets/products-mobile-4325/package.webp") 1x, url("assets/products-mobile-4325/package@2x.webp") 2x);
    width: 100%; height: 100%; object-fit: cover; object-position: center;
  }
  html body.pyp-products-figma .px-package::after { display: none; }
  html body.pyp-products-figma .px-package__inner { position: absolute; bottom: 0; left: 20px; width: calc(100% - 48px); padding: 60px 0 32px; }
  html body.pyp-products-figma .px-package__copy { gap: 0; }
  html body.pyp-products-figma .px-package h2 { margin-top: 8px; font-size: 32px; line-height: 38px; letter-spacing: -.72px; color: #000; }
  html body.pyp-products-figma .px-package p { padding-top: 16px; color: #fff; }
  html body.pyp-products-figma .px-package__button { width: fit-content; min-width: 0; height: auto; min-height: 0; padding: 12px 24px; margin-top: 24px; font-size: 14px; line-height: 18px; }
  html body.pyp-products-figma .pyp-footer__cta-inner { padding: 56px 24px; gap: 24px; min-height: 303px; }
  html body.pyp-products-figma .pyp-footer__cta h2 { max-width: none; font-size: 24px; line-height: 26.4px; letter-spacing: -.48px; margin-top: 4px; padding-bottom: 0; }
  html body.pyp-products-figma .pyp-footer__cta h2 span { display: inline; }
  html body.pyp-products-figma .pyp-footer__cta h2 span + span::before { content: " "; }
  html body.pyp-products-figma .pyp-footer__cta p { margin-top: 16px; }
  html body.pyp-products-figma .pyp-footer__cta a { background: #9c5b2e; color: #faf8f3; border: 0; box-shadow: 0 3px 7px rgba(156,91,46,.3); width: fit-content; min-width: 0; height: auto; min-height: 0; padding: 12px 24px; font-weight: 500; }
  
}

/* Figma 4217:2744, mobile footer of 4217:1836; latest approved 300 weight.
 * This is the shared footer, not the preceding conversation CTA. */
@media (max-width: 700px) {
  @layer pyp-site-typography {
    html body.pyp-products-figma .pyp-footer {
      padding-bottom: 24px !important;
      gap: 0 !important; /* The copyright margin supplies the single 40px gap. */
      height: auto !important;
      min-height: 0 !important;
    }
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
  }
}

/* Figma 4242:3610 desktop typography; all mobile rules remain unchanged. */
@media (min-width: 701px) {
  html body.pyp-products-figma .px-hero h1 { font-weight:600; line-height:1.2; }
  html body.pyp-products-figma .px-hero__copy > p,
  html body.pyp-products-figma :is(.px-index__head,.px-programs__head) > p { font-weight:500; line-height:25.6px; }
  html body.pyp-products-figma .px-card__meta { line-height:16.5px; }
  html body.pyp-products-figma .px-card p { font-size:14px; font-weight:500; line-height:22.4px; }
  html body.pyp-products-figma .px-card__link { text-transform:capitalize; }
  
  
  
  
  
  html body.pyp-products-figma .pyp-footer__cta h2 { color:#20261f; }
  html body.pyp-products-figma .pyp-footer__cta p { width:auto; }
  html body.pyp-products-figma .pyp-footer__cta a { background:#9c5b2e; }
  html body.pyp-products-figma .px-package__image {
    content:image-set(url("assets/products-desktop-20260828/package.webp") 1x,url("assets/products-desktop-20260828/package@2x.webp") 2x);
  }
}
@media (min-width:1101px) {
  html body.pyp-products-figma .pyp-header { min-height:75px; }
}
@media (min-width:1201px) {
  html body.pyp-products-figma .px-hero h1 { min-height:116px; }
  html body.pyp-products-figma .px-hero__copy > p { min-height:59.2px; }
  html body.pyp-products-figma :is(.px-index__head,.px-programs__head) h2 { line-height:61.2px; min-height:62px; }
  html body.pyp-products-figma :is(.px-index__head,.px-programs__head) > p { min-height:78px; }
  html body.pyp-products-figma .px-index__group h3 { line-height:26.25px; }
}
@media (min-width:1441px) {
  /* At a wide viewport the original 1X export is too small, even on DPR1. */
  html body.pyp-products-figma .px-hero__image {
    content:image-set(url("assets/products-4242/hero@2x.webp") 1x,url("assets/products-desktop-20260828/hero-large@2x.webp") 2x);
  }
}

/* Current Figma 4325:6309 / 4335:14533. Products mobile only. */
@media (max-width:700px) {
  html body.pyp-products-figma .px-card__link { text-transform:capitalize; }
  
}

/* User-approved Products PC eyebrow colours and all prose, 2026-08-28.
 * Never apply these overrides to mobile, navigation, headings or buttons. */
@media (min-width:701px) {
  html body.pyp-products-figma .px-products .px-eyebrow,
  html body.pyp-products-figma .pyp-footer .pyp-footer__eyebrow {
    color:#a46629;
  }
  /* Let the larger brand paragraph keep the existing bottom gutter. */
  
  /* Product cards follow the newer, explicit screenshot specifications. */
  html body.pyp-products-figma .px-products .px-card h3 {
    font-family:"BR Segma Products",Arial,sans-serif;
    font-size:32px;
    font-weight:500;
    line-height:32.4px;
    letter-spacing:-.64px;
    color:#fff;
  }
  html body.pyp-products-figma .px-products .px-card__meta {
    font-family:"BR Segma Products",Arial,sans-serif;
    font-size:12px;
    font-weight:500;
    line-height:16.5px;
    letter-spacing:0;
    color:rgba(255,255,255,.68);
  }
  html body.pyp-products-figma .px-products .px-card__link {
    font-family:"BR Segma Products",Arial,sans-serif;
    font-size:14px;
    font-weight:400;
    line-height:18px;
    letter-spacing:0;
    color:#fff;
    text-transform:capitalize;
    padding-bottom:3px;
    border-bottom:1px solid rgba(255,255,255,.65);
  }
  @layer pyp-site-typography {
    html body.pyp-products-figma .px-products p,
    html body.pyp-products-figma .pyp-footer .pyp-footer__cta p {
      font-family:"BR Segma Products",Arial,sans-serif!important;
      font-style:normal!important;
      font-weight:500!important;
      font-size:16px!important;
      line-height:1.6!important;
      letter-spacing:0!important;
      color:#999!important;
    }
    html body.pyp-products-figma .px-products .px-card p {
      font-size:14px!important;
      line-height:22.4px!important;
      color:rgba(255,255,255,.74)!important;
    }
  }
}

/* Preserve the original chair proportions on wide desktop viewports.
 * Use the uncropped Figma source instead of enlarging the 1440px crop. */
@media (min-width:1441px) {
  html body.pyp-products-figma .px-package {
    --px-package-right:clamp(-92px,calc((100vw - 1920px) * .191667),0px);
  }
  html body.pyp-products-figma .px-package__image {
    content:image-set(url("assets/products-package-wide-20260828/package-full.webp") 1x,url("assets/products-package-wide-20260828/package-full-hd.webp") 2x);
    width:max(1756px,calc(100% - var(--px-package-right)));
    height:auto;
    aspect-ratio:3512 / 1745;
    inset:auto var(--px-package-right) calc(max(1756px,100vw) * -.06065) auto;
    object-fit:cover;
  }
}
@media (min-width:1921px) {
  html body.pyp-products-figma .px-package {
    height:calc(100vw * .227604167);
    min-height:437px;
  }
}

/* Later explicit mobile approval: prose weight only; keep headings/controls. */
@media (max-width:700px) {
  @layer pyp-site-typography {
    html body.pyp-products-figma .px-products :is(.px-hero__copy,.px-index__head,.px-programs__head,.px-card,.px-package) p,
    html body.pyp-products-figma .pyp-footer .pyp-footer__cta p {
      font-weight:300!important;
    }
    html body.pyp-products-figma .px-products .px-package p {
      color:#999!important;
    }
  }
}

/* Latest approved mobile mixed-package card treatment, 2026-08-28.
 * The source image stays unmodified; the Figma shading is reproduced as a
 * responsive overlay so the text remains legible without reducing sharpness. */
@media (max-width:700px) {
  html body.pyp-products-figma .px-products .px-package::after {
    display:block;
    inset:0;
    z-index:0;
    background:linear-gradient(
      180deg,
      rgba(13,29,23,0) 49%,
      rgba(13,29,23,.45) 100%
    );
  }
  html body.pyp-products-figma .px-products .px-package h2 {
    color:#fff;
  }
  html body.pyp-products-figma .px-products .px-package .px-eyebrow {
    font-weight:500;
    line-height:12px;
    letter-spacing:0;
  }
  html body.pyp-products-figma .px-products .px-package__button {
    font-family:"BR Segma Products",Arial,sans-serif;
    font-size:14px;
    font-weight:300;
    line-height:18px;
    letter-spacing:-.28px;
    color:#010101;
  }
  @layer pyp-site-typography {
    html body.pyp-products-figma .px-products .px-package p {
      color:rgba(255,255,255,.78)!important;
      font-weight:300!important;
    }
  }
}

/* Products footer navigation: fresh Figma 4243:4535 / 4335:14533.
 * Keep the shared footer, CTA band and Products main content untouched.
 * Use the existing calibrated BR Segma faces at their actual named weights. */








/* Latest approval: Products prose is Light 300 on desktop and mobile.
 * The shared footer stylesheet now owns footer navigation at every viewport. */
@layer pyp-site-typography {
  html body.pyp-products-figma .px-products.px-products p,
  html body.pyp-products-figma .pyp-footer .pyp-footer__cta p {
    font-family:"BR Segma Figma Web",Arial,sans-serif!important;
    font-weight:300!important;
    font-synthesis:none;
  }
  html body.pyp-products-figma .px-products .px-package p {
    color:rgba(255,255,255,.78)!important;
  }
}
