/** Shopify CDN: Minification failed

Line 311:30 Unexpected "@app"
Line 1585:32 Unexpected "@app"

**/
/* Partify touch-up bottle PDP: premium editorial shell + bottle-only story. */.tubp-product,.tubp-story {  --tubp-ink: #0d0f12;  --tubp-muted: #60646b;  --tubp-line: #d8d8d4;  --tubp-paper: #f6f5f1;  --tubp-blue: #113a88;  --tubp-electric: #1677e9;  --tubp-wrap: min(1900px, calc(100vw - 80px));  color: var(--tubp-ink);  background: var(--tubp-paper);  font-family: inherit;}
/* The base theme adds a generic product-page gap. This template starts at the   black bottle benefits bar, like the tighter Ridge-style product layout. */.product--section.section--canonical:has(.tubp-product) {  margin-top: 0 !important;}
.tubp-product {  padding: 0 0 76px;}
.tubp-product__signal {  display: flex;  justify-content: center;  gap: 14px;  padding: 12px 24px;  color: #fff;  background: #070809;  font-size: 11px;  font-weight: 800;  letter-spacing: .08em;  text-align: center;  text-transform: uppercase;}
.tubp-product__shell {  width: var(--tubp-wrap);  max-width: none;  margin: 0 auto;  padding: 26px 0 0;}
.tubp-product .product--outer {  display: grid;  grid-template-columns: minmax(0, 1fr) minmax(440px, 520px);  gap: 14px;  align-items: start;  width: 100% !important;  max-width: none;  margin: 0 !important;  padding: 0 !important;}
.tubp-product .product-gallery {  position: relative;  top: auto;  width: 100% !important;  max-width: none !important;  margin: 0 !important;  padding: 0;  background: #e8e7e3;}
.tubp-product .product-gallery-fit-content {  position: relative;  top: auto;  padding: 0;}
.tubp-product .product-gallery--media,.tubp-product .product-gallery--media img {  min-height: 0;}
.tubp-product .product-gallery--media {  height: auto !important;  min-height: 0 !important;  padding-bottom: 0 !important;  aspect-ratio: 1 / 1 !important;  background: #e8e7e3;}
.tubp-product .product-gallery--media img {  position: relative !important;  inset: auto !important;  height: 100% !important;  object-fit: contain;  mix-blend-mode: multiply;}
/* The first gallery slide is deliberately composed for the desktop stage.   Keeping this as a 16:9 presentation prevents a small portrait packshot   from being enlarged across the entire product page. */.tubp-product .product-gallery--viewer {  overflow: hidden;  background: #e8e7e3;  box-shadow: 0 20px 50px rgba(13, 15, 18, .10);}
.tubp-product .product-gallery--media.tubp-gallery-hero,.tubp-product .product-gallery--media.tubp-gallery-hero .product-gallery--image-background {  position: relative;  width: 100%;  height: 100%;}
.tubp-product .product-gallery--media.tubp-gallery-hero img {  width: 100%;  height: 100% !important;  object-fit: contain;  mix-blend-mode: normal;}
.tubp-gallery-hero__caption {  position: absolute;  right: clamp(16px, 2vw, 30px);  bottom: clamp(16px, 2vw, 30px);  display: grid;  gap: 3px;  padding: 12px 14px;  color: #fff;  background: rgba(8, 10, 13, .90);  box-shadow: 0 10px 24px rgba(0, 0, 0, .18);  font-size: 10px;  font-weight: 800;  letter-spacing: .10em;  line-height: 1.2;  text-align: right;  text-transform: uppercase;}
.tubp-gallery-hero__caption strong {  color: #a8cfff;  font-size: 13px;  letter-spacing: -.015em;  text-transform: none;}
.tubp-product .product-gallery__top-actions {  z-index: 4;  top: 18px;  right: 18px;}
.tubp-product .product-main {  position: relative;  top: auto;  width: 100% !important;  max-width: none !important;  margin: 0 !important;  min-width: 0;  overflow: visible;  border: 0;  background: #fff;  box-shadow: 0 20px 50px rgba(13, 15, 18, .10);}
.tubp-product .product-details {  position: relative;  box-sizing: border-box;  width: 100% !important;  max-width: none !important;  padding: clamp(27px, 2.5vw, 38px);  background: linear-gradient(145deg, #fff 0%, #fbfcff 100%);}
.tubp-product .product-details::before {  position: absolute;  top: 0;  right: 0;  left: 0;  height: 5px;  content: '';  background: linear-gradient(90deg, var(--tubp-blue), #2488ff);}
.tubp-product .product-block {  margin-top: 16px;}
.tubp-product .product-block--first {  margin-top: 0;}
.tubp-product .product-block--title {  padding: 10px 0 20px;  border-bottom: 1px solid var(--tubp-line);}
.tubp-product .product-block--title::before {  display: block;  margin-bottom: 9px;  color: var(--tubp-blue);  content: 'Partify precision bottle system';  font-size: 10px;  font-weight: 850;  letter-spacing: .12em;  line-height: 1.2;  text-transform: uppercase;}
.tubp-product .product-title {  margin: 0;  color: var(--tubp-ink);  font-size: clamp(28px, 2.45vw, 42px);  font-weight: 750;  letter-spacing: -.055em;  line-height: .98;}
.tubp-product .product-pricing,.tubp-product .product-block--custom-liquid {  border-bottom: 1px solid var(--tubp-line);  padding-bottom: 18px;}
.tubp-product .product-block--custom-liquid {  padding-bottom: 0;  border-bottom: 0;}
.tubp-product .product-block:has(.tubp-free-shipping) {  margin-top: 14px;  padding: 13px 14px;  border: 1px solid #cde9d9;  background: #f4fcf7;}
.tubp-product .tubp-free-shipping {  margin: 0;  color: #16713c;  font-size: 13px;  font-weight: 750;}
.tubp-product .product-price,.tubp-product .price__current {  font-size: 24px;  font-weight: 750;  letter-spacing: -.035em;}
.tubp-product .product-form-wrapper,.tubp-product #product-form,.tubp-product #product-form-swatches {  border-radius: 0;}
.tubp-product .product-form-wrapper button,.tubp-product #add-to-cart,.tubp-product [data-product-atc] {  border-radius: 0 !important;  letter-spacing: .04em;  text-transform: uppercase;}
.tubp-product .touchup-button-step,.tubp-product .touchup-finish-guidance,.tubp-product .product-form-wrapper {  border-radius: 0;}
.tubp-product .touchup-button-row {  gap: 8px;}
.tubp-product .touchup-option-button {  border-radius: 0;}
.tubp-product .touchup-option-button.is-selected,.tubp-product .touchup-option-button:hover {  border-color: var(--tubp-ink);  background: var(--tubp-ink);  color: #fff;}
.tubp-wrap {  width: var(--tubp-wrap);  margin-right: auto;  margin-left: auto;}
.tubp-story {  overflow: hidden;  padding: 0 0 96px;}
.tubp-story__intro {  display: grid;  grid-template-columns: minmax(0, .78fr) minmax(280px, .62fr);  gap: clamp(32px, 8vw, 140px);  padding-top: clamp(74px, 10vw, 162px);  padding-bottom: clamp(54px, 8vw, 108px);}
.tubp-story__intro .tubp-kicker {  grid-column: 1 / -1;  margin-bottom: 0;}
.tubp-kicker {  margin: 0 0 15px;  color: var(--tubp-blue);  font-size: 11px;  font-weight: 800;  letter-spacing: .13em;  line-height: 1.2;  text-transform: uppercase;}
.tubp-story h2,.tubp-story h3,.tubp-story p {  color: inherit;}
.tubp-story h2,.tubp-story h3 {  margin-top: 0;  font-weight: 760;  letter-spacing: -.06em;  line-height: .94;}
.tubp-story h2 {  margin-bottom: 0;  font-size: clamp(44px, 5.7vw, 96px);}
.tubp-story h3 {  font-size: clamp(34px, 4.2vw, 66px);}
.tubp-lede {  align-self: end;  max-width: 470px;  margin: 0;  color: var(--tubp-muted) !important;  font-size: clamp(17px, 1.55vw, 22px);  line-height: 1.38;}
.tubp-feature {  display: grid;  grid-template-columns: minmax(0, .96fr) minmax(340px, .74fr);  gap: clamp(32px, 7vw, 120px);  align-items: center;  padding-bottom: clamp(88px, 13vw, 200px);}
.tubp-feature__media {  min-height: min(65vw, 860px);  overflow: hidden;  background: #eae7e0;}
.tubp-feature__media img,.tubp-system__card img,.tubp-step-card img {  display: block;  width: 100%;  height: 100%;  object-fit: cover;}
.tubp-feature__media--hero img {  object-position: 50% 55%;}
.tubp-feature__copy {  padding-right: clamp(0px, 3vw, 44px);}
.tubp-feature__copy > p:not(.tubp-kicker) {  max-width: 485px;  margin: 0 0 36px;  color: var(--tubp-muted);  font-size: 19px;  line-height: 1.45;}
.tubp-stat-list {  margin: 0 0 37px;  border-top: 1px solid var(--tubp-line);}
.tubp-stat-list > div {  display: grid;  grid-template-columns: 48px 1fr;  gap: 14px;  padding: 18px 0;  border-bottom: 1px solid var(--tubp-line);}
.tubp-stat-list dt {  color: var(--tubp-blue);  font-size: 13px;  font-weight: 800;}
.tubp-stat-list dd {  margin: 0;  color: var(--tubp-muted);  font-size: 15px;  line-height: 1.35;}
.tubp-stat-list strong {  color: var(--tubp-ink);}
.tubp-button {  display: inline-flex;  align-items: center;  gap: 28px;  min-height: 52px;  padding: 0 20px;  border: 1px solid var(--tubp-ink);  border-radius: 0;  color: #fff;  background: var(--tubp-ink);  cursor: pointer;  font: inherit;  font-size: 12px;  font-weight: 800;  letter-spacing: .08em;  text-transform: uppercase;  transition: background .2s ease, color .2s ease;}
.tubp-button:hover,.tubp-button:focus-visible {  color: var(--tubp-ink);  background: #fff;}
.tubp-button span {  font-size: 19px;  line-height: 1;}
.tubp-system {  padding: clamp(78px, 10vw, 156px) 0;  color: #fff;  background: #0b0c0e;}
.tubp-system__head {  display: grid;  grid-template-columns: minmax(0, .78fr) minmax(260px, .52fr);  gap: 32px;  margin-bottom: 54px;}
.tubp-system .tubp-kicker {  grid-column: 1 / -1;  color: #77a7f8;}
.tubp-system h2 {  grid-column: 1 / 2;  max-width: 820px;  font-size: clamp(42px, 5.4vw, 88px);}
.tubp-system__grid {  display: grid;  grid-template-columns: minmax(0, 1.55fr) minmax(310px, .75fr);  gap: 12px;}
.tubp-system__card {  position: relative;  min-height: 570px;  overflow: hidden;  background: #202226;}
.tubp-system__card--precision {  min-height: 570px;}
.tubp-system__card--precision img {  object-position: 65% 53%;}
.tubp-system__card::after,.tubp-step-card::after {  position: absolute;  right: 0;  bottom: 0;  left: 0;  height: 58%;  content: '';  background: linear-gradient(transparent, rgba(0, 0, 0, .82));  pointer-events: none;}
.tubp-system__caption {  position: absolute;  z-index: 1;  right: 28px;  bottom: 28px;  left: 28px;  max-width: 440px;}
.tubp-system__caption span,.tubp-step-card span {  display: inline-block;  margin-bottom: 10px;  color: #90baff;  font-size: 12px;  font-weight: 800;  letter-spacing: .1em;}
.tubp-system__caption h3 {  margin-bottom: 10px;  font-size: clamp(30px, 3.1vw, 50px);}
.tubp-system__caption p {  max-width: 380px;  margin: 0;  color: #dddfe5;  font-size: 15px;  line-height: 1.35;}
.tubp-steps {  padding-top: clamp(82px, 12vw, 180px);}
.tubp-steps__head {  display: grid;  grid-template-columns: minmax(0, .92fr) minmax(280px, .55fr);  gap: 30px;  margin-bottom: 50px;}
.tubp-steps__head .tubp-kicker {  grid-column: 1 / -1;}
.tubp-steps__head h2 {  grid-column: 1 / 2;  max-width: 930px;  font-size: clamp(42px, 5.5vw, 88px);}
.tubp-steps__grid {  display: grid;  grid-template-columns: repeat(3, minmax(0, 1fr));  gap: 12px;}
.tubp-step-card {  position: relative;  min-height: clamp(450px, 45vw, 680px);  overflow: hidden;  color: #fff;  background: #101215;}
.tubp-step-card img {  position: absolute;  inset: 0;}
.tubp-step-card:nth-child(2) img {  object-position: 62% center;}
.tubp-step-card > div {  position: absolute;  z-index: 1;  right: 24px;  bottom: 24px;  left: 24px;}
.tubp-step-card h3 {  margin-bottom: 8px;  font-size: clamp(27px, 2.25vw, 38px);}
.tubp-step-card p {  margin: 0;  color: #e5e6e8;  font-size: 14px;  line-height: 1.38;}
.tubp-answers {  margin-top: 128px;  padding: 128px 0 160px;  background: #eceae5;}
.tubp-answers__grid {  display: grid;  grid-template-columns: minmax(0, 5fr) minmax(520px, 7fr);  gap: 96px;  align-items: start;}
.tubp-answers__intro {  max-width: 560px;}
.tubp-answers h2 {  max-width: 650px;  margin-bottom: 24px;  font-size: clamp(48px, 4.7vw, 76px);}
.tubp-answers__intro > p:last-of-type {  max-width: 500px;  margin: 0;  color: var(--tubp-muted);  font-size: 18px;  line-height: 1.6;}
.tubp-answers__help {  display: inline-flex;  align-items: center;  gap: 16px;  margin-top: 32px;  padding-bottom: 4px;  border-bottom: 1px solid currentColor;  color: var(--tubp-ink);  font-size: 13px;  font-weight: 800;  letter-spacing: .04em;  line-height: 1.4;  text-decoration: none;  text-transform: uppercase;  transition: color 180ms ease-out;}
.tubp-answers__help:hover {  color: var(--tubp-electric);}
.tubp-answers__help:focus-visible {  outline: 2px solid var(--tubp-electric);  outline-offset: 6px;}
.tubp-answers__content {  display: grid;  gap: 48px;  min-width: 0;}
.tubp-answers__group h3 {  margin: 0 0 12px;  color: var(--tubp-blue);  font-size: 13px;  font-weight: 850;  letter-spacing: .08em;  line-height: 1.4;  text-transform: uppercase;}
.tubp-answers__list {  border-bottom: 1px solid #bfc0bd;}
.tubp-answers details {  border-top: 1px solid #bfc0bd;}
.tubp-answers summary {  display: flex;  min-height: 64px;  align-items: center;  justify-content: space-between;  gap: 24px;  padding: 16px 0;  cursor: pointer;  font-size: 18px;  font-weight: 750;  line-height: 1.35;  list-style: none;}
.tubp-answers summary::-webkit-details-marker {  display: none;}
.tubp-answers summary::after {  flex: 0 0 auto;  content: '+';  font-size: 24px;  font-weight: 400;  line-height: 1;}
.tubp-answers details[open] summary::after {  content: '−';}
.tubp-answers summary:focus-visible {  outline: 2px solid var(--tubp-electric);  outline-offset: 6px;}
.tubp-answers details p {  max-width: 68ch;  margin: 0;  padding: 0 64px 24px 0;  color: var(--tubp-muted);  font-size: 16px;  line-height: 1.6;}
.tubp-answers details p strong {  color: var(--tubp-ink);  font-weight: 750;}
@media (max-width: 960px) {  .tubp-product .product--outer {    grid-template-columns: minmax(0, 1fr) minmax(360px, 430px);  }
  .tubp-product .product-gallery--media,  .tubp-product .product-gallery--media img {    min-height: 0;  }
  .tubp-feature,  .tubp-story__intro,  .tubp-system__head,  .tubp-steps__head {    grid-template-columns: 1fr;  }
  .tubp-story__intro .tubp-kicker,  .tubp-system .tubp-kicker,  .tubp-steps__head .tubp-kicker,  .tubp-system h2,  .tubp-steps__head h2 {    grid-column: auto;  }
  .tubp-feature__media {    min-height: 680px;  }
  .tubp-system__grid {    grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr);  }
}
@media (max-width: 720px) {  .tubp-product,  .tubp-story {    --tubp-wrap: min(100% - 28px, 2400px);  }
  .tubp-product {    padding-bottom: 38px;  }
  .tubp-product__signal {    gap: 7px;    padding: 10px 12px;    font-size: 9px;    letter-spacing: .05em;  }
  .tubp-product__shell {    padding-top: 14px;  }
  .tubp-product .product--outer {    display: block;  }
  .tubp-product .product-gallery {    position: relative;    top: auto;    margin-bottom: 12px;  }
  .tubp-product .product-gallery--media,  .tubp-product .product-gallery--media img {    min-height: 100vw;  }
  .tubp-product .product-gallery--media {    height: 100vw !important;    padding-bottom: 0 !important;    aspect-ratio: 1 / 1 !important;  }
  .tubp-product .product-gallery--media.tubp-gallery-hero,  .tubp-product .product-gallery--media.tubp-gallery-hero img {    min-height: 0;  }
  .tubp-product .product-gallery--media.tubp-gallery-hero {    height: auto !important;    aspect-ratio: 1 / 1 !important;  }
  .tubp-gallery-hero__caption {    right: 14px;    bottom: 14px;    padding: 9px 10px;    font-size: 8px;  }
  .tubp-gallery-hero__caption strong {    font-size: 11px;  }
  .tubp-product .product-details {    padding: 21px 18px;  }
  .tubp-product .product-title {    font-size: 30px;  }
  .tubp-story {    padding-bottom: 46px;  }
  .tubp-story__intro {    gap: 23px;    padding-top: 72px;    padding-bottom: 66px;  }
  .tubp-story h2 {    font-size: clamp(39px, 12.6vw, 58px);  }
  .tubp-story h3 {    font-size: 39px;  }
  .tubp-feature {    gap: 35px;    padding-bottom: 84px;  }
  .tubp-feature__media {    min-height: 124vw;  }
  .tubp-feature__copy {    padding-right: 0;  }
  .tubp-feature__copy > p:not(.tubp-kicker) {    margin-bottom: 27px;    font-size: 17px;  }
  .tubp-system {    padding: 76px 0;  }
  .tubp-system__head,  .tubp-steps__head {    margin-bottom: 32px;  }
  .tubp-system__grid,  .tubp-steps__grid {    grid-template-columns: 1fr;  }
  .tubp-system__card,  .tubp-system__card--precision,  .tubp-step-card {    min-height: 125vw;  }
  .tubp-system__card--kit {    min-height: 94vw;  }
  .tubp-system__caption,  .tubp-step-card > div {    right: 19px;    bottom: 19px;    left: 19px;  }
  .tubp-steps {    padding-top: 83px;  }
  .tubp-answers {    margin-top: 64px;    padding: 80px 0;  }
  .tubp-answers h2 {    margin-bottom: 19px;  }
  .tubp-answers__grid {    gap: 64px;  }
  .tubp-answers__intro {    max-width: 680px;  }
  .tubp-answers__content {    gap: 48px;  }
  .tubp-answers summary {    min-height: 64px;    font-size: 16px;  }
  .tubp-answers details p {    padding-right: 24px;  }
}
@media (max-width: 1080px) {  .tubp-answers__grid {    grid-template-columns: 1fr;    gap: 64px;  }
}
@media (min-width: 721px) and (max-width: 1080px) {  .tubp-answers {    margin-top: 64px;    padding: 80px 0;  }
  .tubp-answers__intro {    max-width: 680px;  }
  .tubp-answers__content {    gap: 48px;  }
  .tubp-answers details p {    padding-right: 32px;  }
}
/* Bottle PDP configuration path, package guide, and application content. */.tubp-product .tubp-configure {  padding: 22px;  border: 1px solid #c8d7f0;  background: linear-gradient(145deg, #f7faff 0%, #edf4ff 100%);  box-shadow: inset 4px 0 0 var(--tubp-blue);}
.tubp-product .tubp-configure__eyebrow {  margin: 0 0 5px;  color: var(--tubp-blue);  font-size: 10px;  font-weight: 800;  letter-spacing: .09em;  text-transform: uppercase;}
.tubp-product .tubp-configure h3 {  margin: 0 0 17px;  color: var(--tubp-ink);  font-size: 19px;  font-weight: 760;  letter-spacing: -.025em;  line-height: 1.12;}
.tubp-product .tubp-configure ol {  display: grid;  gap: 10px;  margin: 0 0 16px;  padding: 0;  list-style: none;}
.tubp-product .tubp-configure li {  display: grid;  grid-template-columns: 23px 1fr;  gap: 9px;  align-items: start;}
.tubp-product .tubp-configure li > span {  display: grid;  width: 23px;  height: 23px;  place-items: center;  border-radius: 50%;  color: #fff;  background: var(--tubp-blue);  font-size: 10px;  font-weight: 800;}
.tubp-product .tubp-configure strong,.tubp-product .tubp-configure small {  display: block;}
.tubp-product .tubp-configure strong {  margin-bottom: 1px;  font-size: 13px;  line-height: 1.2;}
.tubp-product .tubp-configure small {  color: var(--tubp-muted);  font-size: 11px;  line-height: 1.3;}
.tubp-product .tubp-configure__button {  display: flex;  width: 100%;  align-items: center;  justify-content: center;  gap: 8px;  min-height: 52px;  border: 0;  color: #fff;  background: var(--tubp-ink);  cursor: pointer;  font: inherit;  font-size: 13px;  font-weight: 800;  text-align: center;  transition: background .16s ease, transform .16s ease;}
.tubp-product .tubp-configure__button:hover,.tubp-product .tubp-configure__button:focus-visible {  background: var(--tubp-blue);  transform: translateY(-1px);}
/* The configuration card is the primary bottle-PDP launcher. The legacy   touch-up launcher stays in the DOM for the shared flow, but its duplicate   button is hidden on this template. */.tubp-product .tuf-inline-launcher [data-tuf-open] {  display: none !important;}
.tubp-button--dark {  color: #fff;  background: var(--tubp-ink);}
.tubp-button--dark:hover,.tubp-button--dark:focus-visible {  color: #fff;  background: var(--tubp-blue);}
.tubp-match {  display: grid;  grid-template-columns: minmax(0, .9fr) minmax(360px, 1fr);  gap: 48px 76px;  align-items: end;  padding: clamp(76px, 10vw, 150px) 0;}
.tubp-match h2,.tubp-packages h2,.tubp-application h2 {  max-width: 900px;  font-size: clamp(40px, 4.5vw, 74px);  line-height: .98;}
.tubp-match__copy > p:not(.tubp-kicker) {  max-width: 600px;  margin: 24px 0 0;  color: var(--tubp-muted);  font-size: 17px;  line-height: 1.48;}
.tubp-match__copy .tubp-button {  margin-top: 32px;}
.tubp-packages {  padding: clamp(76px, 9vw, 142px) 0;  background: #e9edf3;}
.tubp-packages__head {  display: flex;  justify-content: space-between;  gap: 40px;  align-items: end;  margin-bottom: 42px;}
.tubp-packages__head > p {  max-width: 420px;  margin: 0 0 6px;  color: var(--tubp-muted);  font-size: 16px;  line-height: 1.45;}
.tubp-packages__grid {  display: grid;  grid-template-columns: repeat(3, minmax(0, 1fr));  gap: 14px;}
.tubp-package-card {  display: flex;  min-height: 315px;  flex-direction: column;  padding: clamp(24px, 2.2vw, 36px);  border: 1px solid #c6cbd3;  background: #fff;}
.tubp-package-card--featured {  border-color: var(--tubp-blue);  box-shadow: 0 14px 30px rgba(17, 58, 136, .14);}
.tubp-package-card__eyebrow {  display: flex;  align-items: center;  justify-content: space-between;  gap: 8px;  margin: 0 0 24px;  color: var(--tubp-blue) !important;  font-size: 12px;  font-weight: 850;  letter-spacing: .06em;  text-transform: uppercase;}
.tubp-package-card__eyebrow span {  padding: 5px 7px;  color: #fff;  background: var(--tubp-blue);  font-size: 9px;  letter-spacing: .04em;}
.tubp-package-card h3 {  margin-bottom: 14px;  font-size: clamp(27px, 2.4vw, 42px);  line-height: 1;}
.tubp-package-card > p:not(.tubp-package-card__eyebrow) {  margin: 0;  color: var(--tubp-muted) !important;  font-size: 15px;  line-height: 1.42;}
.tubp-package-card ul {  display: grid;  gap: 7px;  margin: auto 0 0;  padding: 20px 0 0;  border-top: 1px solid var(--tubp-line);  list-style: none;}
.tubp-package-card li {  font-size: 13px;  font-weight: 700;  line-height: 1.3;}
.tubp-package-card li::before {  content: '✓';  margin-right: 8px;  color: var(--tubp-blue);}
.tubp-packages__note {  margin: 19px 0 0;  color: var(--tubp-muted);  font-size: 12px;}
.tubp-application {  padding-top: clamp(86px, 11vw, 170px);}
.tubp-application__head {  display: grid;  grid-template-columns: minmax(0, 1fr) minmax(340px, .66fr);  gap: 44px;  align-items: end;  margin-bottom: 42px;}
.tubp-application__head dl {  display: grid;  grid-template-columns: repeat(2, minmax(0, 1fr));  gap: 18px;  margin: 0;}
.tubp-application__head dl div {  padding: 16px 0 0;  border-top: 1px solid var(--tubp-line);}
.tubp-application__head dt {  margin-bottom: 7px;  color: var(--tubp-blue);  font-size: 10px;  font-weight: 850;  letter-spacing: .08em;  text-transform: uppercase;}
.tubp-application__head dd {  margin: 0;  font-size: 14px;  font-weight: 700;  line-height: 1.35;}
.tubp-application__content {  display: grid;  grid-template-columns: minmax(0, 1.08fr) minmax(380px, .92fr);  background: #fff;}
.tubp-application__content > img {  width: 100%;  height: 100%;  min-height: 640px;  object-fit: cover;}
.tubp-application__steps {  display: grid;  margin: 0;  padding: 0 clamp(25px, 3vw, 48px);  list-style: none;}
.tubp-application__steps li {  display: grid;  grid-template-columns: 42px 1fr;  gap: 13px;  align-items: start;  padding: 22px 0;  border-bottom: 1px solid var(--tubp-line);}
.tubp-application__steps li:last-child {  border-bottom: 0;}
.tubp-application__steps span {  display: grid;  width: 30px;  height: 30px;  place-items: center;  border: 1px solid #b8c6dd;  border-radius: 50%;  color: var(--tubp-blue);  font-size: 12px;  font-weight: 800;}
.tubp-application__steps h3 {  margin: 0 0 5px;  font-size: 18px;  letter-spacing: -.025em;  line-height: 1.12;}
.tubp-application__steps p {  margin: 0;  color: var(--tubp-muted) !important;  font-size: 13px;  line-height: 1.43;}
.tubp-planner {  padding-top: 44px;}
.tubp-planner__card {  display: flex;  align-items: end;  justify-content: space-between;  gap: 34px;  padding: clamp(28px, 4vw, 58px);  color: #fff;  background: var(--tubp-blue);}
.tubp-planner__card .tubp-kicker {  color: #9ec6ff;}
.tubp-planner__card h2 {  max-width: 770px;  margin-bottom: 14px;  font-size: clamp(32px, 3.6vw, 58px);}
.tubp-planner__card p:not(.tubp-kicker) {  max-width: 640px;  margin: 0;  color: #e2ebff !important;  font-size: 16px;  line-height: 1.45;}
.tubp-planner__card .tubp-button {  flex: 0 0 auto;  color: var(--tubp-ink);  background: #fff;}
.tubp-planner__card .tubp-button:hover,.tubp-planner__card .tubp-button:focus-visible {  color: #fff;  background: var(--tubp-ink);}
@media (max-width: 960px) {  .tubp-match,  .tubp-application__head,  .tubp-application__content {    grid-template-columns: 1fr;  }
  .tubp-application__content > img {    min-height: min(92vw, 650px);  }
}
@media (max-width: 720px) {  .tubp-product .tubp-configure {    padding: 16px;  }
  .tubp-match {    gap: 30px;    padding: 76px 0;  }
  .tubp-match h2,  .tubp-packages h2,  .tubp-application h2 {    font-size: clamp(37px, 11.8vw, 55px);  }
  .tubp-packages {    padding: 75px 0;  }
  .tubp-packages__head {    display: block;    margin-bottom: 28px;  }
  .tubp-packages__head > p {    margin-top: 18px;  }
  .tubp-packages__grid {    grid-template-columns: 1fr;  }
  .tubp-package-card {    min-height: 0;  }
  .tubp-application {    padding-top: 82px;  }
  .tubp-application__head {    gap: 25px;    margin-bottom: 28px;  }
  .tubp-application__head dl {    gap: 12px;  }
  .tubp-application__content > img {    min-height: 85vw;  }
  .tubp-application__steps {    padding: 0 19px;  }
  .tubp-application__steps li {    padding: 18px 0;  }
  .tubp-planner__card {    display: block;  }
  .tubp-planner__card .tubp-button {    margin-top: 25px;  }
}

/* Bottle PDP hero + inline purchase system. */
.tubp-product {
  --tubp-ink: #0B1220;
  --tubp-paper: #F7F5F0;
  --tubp-blue: #10224E;
  --tubp-electric: #2B6CF6;
  --tubp-muted: #6B7280;
  --tubp-line: #E5E7EB;
  --tubp-wrap: min(1280px, calc(100vw - 160px));
  background: var(--tubp-paper);
  color: var(--tubp-ink);
  font-family: Inter, "Instrument Sans", Arial, sans-serif;
}

.tubp-product__shell {
  padding-top: 32px;
}

.tubp-product .product--outer {
  grid-template-columns: minmax(0, 7fr) minmax(420px, 5fr);
  gap: 32px;
}

.tubp-product .product-gallery,
.tubp-product .product-main {
  top: 32px;
}

.tubp-product .product-gallery--viewer {
  box-shadow: none;
}

.tubp-product .product-main {
  max-height: none;
  overflow: visible;
  border: 1px solid var(--tubp-line);
  border-radius: 16px;
  background: #FFFFFF;
  box-shadow: none;
}

.tubp-product .product-details {
  padding: 48px;
  background: #FFFFFF;
}

.tubp-product .product-details::before {
  display: none;
}

.tubp-product .product-block {
  margin-top: 24px;
}

.tubp-product .product-block--title {
  padding: 0 0 24px;
}

.tubp-product .product-block--title::before {
  margin-bottom: 12px;
  color: var(--tubp-muted);
  content: 'Vehicle-matched touch-up paint';
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .08em;
  line-height: 1.4;
}

.tubp-product .product-title {
  max-width: 16ch;
  font-size: 56px !important;
  font-weight: 700;
  letter-spacing: -.01em;
  line-height: 1.05;
}

.tubp-product .product-block--@app {
  margin-top: 16px;
}

.tubp-product .product-price,
.tubp-product .price__current {
  font-size: 24px;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.2;
}

.tubp-product .product-block:has(.tubp-free-shipping) {
  margin-top: 16px;
  padding: 0;
  border: 0;
  background: transparent;
}

.tubp-product .tubp-free-shipping {
  color: var(--tubp-muted);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
}

.tubp-product .product-block:has(.tubp-legacy-product-controls) {
  display: none;
}

.tubp-inline-configurator {
  margin-top: 32px;
  border-top: 1px solid var(--tubp-line);
  padding-top: 32px;
}

.tubp-inline-configurator__intro {
  max-width: 42ch;
}

.tubp-inline-configurator__eyebrow,
.tubp-inline-configurator__selection-label {
  display: block;
  margin: 0 0 8px;
  color: var(--tubp-muted);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .08em;
  line-height: 1.4;
  text-transform: uppercase;
}

.tubp-inline-configurator__intro h2 {
  max-width: 16ch;
  margin: 0;
  color: var(--tubp-ink);
  font-size: 24px;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.2;
}

.tubp-inline-configurator__intro p:not(.tubp-inline-configurator__eyebrow) {
  max-width: 52ch;
  margin: 12px 0 0;
  color: var(--tubp-muted);
  font-size: 16px;
  line-height: 1.6;
}

.tubp-inline-configurator__content {
  margin-top: 32px;
}

.tubp-inline-configurator__loading,
.tubp-inline-configurator__empty {
  margin: 0;
  color: var(--tubp-muted);
  font-size: 16px;
  line-height: 1.6;
}

.tubp-inline-configurator__step {
  padding: 32px 0;
  border-top: 1px solid var(--tubp-line);
}

.tubp-inline-configurator__step:first-child {
  padding-top: 0;
  border-top: 0;
}

.tubp-inline-configurator__step.is-disabled {
  opacity: .45;
}

.tubp-inline-configurator__step-heading {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  gap: 16px;
}

.tubp-inline-configurator__step-heading > span {
  padding-top: 2px;
  color: var(--tubp-muted);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.4;
}

.tubp-inline-configurator__step-heading h3 {
  margin: 0;
  color: var(--tubp-ink);
  font-size: 24px;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.2;
}

.tubp-inline-configurator__step-heading p {
  max-width: 44ch;
  margin: 8px 0 0;
  color: var(--tubp-muted);
  font-size: 16px;
  line-height: 1.6;
}

.tubp-inline-configurator__methods {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 24px;
}

.tubp-tone-choice {
  margin: 24px 0 0;
  padding: 0;
  border: 0;
}

.tubp-tone-choice legend {
  margin-bottom: 8px;
  color: var(--tubp-ink);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.4;
}

.tubp-tone-choice__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.tubp-tone-option {
  min-height: 76px;
  padding: 12px;
  border: 1px solid var(--tubp-line);
  border-radius: 16px;
  color: var(--tubp-ink);
  background: #FFFFFF;
  cursor: pointer;
  font: inherit;
  text-align: left;
}

.tubp-tone-option strong,
.tubp-tone-option span {
  display: block;
}

.tubp-tone-option strong {
  font-size: 13px;
  line-height: 1.4;
}

.tubp-tone-option span {
  margin-top: 4px;
  color: var(--tubp-muted);
  font-size: 12px;
  line-height: 1.4;
}

.tubp-tone-option:hover,
.tubp-tone-option:focus-visible,
.tubp-tone-option.is-selected {
  border-color: var(--tubp-ink);
  outline: none;
}

.tubp-tone-option.is-selected {
  background: var(--tubp-paper);
}

.tubp-match-method,
.tubp-package-choice,
.tubp-inline-configurator__atc {
  font: inherit;
}

.tubp-match-method {
  min-height: 80px;
  padding: 12px;
  border: 1px solid var(--tubp-line);
  border-radius: 16px;
  color: var(--tubp-ink);
  background: #FFFFFF;
  cursor: pointer;
  text-align: left;
  transition: border-color 180ms ease-out, background-color 180ms ease-out;
}

.tubp-match-method strong,
.tubp-match-method span {
  display: block;
}

.tubp-match-method strong {
  font-size: 13px;
  font-weight: 700;
  line-height: 1.4;
}

.tubp-match-method span {
  margin-top: 4px;
  color: var(--tubp-muted);
  font-size: 13px;
  line-height: 1.4;
}

.tubp-match-method:hover,
.tubp-match-method:focus-visible,
.tubp-match-method.is-selected {
  border-color: var(--tubp-ink);
  outline: none;
}

.tubp-match-method.is-selected {
  background: var(--tubp-paper);
}

.tubp-match-method:disabled {
  cursor: not-allowed;
  opacity: .45;
}

.tubp-inline-configurator__field-row {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(120px, 1fr);
  gap: 16px;
  margin-top: 24px;
}

.tubp-inline-configurator__field {
  display: block;
  margin-top: 24px;
}

.tubp-inline-configurator__field-row .tubp-inline-configurator__field {
  margin-top: 0;
}

.tubp-inline-configurator__field span {
  display: block;
  margin-bottom: 8px;
  color: var(--tubp-ink);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.4;
}

.tubp-inline-configurator__field input,
.tubp-inline-configurator__field select {
  box-sizing: border-box;
  width: 100%;
  min-height: 52px;
  padding: 12px 16px;
  border: 1px solid var(--tubp-line);
  border-radius: 16px;
  color: var(--tubp-ink);
  background: #FFFFFF;
  font: inherit;
  font-size: 16px;
  line-height: 1.6;
}

.tubp-inline-configurator__field input:focus,
.tubp-inline-configurator__field select:focus {
  border-color: var(--tubp-electric);
  outline: 2px solid var(--tubp-electric);
  outline-offset: 2px;
}

.tubp-inline-configurator__helper,
.tubp-inline-configurator__vehicle {
  max-width: 52ch;
  margin: 12px 0 0;
  color: var(--tubp-muted);
  font-size: 13px;
  line-height: 1.4;
}

.tubp-inline-configurator__vehicle strong {
  color: var(--tubp-ink);
}

.tubp-inline-configurator__vin-result {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 10px;
  margin: 0;
  padding: 10px 12px;
  border-radius: 8px;
  background: #eaf7ef;
  color: #12683a;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.35;
}

.tubp-inline-configurator__packages {
  display: grid;
  gap: 12px;
  margin-top: 24px;
}

.tubp-package-choice {
  width: 100%;
  padding: 16px;
  border: 1px solid var(--tubp-line);
  border-radius: 16px;
  color: var(--tubp-ink);
  background: #FFFFFF;
  cursor: pointer;
  text-align: left;
  transition: border-color 180ms ease-out, background-color 180ms ease-out;
}

.tubp-package-choice:hover,
.tubp-package-choice:focus-visible,
.tubp-package-choice.is-selected {
  border-color: var(--tubp-ink);
  outline: none;
}

  .tubp-package-choice.is-selected {
    background: var(--tubp-paper);
  }

  .tubp-package-choice:disabled {
    cursor: not-allowed;
    opacity: .55;
  }

.tubp-package-choice__topline,
.tubp-package-choice__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.tubp-package-choice__topline > span:first-child {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.6;
}

.tubp-package-choice__recommendation {
  color: var(--tubp-electric);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.4;
}

.tubp-package-choice__description,
.tubp-package-choice__includes,
.tubp-package-choice__footer {
  display: block;
  margin-top: 8px;
}

.tubp-package-choice__description {
  max-width: 50ch;
  color: var(--tubp-muted);
  font-size: 16px;
  line-height: 1.6;
}

.tubp-package-choice__includes {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  color: var(--tubp-ink);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
}

.tubp-package-choice__includes span::before {
  content: '\2713';
  margin-right: 4px;
  color: var(--tubp-electric);
}

.tubp-package-choice__footer {
  display: flex;
  color: var(--tubp-muted);
  font-size: 13px;
  line-height: 1.4;
}

.tubp-package-choice__footer strong {
  color: var(--tubp-ink);
  font-size: 16px;
  line-height: 1.6;
}

.tubp-inline-configurator__cta-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  padding: 24px 0 0;
}

.tubp-inline-configurator__cta-row > div > strong {
  display: block;
  max-width: 24ch;
  color: var(--tubp-ink);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.4;
}

.tubp-inline-configurator__atc {
  min-height: 52px;
  padding: 0 24px;
  border: 1px solid var(--tubp-electric);
  border-radius: 24px;
  color: #FFFFFF;
  background: var(--tubp-electric);
  cursor: pointer;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.4;
  transition: background-color 180ms ease-out, border-color 180ms ease-out;
}

.tubp-inline-configurator__atc:hover,
.tubp-inline-configurator__atc:focus-visible {
  border-color: var(--tubp-blue);
  background: var(--tubp-blue);
  outline: none;
}

.tubp-inline-configurator__atc:focus-visible {
  outline: 2px solid var(--tubp-electric);
  outline-offset: 2px;
}

.tubp-inline-configurator__atc:disabled {
  border-color: var(--tubp-line);
  color: var(--tubp-muted);
  background: #FFFFFF;
  cursor: not-allowed;
}

.tubp-product .product-block--touch-up-specialist,
.tubp-product .product-block:has(.tup-specialist) {
  margin-top: 32px;
  padding-top: 24px;
  border-top: 1px solid var(--tubp-line);
}

.tubp-product .product-block--touch-up-specialist .tup-specialist {
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

@media (max-width: 960px) {
  .tubp-product {
    --tubp-wrap: min(100% - 48px, 1280px);
  }

  .tubp-product .product--outer {
    display: block;
  }

  .tubp-product .product-details {
    padding: 32px;
  }

  .tubp-product .product-title {
    font-size: 40px !important;
  }

  .tubp-inline-configurator__cta-row {
    grid-template-columns: 1fr;
  }

  .tubp-inline-configurator__atc {
    width: 100%;
  }
}

@media (max-width: 1080px) {
  .tubp-product .product--outer {
    display: block;
  }

  .tubp-product .product-gallery {
    position: relative;
    top: auto;
    margin-bottom: 24px;
  }

  .tubp-product .product-main {
    position: relative;
    top: auto;
  }
}

/* Interactive bottle gallery controls and Ridge-style package selectors. */
.tubp-gallery-carousel .product-gallery--media {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transition: opacity 180ms ease-out;
}

.tubp-gallery-carousel .product-gallery--media[data-gallery-selected="true"] {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}

.tubp-gallery-carousel .product-gallery--image-background,
.tubp-gallery-carousel .product-gallery--loaded-image,
.tubp-gallery-carousel video {
  width: 100%;
  height: 100%;
}

.tubp-gallery-carousel .product-gallery--loaded-image,
.tubp-gallery-carousel video {
  display: block;
  object-fit: contain;
  object-position: 50% 50%;
}

/* Every gallery still is authored from the same square 4K master. A shared
   focal point keeps both the primary stage and the narrow next-media pane
   visually stable instead of changing scale/aspect ratio between slides. */
.tubp-gallery-carousel .product-gallery--media[data-media-type="image"] {
  background: #F7F5F0;
}

.tubp-gallery-carousel video {
  background: #0B0C0E;
}

.tubp-gallery-controls {
  position: absolute;
  z-index: 8;
  bottom: 16px;
  left: 16px;
  display: grid;
  grid-template-columns: 48px auto 48px;
  align-items: center;
  overflow: hidden;
  border: 1px solid rgba(11, 18, 32, .16);
  background: #FFFFFF;
}

.tubp-gallery-controls button,
.tubp-gallery-controls span {
  display: grid;
  min-height: 48px;
  place-items: center;
}

.tubp-gallery-controls button {
  width: 48px;
  padding: 0;
  border: 0;
  color: #0B1220;
  background: #FFFFFF;
  cursor: pointer;
  font: inherit;
  font-size: 18px;
  transition: color 180ms ease-out, background-color 180ms ease-out;
}

.tubp-gallery-controls button:hover {
  color: #FFFFFF;
  background: #0B1220;
}

.tubp-gallery-controls button:focus-visible {
  position: relative;
  z-index: 1;
  outline: 2px solid #2B6CF6;
  outline-offset: -3px;
}

.tubp-gallery-controls span {
  min-width: 64px;
  padding: 0 12px;
  border-inline: 1px solid #E5E7EB;
  color: #0B1220;
  font-size: 13px;
  font-weight: 700;
}

.tubp-inline-configurator__garage {
  box-sizing: border-box;
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  width: 100%;
  margin: 0 0 24px;
  padding: 16px;
  border: 1px solid #E5E7EB;
  border-radius: 0;
  color: #0B1220;
  background: #F7F5F0;
  font: inherit;
  text-align: left;
}

button.tubp-inline-configurator__garage {
  cursor: pointer;
}

.tubp-inline-configurator__garage-icon {
  display: grid;
  width: 40px;
  height: 40px;
  place-items: center;
  border: 1px solid #D1D5DB;
  background: #FFFFFF;
  font-size: 20px;
}

.tubp-inline-configurator__garage strong,
.tubp-inline-configurator__garage small {
  display: block;
}

.tubp-inline-configurator__garage strong {
  font-size: 14px;
  line-height: 1.4;
}

.tubp-inline-configurator__garage small {
  margin-top: 4px;
  color: #6B7280;
  font-size: 11px;
  line-height: 1.4;
}

.tubp-inline-configurator__garage > button {
  min-height: 40px;
  padding: 0 12px;
  border: 1px solid #0B1220;
  background: #FFFFFF;
  color: #0B1220;
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
}

.tubp-package-choice {
  display: grid;
  grid-template-columns: 104px minmax(0, 1fr);
  align-items: center;
  gap: 16px;
  min-height: 128px;
}

.tubp-package-choice__media {
  position: relative;
  display: block;
  width: 104px;
  height: 96px;
  overflow: hidden;
  background: #F7F5F0;
}

.tubp-package-choice__media img {
  position: absolute;
  top: 8px;
  bottom: 8px;
  left: 8px;
  width: calc(100% - 16px);
  height: calc(100% - 16px);
  object-fit: contain;
  mix-blend-mode: multiply;
}

.tubp-package-choice__media--2 img {
  width: 64%;
}

.tubp-package-choice__media--2 img:nth-child(2) {
  left: 36%;
}

.tubp-package-choice__media--3 img {
  width: 52%;
}

.tubp-package-choice__media--3 img:nth-child(2) { left: 24%; }
.tubp-package-choice__media--3 img:nth-child(3) { left: 48%; }

.tubp-package-choice__copy {
  display: block;
  min-width: 0;
}

@media (min-width: 1081px) {
  .tubp-product .tubp-package-choice {
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 8px;
    min-height: 88px;
    padding: 8px;
  }

  .tubp-product .tubp-package-choice__media {
    width: 72px;
    height: 72px;
  }

  .tubp-product .tubp-inline-configurator__garage {
    margin-bottom: 8px;
    padding: 8px;
    grid-template-columns: 32px minmax(0, 1fr) auto;
  }

  .tubp-product .tubp-inline-configurator__garage-icon {
    width: 32px;
    height: 32px;
    font-size: 16px;
  }

  .tubp-product .tubp-inline-configurator__garage small {
    display: none;
  }
}

@media (max-width: 720px) {
  .tubp-gallery-controls {
    right: 16px;
    left: auto;
  }

  .tubp-package-choice {
    grid-template-columns: 88px minmax(0, 1fr);
  }

  .tubp-package-choice__media {
    width: 88px;
    height: 88px;
  }

  .tubp-product .tubp-package-choice {
    min-height: 128px;
    padding: 12px;
  }

  .tubp-product .tubp-package-choice__description {
    font-size: 13px;
    line-height: 1.4;
  }

  .tubp-product .tubp-package-choice__includes,
  .tubp-product .tubp-package-choice__footer {
    display: none;
  }
}

/* Compact post-PDP story opening. */
.tubp-story-section {
  margin-top: 0 !important;
}

.tubp-story .tubp-story__intro {
  grid-template-columns: minmax(0, 1.1fr) minmax(320px, .72fr);
  column-gap: 64px;
  row-gap: 16px;
  padding-top: 80px;
  padding-bottom: 64px;
}

.tubp-story .tubp-story__intro .tubp-kicker {
  grid-column: 1;
}

.tubp-story .tubp-story__intro h2 {
  grid-column: 1;
  max-width: 13ch;
  font-size: clamp(48px, 5vw, 80px);
  line-height: .98;
}

.tubp-story .tubp-story__intro .tubp-lede {
  grid-column: 2;
  grid-row: 2;
  align-self: end;
}

.tubp-story .tubp-feature {
  grid-template-columns: minmax(0, 1.15fr) minmax(360px, .85fr);
  gap: 64px;
  align-items: center;
  padding-bottom: 96px;
}

.tubp-story .tubp-feature__media {
  min-height: 0;
  aspect-ratio: 5 / 4;
}

.tubp-story .tubp-feature__media--hero img {
  object-position: center;
}

.tubp-story .tubp-feature__copy h3 {
  max-width: 12ch;
  margin-bottom: 24px;
  font-size: clamp(40px, 4vw, 64px);
}

.tubp-story .tubp-feature__copy > p:not(.tubp-kicker) {
  max-width: 48ch;
  margin-bottom: 32px;
  font-size: 18px;
  line-height: 1.6;
}

.tubp-story .tubp-match {
  grid-template-columns: minmax(0, 5fr) minmax(520px, 7fr);
  gap: 64px;
  align-items: center;
  padding: 96px 0;
  border-top: 1px solid var(--tubp-line);
}

.tubp-story .tubp-match h2 {
  max-width: 12ch;
  font-size: clamp(40px, 4vw, 64px);
}

.tubp-story .tubp-match__copy {
  max-width: 520px;
}

.tubp-story .tubp-match__copy .tubp-button {
  margin-top: 32px;
}

.tubp-story .tubp-match__visual {
  min-width: 0;
  margin: 0;
  background: #FFFFFF;
}

.tubp-story .tubp-match__visual-media {
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--tubp-paper);
}

.tubp-story .tubp-match__visual img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 62%;
}

.tubp-story .tubp-match__visual figcaption {
  display: grid;
  grid-template-columns: minmax(0, auto) minmax(0, 1fr);
  gap: 24px;
  align-items: center;
  padding: 24px 32px;
  color: #FFFFFF;
  background: var(--tubp-blue);
}

.tubp-story .tubp-match__visual figcaption span {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .08em;
  line-height: 1.4;
  text-transform: uppercase;
}

.tubp-story .tubp-match__visual figcaption strong {
  justify-self: end;
  max-width: 28ch;
  font-size: 16px;
  line-height: 1.4;
  text-align: right;
}

@media (max-width: 960px) {
  .tubp-story .tubp-story__intro,
  .tubp-story .tubp-feature,
  .tubp-story .tubp-match {
    grid-template-columns: 1fr;
  }

  .tubp-story .tubp-story__intro .tubp-lede {
    grid-column: 1;
    grid-row: auto;
  }

  .tubp-story .tubp-match {
    gap: 48px;
    padding: 80px 0;
  }

  .tubp-story .tubp-match__copy {
    max-width: 680px;
  }
}

@media (max-width: 720px) {
  .tubp-story .tubp-story__intro {
    padding-top: 64px;
    padding-bottom: 48px;
  }

  .tubp-story .tubp-feature {
    gap: 32px;
    padding-bottom: 64px;
  }

  .tubp-story .tubp-feature__media {
    aspect-ratio: 1 / 1;
  }

  .tubp-story .tubp-match {
    gap: 32px;
    padding: 64px 0;
  }

  .tubp-story .tubp-match__visual-media {
    aspect-ratio: 1 / 1;
  }

  .tubp-story .tubp-match__visual figcaption {
    display: block;
    padding: 24px;
  }

  .tubp-story .tubp-match__visual figcaption strong {
    display: block;
    margin-top: 8px;
    text-align: left;
  }
}

@media (max-width: 720px) {
  .tubp-product {
    --tubp-wrap: min(100% - 48px, 1280px);
  }

  .tubp-product__shell {
    padding-top: 24px;
  }

  .tubp-product .product-main {
    max-height: none;
    overflow: visible;
    border-radius: 16px;
  }

  .tubp-product .product-details {
    padding: 24px;
  }

  .tubp-product .product-title {
    font-size: 34px !important;
  }

  .tubp-inline-configurator {
    margin-top: 24px;
    padding-top: 24px;
  }

  .tubp-inline-configurator__content,
  .tubp-inline-configurator__step {
    margin-top: 24px;
    padding-top: 24px;
  }

  .tubp-inline-configurator__step {
    padding-bottom: 24px;
  }

  .tubp-inline-configurator__methods {
    grid-template-columns: 1fr;
  }

  .tubp-match-method {
    min-height: 52px;
  }

  .tubp-inline-configurator__field-row {
    grid-template-columns: 1fr;
  }

  .tubp-inline-configurator__field-row .tubp-inline-configurator__field + .tubp-inline-configurator__field {
    margin-top: 16px;
  }

  .tubp-product .tubp-package-choice__topline {
    flex-wrap: wrap;
    justify-content: flex-start;
  }

  .tubp-product .tubp-package-choice__recommendation {
    max-width: 100%;
    white-space: normal;
  }
}

@media (prefers-reduced-motion: no-preference) {
  .tubp-inline-configurator__step {
    animation: tubp-reveal 600ms cubic-bezier(.16, 1, .3, 1) both;
  }

  .tubp-inline-configurator__step:nth-child(2) {
    animation-delay: 60ms;
  }
}

@keyframes tubp-reveal {
  from {
    opacity: 0;
    transform: translateY(24px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Ridge-proportioned bottle PDP first viewport. This final scoped layer resets
   the inherited Empire gallery/card geometry without changing product data. */
@media (min-width: 1081px) {
  .tubp-product {
    --tubp-rail-width: clamp(560px, 32vw, 640px);
    --tubp-preview-width: 0px;
    --tubp-primary-size: min(960px, calc(100dvh - 192px), calc(100vw - 52px - var(--tubp-rail-width)));
    --tubp-gallery-height: var(--tubp-primary-size);
    --tubp-wrap: calc(var(--tubp-primary-size) + var(--tubp-rail-width) + 4px);
    padding-bottom: 0;
  }

  .tubp-product__signal {
    min-height: 36px;
    box-sizing: border-box;
    padding: 8px 24px;
  }

  .tubp-product__shell {
    width: var(--tubp-wrap) !important;
    margin: 0 auto;
    padding: 0 !important;
  }

  .tubp-product .product--outer {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) var(--tubp-preview-width) var(--tubp-rail-width) !important;
    align-items: start;
    gap: 4px;
    width: 100% !important;
    min-height: 0;
    margin: 0 !important;
    padding: 0 !important;
  }

  .tubp-product .product-gallery,
  .tubp-product__secondary-media,
  .tubp-product .product-main {
    min-width: 0;
  }

  .tubp-product .product-gallery {
    position: relative;
    top: auto;
    align-self: start;
    height: var(--tubp-gallery-height);
    min-height: 0;
    aspect-ratio: auto;
    margin: 0 !important;
    background: #EFEEEB;
  }

  .tubp-product .product-gallery-fit-content,
  .tubp-product .product-gallery--viewer,
  .tubp-product .product-gallery--media,
  .tubp-product .product-gallery--image-background {
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    padding: 0 !important;
    aspect-ratio: auto !important;
  }

  .tubp-product .product-gallery-fit-content {
    position: relative !important;
    top: auto !important;
  }

  .tubp-product .product-gallery--viewer {
    border: 0;
    background: #F7F5F0;
    box-shadow: none;
  }

  .tubp-product .product-gallery--media[data-media-type="image"] img {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    object-fit: contain !important;
    object-position: 50% 50%;
    mix-blend-mode: normal !important;
    transform: none !important;
  }

  .tubp-product .product-gallery--navigation,
  .tubp-product .product-gallery--skeleton-thumbnails {
    display: none !important;
  }

  .tubp-gallery-pager {
    position: absolute;
    z-index: 5;
    right: 16px;
    bottom: 16px;
    left: 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: var(--tubp-ink);
    font-size: 13px;
    font-weight: 700;
    pointer-events: none;
  }

  .tubp-gallery-pager span {
    display: grid;
    min-width: 48px;
    min-height: 48px;
    place-items: center;
    background: #FFFFFF;
  }

  .tubp-product__secondary-media {
    position: relative;
    top: auto;
    align-self: start;
    display: block;
    height: var(--tubp-gallery-height);
    min-height: 0;
    padding: 0;
    overflow: hidden;
    border: 0;
    background: #111318;
    cursor: pointer;
    text-align: left;
  }

  .tubp-product__secondary-content {
    display: block;
    width: 100%;
    height: 100%;
  }

  .tubp-product__secondary-media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: 50% 50%;
    transition: transform 180ms ease-out, opacity 180ms ease-out;
  }

  .tubp-product__secondary-media:hover img {
    transform: scale(1.02);
  }

  .tubp-product__secondary-media:focus-visible {
    outline: 3px solid #2B6CF6;
    outline-offset: -3px;
  }

  .tubp-product__secondary-play {
    position: absolute;
    right: 24px;
    bottom: 24px;
    display: none;
    width: 52px;
    height: 52px;
    place-items: center;
    border-radius: 50%;
    color: #0B1220;
    background: #FFFFFF;
    font-size: 16px;
  }

  .tubp-product__secondary-media.is-video .tubp-product__secondary-play {
    display: grid;
  }

  .tubp-product .product-main {
    position: relative;
    top: 0;
    align-self: start;
    width: var(--tubp-rail-width) !important;
    max-width: var(--tubp-rail-width) !important;
    min-height: 0;
    max-height: none;
    overflow: visible;
    border: 1px solid #D8D8D4;
    border-block: 0;
    border-radius: 0;
    background: #FFFFFF;
  }

  .tubp-gallery-controls {
    bottom: 24px;
    left: 24px;
  }

  .tubp-product .product-details {
    display: flex;
    min-height: 0;
    flex-direction: column;
    padding: 24px 32px 16px;
  }

  .tubp-product .product-block {
    margin-top: 12px;
  }

  .tubp-product .product-block--title {
    padding-bottom: 16px;
  }

  .tubp-product .product-block--title::before {
    display: none;
  }

  .tubp-product .product-title {
    max-width: none;
    font-size: 24px !important;
    line-height: 1.2;
    letter-spacing: -.01em;
  }

  .tubp-product .product-block--@app {
    margin-top: 12px;
  }

  .tubp-product .product-price,
  .tubp-product .price__current {
    font-size: 24px;
  }

  .tubp-product .product-block:has(.tubp-free-shipping) {
    margin-top: 12px;
  }

  .tubp-inline-configurator {
    display: flex;
    flex: 1;
    flex-direction: column;
    width: 100%;
    margin-top: 12px;
    padding-top: 12px;
  }

  .tubp-product .product-block:has(.tubp-inline-configurator) {
    display: flex;
    flex: 1;
  }

  .tubp-inline-configurator__intro p:not(.tubp-inline-configurator__eyebrow) {
    display: none;
  }

  .tubp-inline-configurator__intro h2 {
    max-width: none;
    font-size: 16px;
    line-height: 1.4;
  }

  .tubp-inline-configurator__content {
    display: flex;
    flex: 1;
    flex-direction: column;
    margin-top: 12px;
  }

  .tubp-inline-configurator__step {
    padding: 12px 0;
  }

  .tubp-inline-configurator__step.is-disabled {
    opacity: 1;
  }

  .tubp-inline-configurator__step-heading {
    grid-template-columns: 24px minmax(0, 1fr);
    gap: 8px;
  }

  .tubp-inline-configurator__step-heading h3 {
    font-size: 16px;
    line-height: 1.4;
  }

  .tubp-inline-configurator__step-heading p {
    display: none;
  }

  .tubp-inline-configurator__methods {
    gap: 8px;
    margin-top: 12px;
  }

  .tubp-match-method {
    min-height: 64px;
    padding: 8px;
    border-radius: 0;
  }

  .tubp-match-method strong,
  .tubp-match-method span {
    font-size: 11px;
  }

  .tubp-inline-configurator__field,
  .tubp-inline-configurator__field-row {
    margin-top: 12px;
  }

  .tubp-inline-configurator__field input,
  .tubp-inline-configurator__field select {
    min-height: 44px;
    padding: 8px 12px;
    border-radius: 0;
    font-size: 13px;
  }

  .tubp-inline-configurator__vehicle,
  .tubp-inline-configurator__helper {
    margin-top: 8px;
    font-size: 11px;
  }

  .tubp-inline-configurator__packages {
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
    margin-top: 12px;
  }

  .tubp-product .tubp-package-choice {
    position: relative;
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 8px;
    min-height: 88px;
    padding: 8px;
    border-radius: 0;
  }

  .tubp-product .tubp-package-choice__media {
    width: 72px;
    height: 72px;
  }

  .tubp-product .tubp-package-choice:disabled {
    opacity: 1;
  }

  .tubp-product .tubp-package-choice__copy {
    display: grid;
    gap: 4px;
    align-content: center;
  }

  .tubp-product .tubp-package-choice__topline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
  }

  .tubp-product .tubp-package-choice__topline > span:first-child {
    font-size: 16px;
    line-height: 1.25;
  }

  .tubp-product .tubp-package-choice__recommendation {
    display: inline-flex;
    margin: 0;
    font-size: 10px;
  }

  .tubp-product .tubp-package-choice__description {
    display: block;
    margin: 0;
    font-size: 12px;
    line-height: 1.4;
  }

  .tubp-product .tubp-package-choice__includes {
    display: flex;
    gap: 4px 12px;
    margin: 2px 0 0;
    font-size: 10px;
    line-height: 1.3;
  }

  .tubp-product .tubp-package-choice__footer {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin: 2px 0 0;
    font-size: 10px;
  }

  .tubp-product .tubp-package-choice__footer > span {
    display: block;
  }

  .tubp-product .tubp-package-choice__footer strong {
    font-size: 14px;
  }

  .tubp-product .tubp-package-choice.is-selected {
    border-color: #0B1220;
    background: #F7F5F0;
    box-shadow: inset 4px 0 0 #2B6CF6;
  }

  .tubp-inline-configurator__cta-row {
    position: static;
    display: block;
    margin: 12px -32px -16px;
    padding: 16px 32px;
    border-top: 1px solid var(--tubp-line);
    background: #FFFFFF;
  }

  .tubp-inline-configurator__cta-row > div {
    display: none;
  }

  .tubp-inline-configurator__atc {
    width: 100%;
    min-height: 52px;
    border-color: #0B0C0E;
    border-radius: 0;
    background: #0B0C0E;
    text-transform: uppercase;
  }

  .tubp-product .product-block:has(.afterpay-paragraph),
  .tubp-product .product-block:has(.affirm-as-low-as) {
    display: none;
  }
}

@media (min-width: 1081px) and (max-width: 1679px) {
  .tubp-product .product--outer {
    grid-template-columns: minmax(0, 1fr) var(--tubp-rail-width) !important;
  }

  .tubp-product__secondary-media {
    display: none;
  }
}

@media (min-width: 1680px) {
  .tubp-product {
    --tubp-preview-width: clamp(280px, 20vw, 400px);
    --tubp-primary-size: min(960px, calc(100dvh - 192px), calc(100vw - 56px - var(--tubp-rail-width) - var(--tubp-preview-width)));
    --tubp-gallery-height: var(--tubp-primary-size);
    --tubp-wrap: calc(var(--tubp-primary-size) + var(--tubp-preview-width) + var(--tubp-rail-width) + 8px);
  }
}

@media (max-width: 1080px) {
  .tubp-product__secondary-media {
    display: none;
  }

  .tubp-product .product-main {
    max-height: none;
    overflow: visible;
  }
}

/* Keep every custom media slide flush with the mobile/tablet stage. The base
   theme gives figures a viewport width and the hero a separate 16:9 height,
   which otherwise leaves an empty band inside the square gallery canvas. */
@media (max-width: 1080px) {
  .tubp-product [data-tubp-gallery] {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 1 / 1 !important;
  }

  .tubp-product [data-tubp-gallery] .product-gallery--media,
  .tubp-product [data-tubp-gallery] .product-gallery--image-background,
  .tubp-product [data-tubp-gallery] .product-gallery--loaded-image,
  .tubp-product [data-tubp-gallery] video {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    padding: 0 !important;
    aspect-ratio: auto !important;
  }

  .tubp-product [data-tubp-gallery] .product-gallery--loaded-image,
  .tubp-product [data-tubp-gallery] video {
    max-width: none !important;
    max-height: none !important;
    object-fit: contain !important;
    object-position: 50% 50% !important;
    mix-blend-mode: normal !important;
    transform: none !important;
  }
}
/* Keep the configurator CTA inside the product-details content box. */
.tubp-product .tubp-inline-configurator__cta-row {
  margin-inline: 0 !important;
}

.tubp-inline-configurator__resolve {
  min-height: 48px;
  margin-top: 16px;
  padding: 0 20px;
  border: 1px solid var(--tubp-ink);
  border-radius: 16px;
  color: #FFFFFF;
  background: var(--tubp-ink);
  cursor: pointer;
  font: inherit;
  font-size: 14px;
  font-weight: 700;
}

.tubp-inline-configurator__resolve:disabled {
  border-color: var(--tubp-line);
  color: var(--tubp-muted);
  background: #FFFFFF;
  cursor: not-allowed;
}
