/* PressPair V2006 — unified mobile shopping and reading experience. */
:root {
  --pp-v2006-navy: #061b34;
  --pp-v2006-gold: #d2a54b;
  --pp-v2006-cream: #fbf7ee;
  --pp-v2006-mobile-max: 430px;
}

html.pp-mobile-mode {
  min-width: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
  background: #03172b !important;
}

html.pp-mobile-mode body {
  min-width: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  overflow-x: hidden !important;
  padding-bottom: env(safe-area-inset-bottom) !important;
}

html.pp-mobile-mode body *,
html.pp-mobile-mode body *::before,
html.pp-mobile-mode body *::after {
  box-sizing: border-box;
}

html.pp-mobile-mode img,
html.pp-mobile-mode video,
html.pp-mobile-mode iframe,
html.pp-mobile-mode canvas {
  max-width: 100%;
}

@media (min-width: 901px) {
  html.pp-mobile-mode body {
    width: var(--pp-v2006-mobile-max) !important;
    max-width: var(--pp-v2006-mobile-max) !important;
    box-shadow: 0 0 48px rgba(0, 0, 0, .42);
  }
}

/* Header and menu: one clear mobile control row on every page. */
html.pp-mobile-mode body .pp-global-header {
  width: 100% !important;
  max-width: 100% !important;
  overflow: visible !important;
}

html.pp-mobile-mode body .pp-global-header .pp-global-topbar {
  height: 25px !important;
  min-height: 25px !important;
  max-height: 25px !important;
  gap: 6px !important;
  padding: 0 5px !important;
  overflow: hidden !important;
  font-size: 6.4px !important;
  letter-spacing: .075em !important;
  white-space: nowrap !important;
}

html.pp-mobile-mode body .pp-global-header .pp-global-topbar i {
  flex: 0 0 1px !important;
  height: 8px !important;
}

html.pp-mobile-mode body .pp-global-header .pp-global-navrow {
  width: 100% !important;
  height: 72px !important;
  min-height: 72px !important;
  max-height: 72px !important;
  padding: 0 8px !important;
  display: grid !important;
  grid-template-columns: 38px minmax(0, 1fr) 70px !important;
  gap: 4px !important;
  align-items: center !important;
  overflow: visible !important;
}

html.pp-mobile-mode body .pp-global-header .pp-global-menu {
  display: grid !important;
  place-items: center !important;
  width: 36px !important;
  min-width: 36px !important;
  height: 36px !important;
  padding: 0 !important;
  position: relative !important;
  z-index: 10002 !important;
  touch-action: manipulation !important;
}

html.pp-mobile-mode body .pp-global-header .pp-global-links {
  display: none !important;
}

html.pp-mobile-mode body .pp-global-header .pp-global-brand {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 70px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  overflow: hidden !important;
}

html.pp-mobile-mode body .pp-global-header .pp-global-brand .pp-global-brand-lockup {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 250px !important;
  height: 66px !important;
  min-height: 66px !important;
  max-height: 66px !important;
  object-fit: contain !important;
  object-position: center !important;
  border: 0 !important;
  border-radius: 0 !important;
}

html.pp-mobile-mode body .pp-global-header .pp-global-brand .pp-branding-badge {
  width: 50px !important;
  min-width: 50px !important;
  height: 50px !important;
}

html.pp-mobile-mode body .pp-global-header .pp-global-brand .pp-branding-badge img {
  display: block !important;
  width: 34px !important;
  height: 42px !important;
}

html.pp-mobile-mode body .pp-global-header .pp-global-brand .pp-branding-wordmark {
  display: block !important;
  width: min(180px, calc(100vw - 180px)) !important;
  max-width: 180px !important;
  height: 48px !important;
}

html.pp-mobile-mode body .pp-global-header .pp-global-actions {
  width: 70px !important;
  min-width: 70px !important;
  display: flex !important;
  justify-content: flex-end !important;
  gap: 2px !important;
  margin: 0 !important;
  transform: none !important;
}

html.pp-mobile-mode body .pp-global-header .pp-global-icon {
  width: 33px !important;
  min-width: 33px !important;
  height: 36px !important;
  padding: 0 !important;
  font-size: 21px !important;
}

html.pp-mobile-mode body .pp-global-header .pp-global-mobile {
  display: none !important;
  width: 100% !important;
  max-height: calc(100dvh - 97px) !important;
  overflow: auto !important;
  position: relative !important;
  z-index: 10001 !important;
  padding: 8px 18px 20px !important;
  background: var(--pp-v2006-navy) !important;
}

html.pp-mobile-mode body .pp-global-header .pp-global-mobile.open {
  display: grid !important;
  grid-template-columns: 1fr !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

html.pp-mobile-mode body .pp-global-header .pp-global-mobile a {
  display: block !important;
  min-height: 44px !important;
  padding: 13px 8px !important;
  font-size: 12px !important;
  line-height: 1.25 !important;
  touch-action: manipulation !important;
}

/* One fixed view selector and one cart control, with clear page space below. */
html.pp-mobile-mode .pp-v89-controls {
  display: none !important;
}

html.pp-mobile-mode [data-pp-v96-viewbar],
html.pp-mobile-mode [data-pp-suite-viewbar] {
  position: fixed !important;
  left: 50% !important;
  right: auto !important;
  bottom: calc(10px + env(safe-area-inset-bottom)) !important;
  transform: translateX(-50%) !important;
  width: min(calc(100% - 20px), 410px) !important;
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
  padding: 4px !important;
  border: 1px solid var(--pp-v2006-gold) !important;
  border-radius: 999px !important;
  background: rgba(6, 27, 52, .97) !important;
  z-index: 10060 !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .30) !important;
}

html.pp-mobile-mode [data-pp-v96-viewbar] button,
html.pp-mobile-mode [data-pp-suite-viewbar] button {
  flex: 1 1 0 !important;
  min-width: 0 !important;
  min-height: 42px !important;
  padding: 9px 6px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: #fff !important;
  font: 800 9px/1.15 Arial, sans-serif !important;
  letter-spacing: .07em !important;
  text-transform: uppercase !important;
  white-space: normal !important;
}

html.pp-mobile-mode [data-pp-v96-viewbar] button[aria-pressed="true"],
html.pp-mobile-mode [data-pp-suite-viewbar] button[aria-pressed="true"] {
  background: linear-gradient(135deg, #f6d77d, #c99427) !important;
  color: var(--pp-v2006-navy) !important;
  box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .58) !important;
}

html.pp-mobile-mode.pp-has-viewbar .pp-mobile-cart-toggle {
  bottom: calc(74px + env(safe-area-inset-bottom)) !important;
}

/* Shared one-column reading and shopping flow. */
html.pp-mobile-mode .page-main,
html.pp-mobile-mode main,
html.pp-mobile-mode section,
html.pp-mobile-mode footer {
  max-width: 100% !important;
}

html.pp-mobile-mode .product-grid,
html.pp-mobile-mode .editorial-grid,
html.pp-mobile-mode .world-grid,
html.pp-mobile-mode .collection-preview-grid,
html.pp-mobile-mode .detail-grid,
html.pp-mobile-mode .story-collage,
html.pp-mobile-mode .principles,
html.pp-mobile-mode .journey,
html.pp-mobile-mode .contact-wrap,
html.pp-mobile-mode .faq-grid,
html.pp-mobile-mode .footer-grid,
html.pp-mobile-mode .accessory-grid,
html.pp-mobile-mode .benefit-band,
html.pp-mobile-mode .member-grid,
html.pp-mobile-mode .product-page {
  grid-template-columns: minmax(0, 1fr) !important;
}

html.pp-mobile-mode .page-hero {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 0 !important;
}

html.pp-mobile-mode .page-hero-copy {
  padding: 44px 22px !important;
}

html.pp-mobile-mode body.contact-page .page-hero-copy h1 {
  max-width: 100% !important;
  font-size: 66px !important;
  line-height: .92 !important;
  letter-spacing: .035em !important;
  overflow-wrap: anywhere !important;
}

html.pp-mobile-mode .page-hero-media {
  width: 100% !important;
  min-height: 360px !important;
  border: 0 !important;
}

html.pp-mobile-mode .section,
html.pp-mobile-mode .noir-section {
  padding-left: 16px !important;
  padding-right: 16px !important;
}

html.pp-mobile-mode .field-grid {
  grid-template-columns: minmax(0, 1fr) !important;
}

html.pp-mobile-mode .field.full {
  grid-column: auto !important;
}

html.pp-mobile-mode .contact-card {
  min-width: 0 !important;
}

html.pp-mobile-mode .contact-card a {
  display: inline-block !important;
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
}

html.pp-mobile-mode .footer-grid {
  display: grid !important;
  gap: 26px !important;
}

html.pp-mobile-mode .footer-brand {
  grid-column: auto !important;
}

/* FAQ: the selected Mobile mode must reflow even when previewed on a laptop. */
html.pp-mobile-mode .faq-main {
  padding-bottom: 70px !important;
}

html.pp-mobile-mode .faq-hero {
  padding: 72px 22px 48px !important;
}

html.pp-mobile-mode .faq-hero h1 {
  max-width: 100% !important;
  font-size: 60px !important;
  line-height: .88 !important;
}

html.pp-mobile-mode .faq-intro {
  font-size: 21px !important;
}

html.pp-mobile-mode .faq-list {
  width: calc(100% - 32px) !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 14px !important;
}

html.pp-mobile-mode .faq-list summary {
  min-height: 0 !important;
  padding: 21px 50px 20px 38px !important;
  font-size: 22px !important;
}

html.pp-mobile-mode .faq-list summary::before {
  left: 14px !important;
  top: 23px !important;
  font-size: 21px !important;
}

html.pp-mobile-mode .faq-list summary::after {
  right: 18px !important;
  top: 18px !important;
  font-size: 30px !important;
}

html.pp-mobile-mode .faq-answer {
  padding: 0 22px 24px !important;
  font-size: 16px !important;
}

/* Suite: selectors remain real controls and become easy touch targets. */
html.pp-mobile-mode .suite-title {
  padding: 34px 18px 26px !important;
}

html.pp-mobile-mode .suite-title h1 {
  font-size: 46px !important;
}

html.pp-mobile-mode .fitter {
  display: block !important;
  width: 100% !important;
}

html.pp-mobile-mode .fitter .room {
  width: 100% !important;
  min-height: 560px !important;
  height: 72vh !important;
  max-height: 650px !important;
}

html.pp-mobile-mode .fitter .model {
  max-width: 84% !important;
}

html.pp-mobile-mode .fitter .panel {
  position: relative !important;
  top: auto !important;
  width: 100% !important;
  max-height: none !important;
  overflow: visible !important;
  padding: 26px 16px 42px !important;
  border-left: 0 !important;
}

html.pp-mobile-mode .fitter .grid4 {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  overflow: visible !important;
}

html.pp-mobile-mode .fitter .option {
  min-width: 0 !important;
  min-height: 48px !important;
  touch-action: manipulation !important;
}

html.pp-mobile-mode .fitter .option img {
  height: 150px !important;
  object-fit: contain !important;
  background: #edf1f2 !important;
}

html.pp-mobile-mode .fitter .colors .option img {
  height: 132px !important;
}

html.pp-mobile-mode .fitter .destinations {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 10px !important;
}

html.pp-mobile-mode .fitter .destinations .option {
  display: grid !important;
  grid-template-columns: 112px minmax(0, 1fr) !important;
  align-items: center !important;
  text-align: left !important;
}

html.pp-mobile-mode .fitter .destinations .option img {
  width: 112px !important;
  height: 76px !important;
  object-fit: cover !important;
}

html.pp-mobile-mode .fitter .sizes {
  display: flex !important;
  flex-wrap: wrap !important;
}

html.pp-mobile-mode .dest-panels {
  grid-template-columns: minmax(0, 1fr) !important;
}

html.pp-mobile-mode .dest-card {
  height: 245px !important;
}

html.pp-mobile-mode .pp-v2004-cabana-photo-crop {
  height: 53vw !important;
  min-height: 220px !important;
}

html.pp-mobile-mode .pp-v2004-cabana-panel {
  width: 100% !important;
  padding: 34px 22px 42px !important;
}

/* Cabana: one complete image at a time instead of squeezed strips. */
html.pp-mobile-mode body.cabana-page .v77-hero {
  height: 600px !important;
  min-height: 600px !important;
}

html.pp-mobile-mode body.cabana-page .v77-hero > img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: 58% 18% !important;
}

html.pp-mobile-mode body.cabana-page .v77-hero-copy {
  left: 22px !important;
  right: 18px !important;
  bottom: 30px !important;
}

html.pp-mobile-mode body.cabana-page .v77-colorworld,
html.pp-mobile-mode body.cabana-page .v77-colorworld.reverse {
  display: flex !important;
  flex-direction: column !important;
  min-height: 0 !important;
}

html.pp-mobile-mode body.cabana-page .v77-color-copy,
html.pp-mobile-mode body.cabana-page .v77-colorworld.reverse .v77-color-copy {
  order: 0 !important;
  width: 100% !important;
  padding: 38px 22px 30px !important;
}

html.pp-mobile-mode body.cabana-page .v77-color-copy h2 {
  font-size: 52px !important;
}

html.pp-mobile-mode body.cabana-page .v77-color-copy p {
  font-size: 18px !important;
  line-height: 1.52 !important;
}

html.pp-mobile-mode body.cabana-page .v77-model-grid,
html.pp-mobile-mode body.cabana-page .white-grid,
html.pp-mobile-mode body.cabana-page .navy-grid,
html.pp-mobile-mode body.cabana-page .coastal-grid,
html.pp-mobile-mode body.cabana-page .white-product-grid,
html.pp-mobile-mode body.cabana-page .navy-product-grid,
html.pp-mobile-mode body.cabana-page .coastal-product-grid {
  order: 1 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  width: 100% !important;
  height: auto !important;
  gap: 12px !important;
  padding: 12px !important;
  background: #071b34 !important;
}

html.pp-mobile-mode body.cabana-page .v77-model-grid figure {
  position: relative !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: 4 / 5 !important;
  margin: 0 !important;
  overflow: hidden !important;
  background: linear-gradient(180deg, #dbe7ef, #09233e) !important;
  border: 1px solid rgba(210, 165, 75, .42) !important;
}

html.pp-mobile-mode body.cabana-page .v77-model-grid figure img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  padding: 0 !important;
  transform: none !important;
  object-fit: contain !important;
  object-position: center !important;
  background: transparent !important;
}

html.pp-mobile-mode body.cabana-page .v77-model-grid figure::before,
html.pp-mobile-mode body.cabana-page .v77-look-grid figure::before {
  display: none !important;
}

html.pp-mobile-mode body.cabana-page .v77-lookbook {
  padding: 40px 14px 50px !important;
}

html.pp-mobile-mode body.cabana-page .v77-look-head {
  display: block !important;
  padding: 0 8px !important;
}

html.pp-mobile-mode body.cabana-page .v77-look-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 14px !important;
  height: auto !important;
}

html.pp-mobile-mode body.cabana-page .v77-look-grid figure {
  position: relative !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: 4 / 5 !important;
  margin: 0 !important;
  overflow: hidden !important;
  background: #0a2948 !important;
}

html.pp-mobile-mode body.cabana-page .v77-look-grid figure img,
html.pp-mobile-mode body.cabana-page .v77-look-grid figure:first-child img,
html.pp-mobile-mode body.cabana-page .v77-look-grid figure:last-child img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: contain !important;
  object-position: center !important;
}

html.pp-mobile-mode body.cabana-page .pp110-grid,
html.pp-mobile-mode body.cabana-page .v77-products {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
}

html.pp-mobile-mode body.cabana-page .pp110-option-row,
html.pp-mobile-mode body.cabana-page .pp110-actions {
  grid-template-columns: minmax(0, 1fr) !important;
}

/* Noir, Pride, next collections, and product pages. */
html.pp-mobile-mode .noir-products,
html.pp-mobile-mode .noir-essentials,
html.pp-mobile-mode .noir-360-grid,
html.pp-mobile-mode .noir-model-band,
html.pp-mobile-mode .noir-next-head,
html.pp-mobile-mode .noir-next-products,
html.pp-mobile-mode .split,
html.pp-mobile-mode .pride-pocket,
html.pp-mobile-mode .shop-card,
html.pp-mobile-mode .style-grid,
html.pp-mobile-mode .swatches {
  grid-template-columns: minmax(0, 1fr) !important;
}

html.pp-mobile-mode .split img {
  width: 100% !important;
  height: auto !important;
}

html.pp-mobile-mode .split > div {
  padding: 42px 22px !important;
}

html.pp-mobile-mode .pride-pocket {
  padding: 48px 14px !important;
  gap: 28px !important;
}

html.pp-mobile-mode .pride-pocket img {
  width: 100% !important;
  max-width: none !important;
}

html.pp-mobile-mode .swatches {
  display: grid !important;
  gap: 10px !important;
}

html.pp-mobile-mode .product-gallery .main-product {
  width: 100% !important;
  height: min(540px, 125vw) !important;
  object-fit: contain !important;
}

html.pp-mobile-mode .product-info,
html.pp-mobile-mode .product-gallery {
  min-width: 0 !important;
}

html.pp-mobile-mode .product-info .button,
html.pp-mobile-mode .product-info button[type="submit"] {
  min-height: 48px !important;
}

/* Legal and utility pages remain readable and do not sit under fixed controls. */
html.pp-mobile-mode .legal,
html.pp-mobile-mode .container {
  width: 100% !important;
  max-width: 100% !important;
}

html.pp-mobile-mode .legal {
  padding-left: 18px !important;
  padding-right: 18px !important;
}

@media (max-width: 390px) {
  html.pp-mobile-mode .pp-global-brand .pp-global-brand-lockup {
    max-width: 232px !important;
  }

  html.pp-mobile-mode .suite-title h1 {
    font-size: 42px !important;
  }

  html.pp-mobile-mode .fitter .grid4 {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}