/* Picture Day Pros — theme styles
   Palette and type lifted 1:1 from the approved prototype. */

:root {
  --navy: #0a1533;
  --navy-2: #16255a;
  --blue: #1f4bf0;
  --blue-deep: #142b7a;
  --cyan: #12bdf1;
  --cyan-lt: #7fe0ff;
  --ink: #101828;
  --slate: #475069;
  --mute: #6b7590;
  --line: #e6ecfb;
  --line-2: #dce3f2;
  --tint: #eef3fe;
  --tint-2: #dce6fa;
  --amber: #b45309;
  --wrap: 1280px;
  --display: "Big Shoulders Display", "Arial Narrow", sans-serif;
  --body: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

*,
*::before,
*::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: #fff;
  color: var(--ink);
  font-family: var(--body);
  font-size: 17px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; height: auto; }

a { color: var(--blue); text-decoration: none; }
a:hover { color: var(--cyan); }

h1, h2, h3, h4 { margin: 0; }

.pdp-wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 28px; }
.pdp-sr {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.skip-link:focus {
  position: fixed; top: 12px; left: 12px; z-index: 200; width: auto; height: auto;
  clip: auto; padding: 12px 18px; background: #fff; color: var(--ink);
  font-weight: 800; border: 2px solid var(--blue);
}

/* ---------------- shared type ---------------- */

.pdp-display {
  font-family: var(--display);
  font-weight: 900;
  line-height: 0.86;
  letter-spacing: 0.005em;
  text-transform: uppercase;
  text-wrap: balance;
}
.pdp-eyebrow {
  margin: 0 0 14px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--blue);
}
.pdp-eyebrow--onDark { color: var(--cyan-lt); }
.pdp-h2 {
  font-family: var(--display);
  font-size: clamp(34px, 4vw, 52px);
  font-weight: 900;
  line-height: 0.9;
  letter-spacing: 0.005em;
  text-transform: uppercase;
  padding-left: 18px;
  border-left: 6px solid var(--blue);
}
.pdp-lede {
  margin: 0;
  font-size: clamp(16px, 1.3vw, 19px);
  line-height: 1.6;
  color: var(--slate);
  text-wrap: pretty;
}

/* ---------------- buttons ---------------- */

.pdp-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 16px 28px;
  border: none;
  border-radius: 4px;
  background: var(--blue);
  color: #fff;
  font-family: var(--body);
  font-size: 15px;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background 0.25s ease, transform 0.3s cubic-bezier(0.2, 0.8, 0.3, 1), color 0.25s ease;
}
.pdp-btn:hover { background: var(--cyan); color: #062038; transform: translateY(-2px); }
.pdp-btn--ghost {
  background: transparent;
  border: 1px solid var(--line-2);
  color: var(--ink);
}
.pdp-btn--ghost:hover { background: var(--tint); color: var(--blue); transform: none; }
.pdp-btn--onDark { background: #fff; color: var(--blue-deep); }
.pdp-btn--onDark:hover { background: var(--cyan-lt); color: var(--blue-deep); }
.pdp-btn--ghostDark {
  background: transparent;
  border: 1px solid rgba(255, 255, 255, 0.4);
  color: #fff;
}
.pdp-btn--ghostDark:hover { background: rgba(255, 255, 255, 0.12); color: #fff; }
.pdp-btn--block { width: 100%; }

/* ---------------- header ---------------- */

.pdp-header {
  position: sticky;
  top: 0;
  z-index: 60;
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: saturate(160%) blur(10px);
  border-bottom: 1px solid var(--line);
}
.pdp-topbar {
  max-width: var(--wrap);
  margin: 0 auto;
  padding: 18px 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px 26px;
}
.pdp-brand { display: flex; align-items: center; gap: 12px; }
/* flex: 0 0 auto — the logo sits in a flex row, and without it the logo is what
   gives when the header runs out of room: the width collapses while the fixed
   height stays, squashing it to a sliver. object-fit is the backstop. */
.pdp-logo { height: 66px; width: auto; display: block; flex: 0 0 auto; object-fit: contain; }
.pdp-brand > a { flex: 0 0 auto; min-width: 0; }

.pdp-nav { display: flex; align-items: center; }
.pdp-nav__list { display: flex; align-items: center; gap: 30px; margin: 0; padding: 0; list-style: none; }
.pdp-nav li { list-style: none; }
.pdp-nav a {
  font-size: 17px;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--ink);
}
.pdp-nav a:hover,
.pdp-nav .current-menu-item > a { color: var(--blue); }
.pdp-headtools { display: flex; align-items: center; gap: 14px; }
.pdp-call {
  display: flex;
  align-items: center;
  gap: 9px;
  color: var(--ink);
  white-space: nowrap;
}
.pdp-call:hover { color: var(--blue); }
.pdp-call__icon {
  width: 34px;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--line-2);
  border-radius: 50%;
  font-size: 15px;
}
.pdp-call__num { font-size: 17px; font-weight: 700; letter-spacing: -0.01em; }

/* Order button with the animated arrow */
.pdp-order {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 13px 20px;
  border-radius: 4px;
  background: var(--blue);
  color: #fff;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  overflow: hidden;
  transition: background 0.25s ease;
}
.pdp-order:hover { background: var(--navy); color: #fff; }
.pdp-order__arrow {
  display: inline-block;
  animation: pdpNudge 1.9s cubic-bezier(0.4, 0, 0.2, 1) infinite;
}
.pdp-order:hover .pdp-order__arrow { animation-duration: 0.9s; }
/* Burger + logo + call + order + cart need ~615px of header room and only clear
   it around 660px, so below that the Order button overlaps the logo. Drop it —
   the cart sits beside it and the hero repeats the same call to action. */
@media (max-width: 699px) {
  .pdp-order { display: none; }
}
@keyframes pdpNudge {
  0%, 55%, 100% { transform: translateX(0); }
  70% { transform: translateX(5px); }
  85% { transform: translateX(2px); }
}

.pdp-cart {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 13px 18px;
  border: 1px solid var(--line-2);
  border-radius: 4px;
  background: #fff;
  color: var(--ink);
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.pdp-cart:hover { border-color: var(--blue); color: var(--blue); }
.pdp-cart__count {
  min-width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 6px;
  border-radius: 999px;
  background: var(--navy);
  color: #fff;
  font-size: 12px;
  font-weight: 800;
}
.pdp-burger {
  display: none;
  width: 44px;
  height: 44px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  border: 1px solid var(--line-2);
  border-radius: 4px;
  background: #fff;
  cursor: pointer;
}
.pdp-burger span { width: 18px; height: 2px; border-radius: 2px; background: var(--ink); }
.pdp-mobile-nav { display: none; padding: 8px 18px 18px; border-top: 1px solid var(--line); }
.pdp-mobile-nav.is-open { display: block; }
.pdp-mobile-nav ul { margin: 0; padding: 0; list-style: none; display: grid; }
.pdp-mobile-nav a {
  display: block;
  padding: 15px 6px;
  border-bottom: 1px solid #f1f5fd;
  font-size: 17px;
  font-weight: 700;
  color: var(--ink);
}

/* ---------------- announcement ticker ---------------- */

.pdp-ticker {
  position: relative;
  overflow: hidden;
  background: var(--navy);
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}
.pdp-ticker__track {
  display: flex;
  width: max-content;
  padding: 11px 0;
  animation: pdpTicker 42s linear infinite;
}
.pdp-ticker__item {
  display: inline-flex;
  align-items: center;
  gap: 26px;
  padding-right: 26px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #c3d0ec;
  white-space: nowrap;
}
.pdp-ticker__dot { color: var(--cyan); }
/* The track holds the list twice, so -50% lands exactly on the seam. */
@keyframes pdpTicker {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
.pdp-ticker:hover .pdp-ticker__track { animation-play-state: paused; }

/* ---------------- hero ---------------- */

.pdp-hero {
  position: relative;
  overflow: hidden;
  background: var(--navy);
  color: #fff;
}
.pdp-hero__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 28%;
  opacity: 0.85;
}
.pdp-scrim-v {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(10, 21, 51, 0.68) 0%, rgba(10, 21, 51, 0.5) 42%, rgba(10, 21, 51, 0.9) 100%);
}
.pdp-scrim-h {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(90deg, var(--navy) 0%, rgba(10, 21, 51, 0.12) 28%, rgba(10, 21, 51, 0.12) 72%, var(--navy) 100%);
}
.pdp-lines {
  position: absolute;
  inset: 0;
  pointer-events: none;
  /* Vertical pinstripes switched off at the client's request. The element is
     still rendered, so restoring them is one line. */
  background-image: none;
}
.pdp-hero__inner {
  position: relative;
  max-width: var(--wrap);
  margin: 0 auto;
  padding: 84px 28px 92px;
}
.pdp-hero__title {
  margin: 22px 0 0;
  font-family: var(--display);
  font-weight: 900;
  font-size: clamp(46px, 6.6vw, 98px);
  line-height: 0.86;
  letter-spacing: 0.005em;
  text-transform: uppercase;
  text-wrap: balance;
}
.pdp-hero__title em { font-style: normal; color: #55d6fa; }
.pdp-hero__body {
  margin: 20px 0 0;
  max-width: 48ch;
  font-size: clamp(16px, 1.35vw, 19px);
  line-height: 1.6;
  color: #c3d0ec;
  text-wrap: pretty;
}
.pdp-badge {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 8px 15px;
  border: 1px solid rgba(255, 255, 255, 0.32);
  border-radius: 999px;
  font-size: 13px;
  font-weight: 700;
}
.pdp-badge__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--cyan);
  animation: pdpDot 2.4s ease-in-out infinite;
}
@keyframes pdpDot {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.45; transform: scale(0.8); }
}
.pdp-chips { margin: 26px 0 0; display: flex; gap: 8px; flex-wrap: wrap; }
.pdp-chips span {
  padding: 7px 13px;
  border: 1px solid rgba(255, 255, 255, 0.24);
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
  color: #d5def2;
}
.pdp-hero__cta { margin: 30px 0 0; display: flex; gap: 12px; flex-wrap: wrap; }
/* The phone sits in the CTA row, sized to match the buttons beside it. */
.pdp-hero__phone {
  display: inline-flex;
  align-items: center;
  padding: 16px 4px;
  font-family: var(--display);
  font-size: 30px;
  font-weight: 900;
  letter-spacing: 0.01em;
  color: #fff;
}
.pdp-hero__phone:hover { color: var(--cyan-lt); }
.pdp-phone-xl {
  font-family: var(--display);
  font-size: clamp(30px, 3.4vw, 44px);
  font-weight: 900;
  letter-spacing: 0.01em;
  color: #fff;
}
.pdp-phone-xl:hover { color: var(--cyan-lt); }

/* ---------------- page hero band (sub pages) ---------------- */

.pdp-band {
  position: relative;
  overflow: hidden;
  background: var(--navy);
  color: #fff;
}
.pdp-band__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.62;
}
.pdp-band__inner {
  position: relative;
  max-width: var(--wrap);
  margin: 0 auto;
  padding: 70px 28px 64px;
}
.pdp-band__title {
  margin: 0;
  max-width: 22ch;
  font-family: var(--display);
  font-size: clamp(42px, 5.6vw, 78px);
  font-weight: 900;
  line-height: 0.86;
  letter-spacing: 0.005em;
  text-transform: uppercase;
  text-wrap: balance;
}
.pdp-band__sub {
  margin: 18px 0 0;
  max-width: 58ch;
  font-size: clamp(16px, 1.3vw, 18px);
  line-height: 1.6;
  color: #c3d0ec;
  text-wrap: pretty;
}

/* ---------------- diagonal transitions ---------------- */

/* The diagonal is 4.4vw so it stays proportional on small screens, but it must be
   capped: uncapped it reaches ~100px on a wide monitor, and two of them swallow the
   240px scoreboard, slicing the stats into a slanted sliver. 56px is what 4.4vw
   resolves to at the 1280px design width. */
.pdp-wedge {
  position: absolute;
  left: 0;
  right: 0;
  height: clamp(34px, 4.4vw, 56px);
  pointer-events: none;
}
.pdp-wedge--in { top: -1px; clip-path: polygon(0 0, 100% 0, 0 100%); }
.pdp-wedge--out { bottom: -1px; clip-path: polygon(0 100%, 100% 0, 100% 100%); }

/* ---------------- sections ---------------- */

.pdp-section { padding: 78px 0; }
.pdp-section--tint { background: var(--tint); }
.pdp-section--navy { background: var(--navy); color: #fff; }
.pdp-section__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px 26px;
  flex-wrap: wrap;
  margin-bottom: 30px;
}
.pdp-two {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 44px 64px;
  align-items: start;
}

/* numbered commitment rows */
.pdp-steps { border-top: 1px solid var(--line-2); }
.pdp-step {
  display: grid;
  grid-template-columns: 52px 1fr;
  gap: 18px;
  align-items: baseline;
  padding: 18px 0;
  border-bottom: 1px solid var(--line);
}
.pdp-step__n {
  font-family: var(--display);
  font-size: 34px;
  font-weight: 900;
  line-height: 1;
  color: rgba(31, 75, 240, 0.14);
  -webkit-text-stroke: 1.5px var(--blue);
}
.pdp-step h3 { margin: 0 0 5px; font-size: 17px; font-weight: 700; letter-spacing: -0.01em; }
.pdp-step p { margin: 0; font-size: 15px; line-height: 1.55; color: var(--slate); text-wrap: pretty; }
/* The organiser pitch is a short paragraph beside a tall stat card. Left aligned
   to the top it leaves a ~300px void underneath, so centre the columns instead. */
.pdp-section--navy .pdp-two { align-items: center; }
.pdp-section--navy .pdp-steps { border-color: rgba(255, 255, 255, 0.24); }
.pdp-section--navy .pdp-step { border-color: rgba(255, 255, 255, 0.16); }
.pdp-section--navy .pdp-step__n {
  color: rgba(255, 255, 255, 0.2);
  -webkit-text-stroke: 1.5px rgba(255, 255, 255, 0.8);
}
.pdp-section--navy .pdp-step p { color: #dce5ff; }

/* scoreboard strip */
.pdp-scoreboard {
  position: relative;
  overflow: hidden;
  background: var(--navy);
  color: #fff;
}
.pdp-scoreboard__inner {
  position: relative;
  max-width: var(--wrap);
  margin: 0 auto;
  padding: 74px 28px 78px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 26px 40px;
}
.pdp-stat__figure {
  margin: 0;
  font-family: var(--display);
  font-size: clamp(44px, 5vw, 68px);
  font-weight: 900;
  line-height: 0.84;
  letter-spacing: 0.01em;
}
.pdp-stat__caption {
  margin: 0 0 8px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--cyan-lt);
}

/* ---------------- product cards ---------------- */

.pdp-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 18px;
}
/* Rows that always hold exactly four tiles (home featured, related products).
   The auto-fill grid above drops to three at common laptop widths and leaves the
   fourth tile orphaned on its own row, so these step down 4 -> 2 -> 1 instead. */
.pdp-grid--four { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 1100px) {
  .pdp-grid--four { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .pdp-grid--four { grid-template-columns: 1fr; }
}
.pdp-card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 4px;
  overflow: hidden;
  clip-path: polygon(0 0, calc(100% - 22px) 0, 100% 22px, 100% 100%, 0 100%);
  transition: transform 0.35s cubic-bezier(0.2, 0.8, 0.3, 1), filter 0.35s ease;
}
.pdp-card:hover { transform: translateY(-5px); filter: drop-shadow(0 18px 26px rgba(16, 24, 40, 0.28)); }
.pdp-card__media {
  position: relative;
  aspect-ratio: 1 / 1;
  background: #fff;
  overflow: hidden;
}
.pdp-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pdp-card__body { padding: 18px 18px 20px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.pdp-card__sku {
  margin: 0;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--mute);
}
.pdp-card__name { margin: 0; font-size: 18px; font-weight: 700; letter-spacing: -0.01em; }
.pdp-card__name a { color: var(--ink); }
.pdp-card__name a:hover { color: var(--blue); }
.pdp-card__blurb { margin: 0; font-size: 14px; line-height: 1.5; color: var(--slate); text-wrap: pretty; }
/* Element-qualified so these beat `.woocommerce .button` further down the file:
   both are two classes, so without the tag name the later rule wins the tie and
   the full-size button overflows a four-up card. */
.pdp-card__foot a.button,
.pdp-card__foot button.button,
.pdp-card__foot input.button {
  padding: 12px 16px;
  font-size: 13px;
  white-space: nowrap;
  flex: 1 1 auto;
  text-align: center;
}
/* WooCommerce injects a "View cart" link after a successful add. Hiding it kept
   the card tidy but left a click with nothing visible happening — the only
   change was the small count up in the header, which reads as a dead button.
   Shown as a confirmation line across the foot instead. */
.pdp-card__foot .added_to_cart {
  flex: 1 1 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  margin: 0;
  padding: 9px 12px;
  border: 1px solid rgba(37, 99, 235, 0.28);
  border-radius: 3px;
  background: rgba(37, 99, 235, 0.07);
  color: var(--blue);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.1em;
  line-height: 1;
  text-transform: uppercase;
  text-decoration: none;
}
.pdp-card__foot .added_to_cart::before { content: "\2713"; font-size: 13px; }
.pdp-card__foot .added_to_cart:hover { background: rgba(37, 99, 235, 0.13); }

/* Woo's own spinner CSS is dequeued, so give the in-flight state something. */
.pdp-card__foot a.button.loading { opacity: 0.55; pointer-events: none; }
.pdp-card__foot a.button.added { background: var(--navy); }
.pdp-card__foot {
  margin-top: auto;
  padding-top: 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px 12px;
}
.pdp-card__price {
  margin: 0;
  font-family: var(--display);
  font-size: 30px;
  font-weight: 900;
  letter-spacing: 0.01em;
}

/* branded plate for products with no photography yet */
.pdp-plate {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  background-color: var(--navy);
  background-image: radial-gradient(rgba(255, 255, 255, 0.07) 1.5px, transparent 1.5px),
    linear-gradient(150deg, var(--navy-2) 0%, var(--navy) 100%);
  background-size: 16px 16px, auto;
}
/* Two classes on purpose: the card, product and cart wrappers each set
   `img { height: 100%; object-fit: cover }` on their own images, and a
   single-class selector here loses to the later ones and crops the logo. */
.pdp-plate .pdp-plate__mark {
  width: 58%;
  max-width: 150px;
  height: auto;
  object-fit: contain;
  opacity: 0.9;
  filter: brightness(0) invert(1);
}
.pdp-plate p {
  margin: 0;
  padding: 0 18px;
  text-align: center;
  font-family: var(--display);
  font-size: 22px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--cyan-lt);
}

/* category filter row */
.pdp-filters {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  padding-bottom: 26px;
  border-bottom: 1px solid var(--line);
}
.pdp-filters a {
  padding: 11px 18px;
  border: 1px solid var(--line-2);
  border-radius: 4px;
  background: #fff;
  color: var(--ink);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.pdp-filters a:hover { border-color: var(--blue); color: var(--blue); }
.pdp-filters a.is-active { background: var(--ink); border-color: var(--ink); color: #fff; }

/* ---------------- single product ---------------- */

.pdp-product { padding: 44px 0 78px; }
.pdp-product__grid {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) minmax(300px, 1fr);
  gap: 40px 56px;
  align-items: start;
}
.pdp-product__media {
  position: relative;
  aspect-ratio: 1 / 1;
  border: 1px solid var(--line);
  border-radius: 4px;
  overflow: hidden;
  background: #fff;
}
.pdp-product__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pdp-product__title {
  margin: 8px 0 14px;
  font-family: var(--display);
  font-size: clamp(38px, 4.4vw, 58px);
  font-weight: 900;
  line-height: 0.9;
  letter-spacing: 0.005em;
  text-transform: uppercase;
}
.pdp-product__price {
  margin: 0 0 20px;
  font-family: var(--display);
  font-size: 46px;
  font-weight: 900;
  letter-spacing: 0.01em;
}
.pdp-includes { margin: 0 0 26px; padding: 20px 22px; background: var(--tint); border-radius: 4px; }
.pdp-includes h2 {
  margin: 0 0 12px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--mute);
}
.pdp-includes ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.pdp-includes li {
  display: grid;
  grid-template-columns: 18px 1fr;
  gap: 10px;
  font-size: 15px;
  color: var(--slate);
}
.pdp-includes li::before { content: "\2713"; color: var(--blue); font-weight: 800; }

/* qty + add to cart */
.pdp-qty {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--line-2);
  border-radius: 4px;
  overflow: hidden;
}
.pdp-qty button {
  width: 44px;
  height: 46px;
  border: none;
  background: #fff;
  font-size: 18px;
  font-weight: 800;
  cursor: pointer;
}
.pdp-qty button:hover { background: var(--tint); color: var(--blue); }
.pdp-qty input {
  width: 54px;
  height: 46px;
  border: none;
  border-left: 1px solid var(--line-2);
  border-right: 1px solid var(--line-2);
  text-align: center;
  font-family: var(--body);
  font-size: 16px;
  font-weight: 700;
}

/* ---------------- cart ---------------- */

.pdp-cart-page { padding: 44px 0 78px; }
.pdp-cart-grid {
  display: grid;
  grid-template-columns: minmax(300px, 1.4fr) minmax(280px, 0.6fr);
  gap: 34px 44px;
  align-items: start;
}
.pdp-line {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 18px 0;
  border-bottom: 1px solid var(--line);
}
.pdp-line__media {
  position: relative;
  width: 76px;
  height: 76px;
  flex: 0 0 auto;
  border: 1px solid var(--line);
  border-radius: 4px;
  overflow: hidden;
  background: #fff;
}
.pdp-line__media img { width: 100%; height: 100%; object-fit: cover; }
/* The cart thumbnail is 76px — the product name cannot fit, so show the mark alone. */
.pdp-line__media .pdp-plate { gap: 0; }
.pdp-line__media .pdp-plate p { display: none; }
.pdp-line__media .pdp-plate .pdp-plate__mark { width: 64%; }
.pdp-line__name { margin: 0; font-size: 17px; font-weight: 700; letter-spacing: -0.01em; }
.pdp-line__meta { margin: 3px 0 0; font-size: 13px; color: var(--mute); }
.pdp-line__price { margin: 0; margin-left: auto; font-size: 17px; font-weight: 700; }
.pdp-summary {
  padding: 26px 24px 24px;
  background: var(--tint);
  border-radius: 4px;
  border-top: 4px solid var(--blue);
}
.pdp-summary h2 {
  margin: 0 0 18px;
  font-family: var(--display);
  font-size: 28px;
  font-weight: 900;
  letter-spacing: 0.01em;
  text-transform: uppercase;
}
.pdp-summary__row {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  padding: 9px 0;
  font-size: 15px;
  color: var(--slate);
}
.pdp-summary__total {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 14px;
  margin: 14px 0 20px;
  padding-top: 16px;
  border-top: 1px solid var(--tint-2);
}
.pdp-summary__total span:first-child {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--mute);
}
.pdp-summary__total span:last-child {
  font-family: var(--display);
  font-size: 40px;
  font-weight: 900;
  letter-spacing: 0.01em;
}

/* ---------------- checkout ---------------- */

.pdp-checkout { padding: 44px 0 78px; }
.pdp-fieldset {
  margin: 0 0 26px;
  padding: 26px 24px 24px;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: #fff;
}
.pdp-fieldset > legend {
  padding: 0 8px;
  margin-left: -8px;
  font-family: var(--display);
  font-size: 26px;
  font-weight: 900;
  letter-spacing: 0.01em;
  text-transform: uppercase;
}
.pdp-fieldset__note { margin: 0 0 18px; font-size: 15px; line-height: 1.55; color: var(--slate); }
.pdp-fields {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px 18px;
}
.pdp-fields .form-row { margin: 0; padding: 0; }
.pdp-fields label,
.pdp-field label {
  display: block;
  margin-bottom: 7px;
  font-size: 14px;
  font-weight: 600;
  color: var(--ink);
}
.pdp-fields input[type="text"],
.pdp-fields input[type="tel"],
.pdp-fields input[type="email"],
.pdp-fields input[type="number"],
.pdp-fields select,
.pdp-fields textarea,
.pdp-field input,
.pdp-field select,
.pdp-field textarea {
  width: 100%;
  padding: 12px 14px;
  background: #fff;
  border: 1px solid var(--line-2);
  border-radius: 4px;
  font-family: var(--body);
  font-size: 15px;
  color: var(--ink);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.pdp-fields input:focus,
.pdp-fields select:focus,
.pdp-fields textarea:focus {
  outline: none;
  border-color: var(--blue);
  box-shadow: 0 0 0 3px rgba(31, 75, 240, 0.14);
}
.pdp-fields .pdp-span-all { grid-column: 1 / -1; }
.pdp-req { color: var(--amber); }

/* the accuracy attestation — mandatory */
.pdp-attest {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 8px 18px;
  align-items: start;
  margin-top: 4px;
  padding: 20px 20px 18px;
  background: #fffdf3;
  border: 1px solid #f0d9a0;
  border-left: 5px solid var(--amber);
  border-radius: 4px;
}
.pdp-attest label {
  margin: 0 0 7px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #7c4a03;
}
.pdp-attest input {
  width: 104px;
  padding: 12px 14px;
  background: #fff;
  border: 1px solid #d8b771;
  border-radius: 4px;
  font-family: var(--display);
  font-size: 24px;
  font-weight: 900;
  letter-spacing: 0.1em;
  text-align: center;
  text-transform: uppercase;
}
.pdp-attest input:focus {
  outline: none;
  border-color: var(--amber);
  box-shadow: 0 0 0 3px rgba(180, 83, 9, 0.16);
}
.pdp-attest p {
  margin: 0;
  align-self: center;
  font-size: 14px;
  line-height: 1.55;
  color: #5c4308;
  text-wrap: pretty;
}
.pdp-attest.pdp-attest--error { border-color: var(--amber); background: #fff7e6; }

/* ---------------- order received / receipt ---------------- */

.pdp-receipt { padding: 44px 0 78px; }
.pdp-receipt__sheet {
  max-width: 780px;
  margin: 0 auto;
  padding: 34px 32px 30px;
  border: 1px solid var(--line);
  border-top: 5px solid var(--blue);
  border-radius: 4px;
  background: #fff;
}
.pdp-receipt__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  flex-wrap: wrap;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--line);
}
.pdp-receipt__head img { height: 54px; width: auto; }
.pdp-receipt__num {
  margin: 2px 0 0;
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -0.02em;
  white-space: nowrap;
}
.pdp-receipt__bring {
  margin: 22px 0 0;
  padding: 16px 18px;
  background: var(--navy);
  color: #fff;
  border-radius: 4px;
  font-family: var(--display);
  font-size: 26px;
  font-weight: 900;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  text-align: center;
}
.pdp-meta-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 16px 24px;
  margin: 22px 0 0;
}
.pdp-meta-grid dt {
  margin: 0 0 4px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--mute);
}
.pdp-meta-grid dd { margin: 0; font-size: 16px; font-weight: 600; }

/* ---------------- gallery ---------------- */

.pdp-masonry { columns: 4; column-gap: 14px; }
.pdp-masonry img {
  width: 100%;
  margin: 0 0 14px;
  border-radius: 4px;
  display: block;
  break-inside: avoid;
  cursor: zoom-in;
  transition: transform 0.35s cubic-bezier(0.2, 0.8, 0.3, 1), box-shadow 0.35s ease;
}
.pdp-masonry img:hover { transform: translateY(-5px); box-shadow: 0 22px 40px -22px rgba(0, 0, 0, 0.6); }

.pdp-lightbox {
  position: fixed;
  inset: 0;
  z-index: 90;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 30px 20px;
  background: rgba(6, 14, 40, 0.94);
}
.pdp-lightbox.is-open { display: flex; }
.pdp-lightbox img { max-width: min(92vw, 900px); max-height: 84vh; border-radius: 4px; }
.pdp-lightbox button {
  position: absolute;
  width: 46px;
  height: 46px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
  font-size: 19px;
  cursor: pointer;
}
.pdp-lightbox button:hover { background: rgba(255, 255, 255, 0.2); }
.pdp-lightbox [data-lb="close"] { top: 18px; right: 20px; }
.pdp-lightbox [data-lb="prev"] { left: 14px; top: 50%; transform: translateY(-50%); }
.pdp-lightbox [data-lb="next"] { right: 14px; top: 50%; transform: translateY(-50%); }
.pdp-lightbox__count {
  position: absolute;
  bottom: 22px;
  left: 0;
  right: 0;
  margin: 0;
  text-align: center;
  font-size: 14px;
  font-weight: 600;
  color: #a9bce4;
}

/* ---------------- reviews ---------------- */

.pdp-reviews { position: relative; overflow: hidden; padding: 20px 0 104px; }
.pdp-reviews__dots {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image: radial-gradient(rgba(31, 75, 240, 0.08) 1.5px, transparent 1.5px);
  background-size: 20px 20px;
}
.pdp-reviews__grid {
  position: relative;
  display: grid;
  grid-template-columns: minmax(270px, 0.78fr) minmax(300px, 1.22fr);
  gap: 40px 56px;
  align-items: start;
}
.pdp-score {
  padding: 24px 24px 22px;
  background: var(--tint);
  border: 1px solid var(--tint-2);
  border-top: 4px solid var(--blue);
  border-radius: 4px;
}
.pdp-score__figure {
  margin: 0;
  font-family: var(--display);
  font-size: 66px;
  font-weight: 900;
  line-height: 0.8;
  letter-spacing: 0.01em;
}
.pdp-stars { color: var(--amber); letter-spacing: 0.14em; }
.pdp-review {
  padding: 24px 24px 22px;
  background: #fff;
  border: 1px solid var(--line);
  border-left: 5px solid var(--cyan);
  border-radius: 4px;
  box-shadow: 0 18px 40px -32px rgba(16, 24, 40, 0.4);
}
.pdp-review__body { margin: 0 0 18px; font-size: 17px; line-height: 1.6; text-wrap: pretty; }
.pdp-review__who {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}
.pdp-review__avatar {
  width: 38px;
  height: 38px;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--navy);
  color: #fff;
  font-family: var(--display);
  font-size: 20px;
  font-weight: 900;
}

/* ---------------- footer ---------------- */

.pdp-footer {
  position: relative;
  overflow: hidden;
  background: var(--navy);
  color: #fff;
}
.pdp-footer__inner {
  position: relative;
  max-width: var(--wrap);
  margin: 0 auto;
  padding: 92px 28px 40px;
}
.pdp-footer__cols {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 30px 40px;
  padding-bottom: 30px;
}
.pdp-footer h2 {
  margin: 0 0 12px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #8da3d6;
}
.pdp-footer__logo { height: 54px; width: auto; margin: 0 0 14px; display: block; }
.pdp-footer--light .pdp-footer__logo { filter: none; }
.pdp-footer ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 9px; }
.pdp-footer a { color: #d5def2; font-size: 15px; }
.pdp-footer a:hover { color: var(--cyan-lt); }
.pdp-footer p { color: #d5def2; font-size: 15px; line-height: 1.55; }
.pdp-footer__meta {
  margin-top: 26px;
  padding-top: 22px;
  border-top: 1px solid rgba(255, 255, 255, 0.14);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px 20px;
  flex-wrap: wrap;
}
.pdp-footer__legal {
  margin: 0;
  font-size: 13px;
  color: #8da3d6;
}
.pdp-footer--light .pdp-footer__meta { border-color: var(--line); }
.pdp-footer--light .pdp-footer__legal,
.pdp-footer--light .pdp-footer__badge a { color: var(--mute); }
.pdp-footer--light .pdp-footer__badge a:hover { color: var(--blue); }

@media (max-width: 560px) {
  .pdp-footer__meta { justify-content: center; text-align: center; }
}
/* light footer variant, used on the dark gallery page */
.pdp-footer--light { background: #fff; color: var(--ink); }
.pdp-footer--light .pdp-lines { display: none; }
.pdp-footer--light h2 { color: var(--mute); }
.pdp-footer--light a { color: var(--ink); }
.pdp-footer--light a:hover { color: var(--blue); }
.pdp-footer--light p { color: var(--slate); }
.pdp-footer--light .pdp-footer__legal { color: var(--ink); }

/* ---------------- Gravity Forms ---------------- */

/* Gravity hides its honeypot in its own stylesheet, which this theme dequeues
   (see pdp_gf_disable_css). Without this the spam trap renders as a real field,
   and anyone who fills it in has their enquiry binned as spam. */
.gform_wrapper .gform_validation_container,
.gform_wrapper .gfield--type-honeypot {
  display: none !important;
}

.gform_wrapper form { margin: 0; }
.gform_wrapper .gform_fields {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px 18px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.gform_wrapper .gfield { margin: 0; padding: 0; }
.gform_wrapper .gfield--width-full,
.gform_wrapper .gfield--type-textarea,
.gform_wrapper .gfield--type-html,
.gform_wrapper .gfield--type-section { grid-column: 1 / -1; }

.gform_wrapper .gfield_label,
.gform_wrapper legend.gfield_label {
  display: block;
  margin: 0 0 7px;
  padding: 0;
  font-family: var(--body);
  font-size: 14px;
  font-weight: 600;
  color: var(--ink);
}
.gform_wrapper .gfield_required { color: var(--amber); text-decoration: none; }
.gform_wrapper .gfield_required_text { display: none; }

.gform_wrapper input[type="text"],
.gform_wrapper input[type="email"],
.gform_wrapper input[type="tel"],
.gform_wrapper input[type="url"],
.gform_wrapper input[type="number"],
.gform_wrapper input[type="date"],
.gform_wrapper select,
.gform_wrapper textarea {
  width: 100%;
  padding: 12px 14px;
  background: #fff;
  border: 1px solid var(--line-2);
  border-radius: 4px;
  font-family: var(--body);
  font-size: 15px;
  line-height: 1.45;
  color: var(--ink);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.gform_wrapper textarea { min-height: 120px; resize: vertical; }
.gform_wrapper input:focus,
.gform_wrapper select:focus,
.gform_wrapper textarea:focus {
  outline: none;
  border-color: var(--blue);
  box-shadow: 0 0 0 3px rgba(31, 75, 240, 0.14);
}

.gform_wrapper .ginput_container_checkbox ul,
.gform_wrapper .ginput_container_radio ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 9px; }
.gform_wrapper .gchoice { display: flex; align-items: center; gap: 10px; }
.gform_wrapper .gchoice input { width: 20px; height: 20px; accent-color: var(--blue); }
.gform_wrapper .gchoice label { margin: 0; font-size: 15px; font-weight: 500; }

.gform_wrapper .gfield_description {
  margin: 6px 0 0;
  padding: 0;
  font-size: 13px;
  line-height: 1.5;
  color: var(--mute);
}
.gform_wrapper .gform_footer { margin: 22px 0 0; padding: 0; }
.gform_wrapper .gform_footer .pdp-btn { width: 100%; }

/* validation */
.gform_wrapper .gfield_error input,
.gform_wrapper .gfield_error select,
.gform_wrapper .gfield_error textarea { border-color: var(--amber); background: #fffdf3; }
.gform_wrapper .validation_message {
  margin: 6px 0 0;
  padding: 0;
  border: none;
  background: none;
  font-size: 13px;
  font-weight: 700;
  color: var(--amber);
}
.gform_wrapper .gform_validation_errors {
  margin: 0 0 20px;
  padding: 16px 18px;
  border: none;
  border-left: 5px solid var(--amber);
  border-radius: 4px;
  background: #fff7e6;
  box-shadow: none;
}
.gform_wrapper .gform_validation_errors h2 {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  color: #5c4308;
}
.gform_wrapper .gform_submission_error { font-size: 15px; }
.gform_confirmation_message { font-size: 16px; line-height: 1.6; }

/* Gravity's own spacing utilities we do not want */
.gform_wrapper .gform_heading { display: none; }
.gform_wrapper .gform_hidden,
.gform_wrapper .gf_invisible { display: none; }

@media (max-width: 560px) {
  .gform_wrapper .gform_fields { grid-template-columns: 1fr; }
}


/* ---------------- contact (orders) ---------------- */

/* A two-up with a fixed-width side panel. Explicit tracks do not collapse the way
   .pdp-two's auto-fit does, so they need their own breakpoint. */
.pdp-two--split { grid-template-columns: minmax(300px, 1fr) minmax(290px, 420px); }
@media (max-width: 900px) {
  .pdp-two--split { grid-template-columns: 1fr; }
}

.pdp-guarantee {
  padding: 22px 26px 24px;
  background: var(--tint);
  border-left: 5px solid var(--blue);
  border-radius: 4px;
}
.pdp-guarantee__title {
  margin: 0 0 6px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--blue);
}
.pdp-guarantee__body { margin: 0; font-size: 17px; line-height: 1.6; color: var(--slate); text-wrap: pretty; }

.pdp-contact-list { margin: 26px 0 0; display: grid; border-top: 1px solid var(--line); }
.pdp-contact-list > div {
  display: grid;
  grid-template-columns: 150px 1fr;
  gap: 16px;
  padding: 14px 0;
  border-bottom: 1px solid var(--line);
}
.pdp-contact-list dt {
  padding-top: 3px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--mute);
}
.pdp-contact-list dd {
  margin: 0;
  min-width: 0;
  font-size: 17px;
  font-weight: 600;
  line-height: 1.5;
  /* an e-mail address has no natural break points */
  overflow-wrap: anywhere;
}
/* The list sits in the narrow half of a two-up, so it stacks well before mobile. */
@media (max-width: 900px) {
  .pdp-contact-list > div { grid-template-columns: 1fr; gap: 4px; }
}

.pdp-formcard {
  padding: 30px 28px 28px;
  background: #fff;
  border: 1px solid var(--line);
  border-top: 4px solid var(--blue);
  border-radius: 4px;
  box-shadow: 0 24px 50px -34px rgba(16, 24, 40, 0.3);
}
.pdp-formcard__title {
  margin: 0 0 20px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line);
  font-family: var(--display);
  font-size: 30px;
  font-weight: 900;
  letter-spacing: 0.01em;
  text-transform: uppercase;
}

/* ---------------- notices ---------------- */

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  margin: 0 0 24px;
  padding: 16px 18px;
  list-style: none;
  border-radius: 4px;
  border-left: 5px solid var(--blue);
  background: var(--tint);
  font-size: 15px;
}
.woocommerce-error { border-color: var(--amber); background: #fff7e6; color: #5c4308; }

/* ---------------- responsive ---------------- */

@media (max-width: 1080px) {
  .pdp-masonry { columns: 3; }
  .pdp-product__grid,
  .pdp-cart-grid,
  .pdp-reviews__grid { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
  .pdp-wrap,
  .pdp-topbar,
  .pdp-hero__inner,
  .pdp-band__inner,
  .pdp-footer__inner,
  .pdp-scoreboard__inner { padding-left: 18px; padding-right: 18px; }
  .pdp-nav { display: none; }
  .pdp-burger { display: flex; }
  .pdp-section { padding: 58px 0; }
}
@media (max-width: 700px) {
  .pdp-masonry { columns: 2; }
  .pdp-hero__inner { padding-top: 56px; padding-bottom: 64px; }
}
@media (max-width: 560px) {
  .pdp-logo { height: 44px; }
  .pdp-topbar { padding-top: 12px; padding-bottom: 12px; }
  .pdp-call__num { display: none; }
  .pdp-cart { padding: 12px 14px; }
  .pdp-fields { grid-template-columns: 1fr; }
  .pdp-attest { grid-template-columns: 1fr; }
  .pdp-receipt__sheet { padding: 24px 20px 22px; }
}
@media (max-width: 420px) {
  .pdp-masonry { columns: 1; }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; }
}

/* ---------------- how picture day goes ---------------- */

.pdp-process {
  margin-top: 30px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}
.pdp-process__item {
  padding: 24px 22px 26px;
  background: #fff;
  border: 1px solid var(--line);
  border-top: 4px solid var(--blue);
  border-radius: 4px;
}
.pdp-process__n {
  display: block;
  margin-bottom: 12px;
  font-family: var(--display);
  font-size: 34px;
  font-weight: 900;
  line-height: 1;
  color: var(--blue);
}
.pdp-process__item h3 { margin: 0 0 8px; font-size: 18px; font-weight: 700; letter-spacing: -0.01em; }
.pdp-process__item p { margin: 0; font-size: 15px; line-height: 1.55; color: var(--slate); text-wrap: pretty; }

@media (max-width: 1000px) { .pdp-process { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .pdp-process { grid-template-columns: 1fr; } }

/* ---------------- trading-card builder ---------------- */

.pdp-cardlab { position: relative; overflow: hidden; background: var(--tint); color: var(--ink); }
.pdp-cardlab__dots {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image: radial-gradient(rgba(31, 75, 240, 0.11) 1.5px, transparent 1.5px);
  background-size: 22px 22px;
}
.pdp-cardlab__glow {
  position: absolute;
  top: -240px;
  left: -170px;
  width: 660px;
  height: 660px;
  border-radius: 50%;
  pointer-events: none;
  background: radial-gradient(circle, rgba(18, 189, 241, 0.2), transparent 65%);
}
.pdp-cardlab .pdp-wrap { position: relative; padding-top: 68px; padding-bottom: 74px; }
.pdp-cardlab__grid {
  display: grid;
  grid-template-columns: minmax(300px, 1.05fr) minmax(280px, 0.95fr);
  gap: 44px 60px;
  align-items: center;
}
.pdp-cardlab__title { font-size: clamp(38px, 5vw, 68px); line-height: 0.87; }
.pdp-cardlab__lede { margin-top: 18px; max-width: 46ch; }
.pdp-cardlab__panel {
  margin-top: 26px;
  padding: 20px 20px 22px;
  background: #fff;
  border: 1px solid var(--tint-2);
  border-radius: 18px;
  box-shadow: 0 20px 44px -34px rgba(16, 24, 40, 0.5);
}
.pdp-cardlab__step {
  margin: 0 0 12px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--mute);
}
.pdp-cardlab__sports { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 20px; }
.pdp-cardlab__sport {
  padding: 9px 15px;
  border: 1px solid var(--line-2);
  border-radius: 999px;
  background: #fff;
  color: var(--slate);
  font-family: var(--body);
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.pdp-cardlab__sport:hover { border-color: var(--blue); color: var(--blue); }
.pdp-cardlab__sport.is-active { background: var(--blue); border-color: var(--blue); color: #fff; }
.pdp-cardlab__inputs { display: grid; grid-template-columns: 1fr 1fr 84px; gap: 10px; }
.pdp-cardlab__inputs input {
  min-width: 0;
  padding: 12px 14px;
  background: #fff;
  border: 1px solid var(--line-2);
  border-radius: 4px;
  font-family: var(--body);
  font-size: 15px;
  color: var(--ink);
}
.pdp-cardlab__inputs input:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px var(--tint-2); }
.pdp-cardlab__inputs input:last-child { grid-column: 1 / -1; }
.pdp-cardlab__actions { margin-top: 16px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }

.pdp-cardlab__stage { display: flex; flex-direction: column; align-items: center; }
.pdp-cardlab__float { width: 100%; max-width: 372px; perspective: 1500px; animation: pdpFloat 7s ease-in-out infinite; }
@keyframes pdpFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-12px); }
}
.pdp-cardlab__card {
  position: relative;
  aspect-ratio: 5 / 7;
  transform-style: preserve-3d;
  cursor: pointer;
  transition: transform 0.8s cubic-bezier(0.2, 0.8, 0.3, 1);
}
.pdp-cardlab__card.is-flipped { transform: rotateY(180deg); }
.pdp-cardlab__card:focus-visible { outline: 3px solid var(--blue); outline-offset: 6px; border-radius: 20px; }
.pdp-cardlab__face {
  position: absolute;
  inset: 0;
  padding: 11px;
  border-radius: 20px;
  backface-visibility: hidden;
  background: linear-gradient(160deg, var(--cyan) 0%, var(--blue) 55%, var(--blue-deep) 100%);
}
.pdp-cardlab__face--back { transform: rotateY(180deg); }
.pdp-cardlab__photo {
  position: relative;
  height: 100%;
  border-radius: 13px;
  overflow: hidden;
  background-color: var(--navy);
  background-size: cover;
  background-position: center 22%;
}
.pdp-cardlab__scrim {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(10, 21, 51, 0.34) 0%, transparent 26%, transparent 52%, rgba(10, 21, 51, 0.92) 88%);
}
.pdp-cardlab__shine {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 42%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.32), transparent);
  animation: pdpShine 4.5s ease-in-out infinite;
}
@keyframes pdpShine {
  0% { transform: translateX(-120%); }
  60%, 100% { transform: translateX(320%); }
}
.pdp-cardlab__pill {
  position: absolute;
  top: 13px;
  left: 14px;
  padding: 5px 11px;
  border-radius: 999px;
  background: rgba(10, 21, 51, 0.7);
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.pdp-cardlab__bignum {
  position: absolute;
  right: 8px;
  bottom: 74px;
  font-family: var(--display);
  font-weight: 900;
  font-size: 148px;
  line-height: 0.72;
  letter-spacing: -0.02em;
  color: rgba(255, 255, 255, 0.16);
}
.pdp-cardlab__plate {
  position: absolute;
  left: 16px;
  right: 16px;
  bottom: 15px;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
}
.pdp-cardlab__names { min-width: 0; }
.pdp-cardlab__first {
  margin: 0;
  font-family: var(--display);
  font-weight: 900;
  font-size: 44px;
  line-height: 0.84;
  letter-spacing: 0.01em;
  text-transform: uppercase;
  color: #fff;
  overflow-wrap: anywhere;
}
.pdp-cardlab__last {
  margin: 3px 0 0;
  font-family: var(--display);
  font-weight: 700;
  font-size: 22px;
  line-height: 1;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--cyan-lt);
  overflow-wrap: anywhere;
}
.pdp-cardlab__year { margin: 0; font-family: var(--display); font-weight: 700; font-size: 24px; line-height: 1; color: rgba(255, 255, 255, 0.72); }

.pdp-cardlab__backinner {
  height: 100%;
  padding: 20px 20px 16px;
  border-radius: 13px;
  background: var(--navy);
  display: flex;
  flex-direction: column;
}
.pdp-cardlab__backhead {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 14px;
  border-bottom: 2px solid var(--blue);
}
.pdp-cardlab__bfirst { margin: 0; font-family: var(--display); font-weight: 900; font-size: 30px; line-height: 0.9; text-transform: uppercase; color: #fff; overflow-wrap: anywhere; }
.pdp-cardlab__blast { margin: 2px 0 0; font-family: var(--display); font-weight: 700; font-size: 17px; line-height: 1; letter-spacing: 0.08em; text-transform: uppercase; color: var(--cyan-lt); overflow-wrap: anywhere; }
.pdp-cardlab__bnum { margin: 0; font-family: var(--display); font-weight: 900; font-size: 46px; line-height: 0.8; color: var(--blue); }
.pdp-cardlab__stats { flex: 1 1 auto; margin: 0; padding-top: 6px; }
.pdp-cardlab__stats > div {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.14);
}
.pdp-cardlab__stats dt { font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: #8da3d6; }
.pdp-cardlab__stats dd { margin: 0; font-family: var(--display); font-size: 21px; font-weight: 700; letter-spacing: 0.01em; color: #fff; text-align: right; }
.pdp-cardlab__backfoot { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-top: 12px; }
.pdp-cardlab__backfoot p { margin: 0; font-size: 10px; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; color: #8da3d6; }
.pdp-cardlab__backfoot p:last-child { font-weight: 700; letter-spacing: 0.1em; text-transform: none; color: #55637f; }
.pdp-cardlab__hint { margin: 14px 0 0; text-align: center; font-size: 13px; font-weight: 600; color: var(--mute); }

@media (max-width: 900px) {
  .pdp-cardlab__grid { grid-template-columns: 1fr; }
  .pdp-cardlab__stage { order: -1; }
}

/* ---------------- generic page prose ---------------- */

.pdp-prose { max-width: 780px; font-size: 17px; line-height: 1.7; color: var(--slate); }
.pdp-prose > * + * { margin-top: 18px; }
.pdp-prose h2 { font-family: var(--display); font-size: 32px; font-weight: 900; letter-spacing: 0.01em; text-transform: uppercase; color: var(--ink); }
.pdp-prose h3 { font-size: 20px; font-weight: 700; letter-spacing: -0.01em; color: var(--ink); }
.pdp-prose ul,
.pdp-prose ol { padding-left: 22px; }
.pdp-prose li + li { margin-top: 8px; }
.pdp-prose img { border-radius: 4px; }

/* ---------------- WooCommerce's own markup ----------------
   The theme's templates use .pdp-btn and .pdp-fields, but WooCommerce still
   renders several things itself: Place order, the order review table, the cart
   quantity box, the payment list and the whole My Account area. Woo's own
   stylesheets are dequeued, so the theme's treatment is mapped onto Woo's class
   names here. Without this those controls fall back to browser defaults. */

.woocommerce .button,
button.button,
a.button,
input.button,
input[type="submit"].button,
.woocommerce-button,
#place_order {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 16px 28px;
  border: none;
  border-radius: 4px;
  background: var(--blue);
  color: #fff;
  font-family: var(--body);
  font-size: 15px;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  text-align: center;
  cursor: pointer;
  transition: background 0.25s ease, transform 0.3s cubic-bezier(0.2, 0.8, 0.3, 1), color 0.25s ease;
}
.woocommerce .button:hover,
button.button:hover,
a.button:hover,
input.button:hover,
.woocommerce-button:hover,
#place_order:hover { background: var(--cyan); color: #062038; transform: translateY(-2px); }

/* Place order is the single call to action in the summary panel. */
#place_order { width: 100%; margin-top: 6px; }

/* Buttons that sit inside a notice must not shout. */
.woocommerce-message .button,
.woocommerce-info .button,
.woocommerce-error .button { padding: 10px 16px; font-size: 13px; }

/* order review table */
.shop_table { width: 100%; border-collapse: collapse; margin: 0 0 18px; font-size: 15px; }
.shop_table th,
.shop_table td { padding: 11px 0; text-align: left; border-bottom: 1px solid var(--line); }
.shop_table th {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mute);
}
.shop_table th:last-child,
.shop_table td:last-child { text-align: right; }
.shop_table .product-name { color: var(--slate); }
.shop_table .product-quantity { font-weight: 700; color: var(--ink); }
.shop_table tfoot th,
.shop_table tfoot td { font-weight: 700; color: var(--ink); }
.shop_table tfoot .order-total th,
.shop_table tfoot .order-total td {
  border-bottom: none;
  padding-top: 14px;
  font-family: var(--display);
  font-size: 22px;
  font-weight: 900;
  letter-spacing: 0.01em;
  color: var(--ink);
}

/* payment methods */
.woocommerce-checkout-payment { margin-top: 6px; }
.wc_payment_methods { margin: 0 0 16px; padding: 0; list-style: none; display: grid; gap: 10px; }
.wc_payment_methods > li { padding: 13px 15px; border: 1px solid var(--line-2); border-radius: 4px; background: #fff; }
.wc_payment_methods > li > label { display: inline; font-size: 15px; font-weight: 700; color: var(--ink); }
.wc_payment_methods input[type="radio"] { margin-right: 8px; accent-color: var(--blue); }
.wc_payment_methods .payment_box { margin: 10px 0 0; font-size: 14px; line-height: 1.55; color: var(--slate); }
.woocommerce-privacy-policy-text p,
.woocommerce-terms-and-conditions-wrapper {
  font-size: 13px;
  line-height: 1.55;
  color: var(--slate);
}

/* the cart's quantity box — the stepper on the product page is .pdp-qty */
.quantity { display: inline-flex; }
.quantity input.qty {
  width: 74px;
  padding: 10px 8px;
  text-align: center;
  font-family: var(--body);
  font-size: 15px;
  font-weight: 700;
  color: var(--ink);
  background: #fff;
  border: 1px solid var(--line-2);
  border-radius: 4px;
}
.quantity input.qty:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px var(--tint-2); }

/* Woo wraps billing and shipping in containers of their own, which would
   otherwise sit as a single cell inside the .pdp-fields grid. */
.pdp-fields > .woocommerce-billing-fields,
.pdp-fields > .woocommerce-shipping-fields,
.pdp-fields > .woocommerce-additional-fields { grid-column: 1 / -1; }
/* Two columns, because WooCommerce pairs first/last name as halves. An auto-fit
   grid fits three at this width and strands them in the first two thirds. */
.woocommerce-billing-fields__field-wrapper,
.woocommerce-shipping-fields__field-wrapper {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px 18px;
}
@media (max-width: 560px) {
  .woocommerce-billing-fields__field-wrapper,
  .woocommerce-shipping-fields__field-wrapper { grid-template-columns: 1fr; }
}
.woocommerce-billing-fields__field-wrapper .form-row-wide,
.woocommerce-shipping-fields__field-wrapper .form-row-wide { grid-column: 1 / -1; }
.woocommerce-billing-fields > h3,
.woocommerce-shipping-fields > h3,
.woocommerce-additional-fields > h3 {
  margin: 0 0 16px;
  font-family: var(--display);
  font-size: 22px;
  font-weight: 900;
  letter-spacing: 0.01em;
  text-transform: uppercase;
  color: var(--ink);
}
.woocommerce-additional-fields { margin-top: 24px; }

/* My account — rendered entirely by WooCommerce */
.woocommerce-form {
  max-width: 520px;
  margin: 0 0 30px;
  padding: 26px 24px 24px;
  background: #fff;
  border: 1px solid var(--line);
  border-top: 4px solid var(--blue);
  border-radius: 4px;
}
.woocommerce-form .form-row,
.woocommerce-form-row { margin: 0 0 16px; }
.woocommerce-form label,
.woocommerce-Input-label { display: block; margin-bottom: 7px; font-size: 14px; font-weight: 600; color: var(--ink); }
/* Two classes: the rule above is (0,1,1) and would otherwise win. */
.woocommerce-form label.woocommerce-form__label-for-checkbox {
  display: flex;
  align-items: center;
  gap: 9px;
  font-weight: 500;
}
.woocommerce-form__input-checkbox { width: 17px; height: 17px; margin: 0; accent-color: var(--blue); }

/* Woo's show/hide password toggle is an icon button in its own stylesheet, which
   is dequeued — left alone it renders as a bare 16px browser button. */
.password-input { position: relative; display: block; }
.password-input .woocommerce-Input { padding-right: 48px; }
.show-password-input {
  position: absolute;
  top: 50%;
  right: 7px;
  transform: translateY(-50%);
  width: 32px;
  height: 32px;
  padding: 0;
  border: none;
  border-radius: 4px;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 19px 19px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23475069' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
  opacity: 0.5;
  cursor: pointer;
  transition: opacity 0.2s ease, background-color 0.2s ease;
}
.show-password-input:hover,
.show-password-input.display-password { opacity: 1; background-color: var(--tint); }
.woocommerce-Input.input-text,
.woocommerce-form input[type="text"],
.woocommerce-form input[type="email"],
.woocommerce-form input[type="password"] {
  width: 100%;
  padding: 12px 14px;
  background: #fff;
  border: 1px solid var(--line-2);
  border-radius: 4px;
  font-family: var(--body);
  font-size: 15px;
  color: var(--ink);
}
.woocommerce-Input.input-text:focus,
.woocommerce-form input:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px var(--tint-2); }

/* ---------------- coupon form ---------------- */
/* Coupons were switched on after launch. WooCommerce's own stylesheet is
   dequeued, so its coupon form arrives as raw browser defaults — a 147px input
   with an inset grey border sitting beside the theme's 45px fields. */

.woocommerce-form-coupon-toggle { margin: 0 0 20px; }
.woocommerce-form-coupon-toggle .woocommerce-info {
  margin: 0;
  padding: 14px 16px;
  border: 1px solid var(--line-2);
  border-left: 3px solid var(--blue);
  border-radius: 4px;
  background: #fff;
  font-size: 15px;
  color: var(--ink);
}
.woocommerce-form-coupon-toggle a.showcoupon { font-weight: 700; color: var(--blue); }
.woocommerce-form-coupon-toggle a.showcoupon:hover { text-decoration: underline; }

form.checkout_coupon {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 12px;
  margin: 0 0 24px;
  padding: 18px;
  border: 1px solid var(--line-2);
  border-radius: 4px;
  background: #fff;
}
form.checkout_coupon p { margin: 0; }
form.checkout_coupon p:first-of-type { flex: 1 1 100%; font-size: 14px; color: var(--slate); }
/* Capped, or the input takes the whole row and pushes Apply onto the next one. */
form.checkout_coupon .form-row { flex: 1 1 220px; max-width: 340px; margin: 0; padding: 0; }
form.checkout_coupon input[type="text"] {
  width: 100%;
  padding: 12px 14px;
  background: #fff;
  border: 1px solid var(--line-2);
  border-radius: 4px;
  font-family: var(--body);
  font-size: 15px;
  color: var(--ink);
  text-transform: uppercase;
}
form.checkout_coupon input[type="text"]:focus {
  outline: none;
  border-color: var(--blue);
  box-shadow: 0 0 0 3px var(--tint-2);
}
form.checkout_coupon .form-row-last,
form.checkout_coupon button { flex: 0 0 auto; margin: 0; }
.woocommerce-MyAccount-navigation ul { margin: 0 0 26px; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 8px; }
.woocommerce-MyAccount-navigation a {
  display: inline-block;
  padding: 10px 15px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--ink);
  border: 1px solid var(--line-2);
  border-radius: 4px;
}
.woocommerce-MyAccount-navigation a:hover { border-color: var(--blue); color: var(--blue); }
.woocommerce-MyAccount-navigation .is-active a { background: var(--ink); border-color: var(--ink); color: #fff; }

/* ---------------- coming soon ---------------- */

.pdp-soon-body { background: var(--navy); }

.pdp-soon {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  overflow: hidden;
  background: var(--navy);
  color: #fff;
}

.pdp-soon__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 28%;
}

.pdp-soon__inner {
  position: relative;
  width: 100%;
  max-width: 900px;
  padding: 56px 28px 48px;
  text-align: center;
}

.pdp-soon__logo { height: 84px; width: auto; margin: 0 auto 26px; display: block; }

.pdp-soon .pdp-badge { margin: 0 auto; }
.pdp-soon .pdp-hero__title { margin-top: 20px; }
.pdp-soon .pdp-hero__body { margin-left: auto; margin-right: auto; }
.pdp-soon .pdp-chips { justify-content: center; }

.pdp-soon__phone {
  margin: 34px 0 0;
  padding: 24px 20px;
  background: rgba(10, 21, 51, 0.5);
  border: 1px solid rgba(255, 255, 255, 0.26);
  border-radius: 4px;
}

.pdp-soon__phone p {
  margin: 0 0 6px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--cyan-lt);
}

.pdp-soon__strip {
  margin: 32px 0 0;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 8px;
}

.pdp-soon__strip img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  border-radius: 3px;
  opacity: 0.85;
}

.pdp-soon__legal {
  margin: 30px 0 0;
  font-size: 13px;
  color: #a8bbe4;
}

@media (max-width: 700px) {
  .pdp-soon__logo { height: 62px; }
  .pdp-soon__strip { grid-template-columns: repeat(3, 1fr); }
}

/* ---------------- print (receipt) ---------------- */

@media print {
  .pdp-header,
  .pdp-footer,
  .pdp-lightbox,
  .pdp-no-print { display: none !important; }
  body { background: #fff; font-size: 12pt; }
  .pdp-receipt { padding: 0; }
  .pdp-receipt__sheet { max-width: none; border: none; padding: 0; }
  .pdp-receipt__bring { background: #fff !important; color: #000 !important; border: 2px solid #000; }
  a { color: #000; }
}

/* ---------------- Blue Winds Media badge ---------------- */
/* Shared agency credit, matching the badge used across BWM client sites.
   The --light modifier pairs with .pdp-footer--light on the gallery page. */
.bwm-badge{
	display:inline-flex;
	align-items:center;
	gap:8px;
	padding:7px 14px 7px 9px;
	border-radius:999px;
	border:1px solid rgba(255,255,255,.14);
	background:rgba(255,255,255,.045);
	text-decoration:none;
	line-height:1;
	white-space:nowrap;
	transition:background .28s ease,border-color .28s ease,transform .28s cubic-bezier(.22,.61,.36,1),box-shadow .28s ease;
	-webkit-font-smoothing:antialiased;
}
.bwm-badge:hover,
.bwm-badge:focus-visible{
	background:rgba(69,174,250,.14);
	border-color:rgba(69,174,250,.5);
	transform:translateY(-1px);
	box-shadow:0 6px 18px rgba(69,174,250,.18);
}
.bwm-badge__icon{
	width:16px;
	height:16px;
	flex:0 0 auto;
	display:block;
	transition:transform .38s cubic-bezier(.22,.61,.36,1);
}
.bwm-badge:hover .bwm-badge__icon{transform:scale(1.09)}
.bwm-badge__text{
	display:inline-flex;
	align-items:baseline;
	gap:.34em;
	font-family:inherit;
	font-size:10.5px;
	letter-spacing:.09em;
	text-transform:uppercase;
}
.bwm-badge__pre{
	color:rgba(255,255,255,.5);
	font-weight:500;
	transition:color .28s ease;
}
.bwm-badge__name{
	color:#fff;
	font-weight:700;
	transition:color .28s ease;
}
.bwm-badge:hover .bwm-badge__pre{color:rgba(255,255,255,.72)}
.bwm-badge:hover .bwm-badge__name{color:#8ACBFC}

/* Light surfaces */
.bwm-badge--light{
	border-color:rgba(16,21,29,.12);
	background:rgba(16,21,29,.035);
}
.bwm-badge--light:hover,
.bwm-badge--light:focus-visible{
	background:rgba(69,174,250,.1);
	border-color:rgba(69,174,250,.45);
	box-shadow:0 6px 18px rgba(69,174,250,.14);
}
.bwm-badge--light .bwm-badge__pre{color:rgba(16,21,29,.5)}
.bwm-badge--light .bwm-badge__name{color:#10151D}
.bwm-badge--light:hover .bwm-badge__pre{color:rgba(16,21,29,.68)}
.bwm-badge--light:hover .bwm-badge__name{color:#1D8FE0}

@media (prefers-reduced-motion:reduce){
	.bwm-badge,.bwm-badge__icon{transition:none}
	.bwm-badge:hover{transform:none}
	.bwm-badge:hover .bwm-badge__icon{transform:none}
}

/* ---------------- stripe express checkout (apple/google pay) ---------------- */

.woocommerce-checkout #wc-stripe-express-checkout-element {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 14px 18px;
  margin: 0 0 4px;
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: #fff;
}
.woocommerce-checkout #wc-stripe-express-checkout-element::before {
  content: "Express checkout";
  grid-column: 1 / -1;
  font-family: var(--display);
  font-size: 22px;
  font-weight: 900;
  letter-spacing: 0.01em;
  line-height: 1;
  text-transform: uppercase;
  color: var(--ink);
}
.woocommerce-checkout #wc-stripe-express-checkout-element:empty { display: none; }

.woocommerce-checkout #wc-stripe-express-checkout-button-separator {
  font-size: 0 !important;
  line-height: 0;
  margin: 26px 0 !important;
  text-align: center;
  background: linear-gradient(var(--line-2), var(--line-2)) center / 100% 1px no-repeat;
}
.woocommerce-checkout #wc-stripe-express-checkout-button-separator::before {
  content: "or continue below";
  display: inline-block;
  padding: 0 16px;
  background: #fff;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.14em;
  line-height: 1;
  text-transform: uppercase;
  color: var(--mute);
}

.woocommerce-checkout #wc-stripe-express-checkout-element { grid-template-columns: 1fr 1fr; }
@media (max-width: 560px) {
  .woocommerce-checkout #wc-stripe-express-checkout-element { grid-template-columns: 1fr; }
}

/* ---------------- stripe payment box (sidebar payment options) ---------------- */

.wc_payment_methods > li.payment_method_stripe { padding: 0; border: 0; background: transparent; }
.wc_payment_methods > li.payment_method_stripe > label {
  display: block;
  margin: 0 0 10px;
  font-family: var(--display);
  font-size: 20px;
  font-weight: 900;
  letter-spacing: 0.01em;
  text-transform: uppercase;
  color: var(--ink);
}
.wc_payment_methods > li.payment_method_stripe .payment_box { margin: 0; padding: 0; background: transparent; }
.payment_method_stripe .wc-upe-form { margin: 0; padding: 0; border: 0; }
.payment_method_stripe .woocommerce-SavedPaymentMethods { margin: 0 0 10px; padding: 0; list-style: none; }
.payment_method_stripe .woocommerce-SavedPaymentMethods-saveNew {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 12px 0 0;
  padding: 0;
  font-size: 13px;
  line-height: 1.5;
  color: var(--slate);
}
.payment_method_stripe .woocommerce-SavedPaymentMethods-saveNew input[type="checkbox"] {
  margin: 2px 0 0;
  accent-color: var(--blue);
  flex: none;
}

#payment .payment_method_stripe .woocommerce-SavedPaymentMethods-saveNew,
#payment .payment_method_stripe .payment_box fieldset {
  border: 0;
  background: transparent;
  padding: 0;
}

/* ---------------- sticky order summary on checkout/cart ---------------- */

@media (min-width: 1081px) {
  .pdp-cart-grid > div:last-child {
    position: sticky;
    top: 121px; /* sticky header (103px) + breathing room */
  }
  body.admin-bar .pdp-cart-grid > div:last-child { top: 153px; }
}

/* ---------------- checkout order items toggle ---------------- */

.pdp-items-toggle {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin: -10px 0 14px;
  padding: 0;
  border: 0;
  background: none;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--blue);
  cursor: pointer;
}
.pdp-items-toggle::after {
  content: "";
  width: 7px;
  height: 7px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translateY(-1px);
  transition: transform 0.15s;
}
.pdp-summary:not(.pdp-items-collapsed) .pdp-items-toggle::after {
  transform: rotate(-135deg) translateY(-2px);
}
.pdp-items-collapsed .woocommerce-checkout-review-order-table thead,
.pdp-items-collapsed .woocommerce-checkout-review-order-table tbody { display: none; }