.product-visual-section {
  --pv-paper: color-mix(in srgb, var(--status-success) 8%, var(--text-primary));
  --pv-ink: var(--surface-high);
}
.product-visual-section .product-section__lead {
  max-width: 980px;
  margin-left: auto;
  margin-right: auto;
  font-family: var(--font-sans);
  font-size: var(--text-lg);
  line-height: var(--leading-relaxed);
  text-align: center;
  text-wrap: balance;
}
.pv-context, .pv-context > span, .pv-shared-meta, .pv-flow__caption {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}
.pv-context {
  justify-content: space-between;
  gap: var(--space-4);
  margin-bottom: var(--space-4);
  color: var(--text-secondary);
  font-size: var(--text-xs);
}
.pv-context > span:first-child { color: var(--brand-blue-tint); }
.pv-context > span:last-child { color: var(--text-secondary); }
.pv-context--end { justify-content: flex-end; }
.product-visual-section .material-symbols-outlined { font-size: var(--text-lg); flex-shrink: 0; }
.pv-formats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); }
.pv-format {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-card);
  background: linear-gradient(140deg, var(--surface-low), var(--canvas));
}
.pv-format--2 { border-color: rgb(var(--ch-brand-blue) / var(--a-55)); }
.pv-preview {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  aspect-ratio: 8 / 5;
  color: var(--pv-ink);
  background: var(--pv-paper);
}
.pv-preview__heading { position: absolute; z-index: 2; top: var(--space-5); left: var(--space-5); right: var(--space-5); }
.pv-preview__heading > span { display: block; font-size: var(--text-2xs); font-weight: var(--weight-semibold); }
.pv-preview__heading > strong { display: block; max-width: 55%; margin-top: var(--space-2); font-size: var(--text-xl); font-weight: var(--weight-bold); line-height: var(--leading-tight); letter-spacing: var(--tracking-tight); }
.pv-bottle { display: block; object-fit: contain; }
.pv-preview > .pv-bottle { position: absolute; z-index: 1; right: 2%; bottom: -5%; width: 47%; height: 96%; transform: rotate(13deg); }
.pv-preview__halo { position: absolute; width: 75%; aspect-ratio: 1; top: 24%; right: -18%; border: 1px solid color-mix(in srgb, var(--pv-ink) 18%, transparent); border-radius: var(--radius-full); }
.pv-preview__halo::after { content: ''; position: absolute; inset: var(--space-5); border: inherit; border-radius: inherit; }
.pv-preview__product { position: absolute; z-index: 2; bottom: var(--space-5); left: var(--space-5); max-width: 40%; font-size: var(--text-xs); font-weight: var(--weight-semibold); }
.pv-preview--1 { color: var(--text-primary); background: radial-gradient(ellipse at 65% 90%, color-mix(in srgb, var(--brand-blue) 24%, var(--surface-high)), var(--surface-high)); }
.pv-preview--1 > .pv-bottle { width: 48%; height: 92%; right: 15%; bottom: -12%; transform: rotate(-32deg); }
.pv-preview--1 .pv-preview__heading > strong { max-width: 50%; }
.pv-preview__guide { position: absolute; z-index: 3; display: grid; gap: var(--space-3); right: var(--space-5); top: var(--space-5); }
.pv-preview__guide span { display: grid; place-items: center; width: var(--space-8); aspect-ratio: 1; border: 1px solid var(--border-brand); border-radius: var(--radius-full); color: var(--brand-blue-soft); font-size: var(--text-xs); font-weight: var(--weight-semibold); }
.pv-preview__guide span:nth-child(2) { color: var(--surface-low); background: var(--brand-blue-soft); }
.pv-preview__arc { position: absolute; z-index: 2; width: 45%; right: 11%; top: 33%; color: var(--brand-blue-soft); transform: rotate(30deg); }
.pv-preview--2 { background: color-mix(in srgb, var(--status-warning) 8%, var(--text-primary)); }
.pv-preview--2 .pv-preview__heading > strong { display: none; }
.pv-preview__mosaic { position: absolute; display: grid; grid-template-columns: 1.1fr 1fr; grid-template-rows: 1fr 1fr; gap: var(--space-2); inset: var(--space-12) var(--space-5) var(--space-5); transform: rotate(-4deg); }
.pv-preview__mosaic > div { position: relative; overflow: hidden; border: 2px solid var(--text-primary); border-radius: var(--radius-sm); background: color-mix(in srgb, var(--pv-paper) 65%, var(--text-secondary)); }
.pv-preview__mosaic > div:first-child { grid-row: 1 / 3; background: color-mix(in srgb, var(--status-success) 12%, var(--text-secondary)); }
.pv-preview__mosaic .pv-bottle { width: 100%; height: 100%; object-fit: contain; transform: rotate(15deg) scale(1.16); }
.pv-preview__mosaic > div:nth-child(2) .pv-bottle { transform: rotate(65deg) scale(1.35); }
.pv-preview__mosaic > div:nth-child(3) .pv-bottle { transform: rotate(-18deg) scale(1.6); }
.pv-preview__mosaic .material-symbols-outlined { position: absolute; right: var(--space-1); bottom: var(--space-1); }
.pv-preview__media-label { position: absolute; display: flex; align-items: center; gap: var(--space-2); z-index: 3; bottom: var(--space-3); right: var(--space-3); padding: var(--space-2) var(--space-3); border-radius: var(--radius-full); background: var(--surface-high); color: var(--text-primary); font-size: var(--text-xs); }
.pv-format__body { padding: var(--space-6); }
.pv-format__body h3 { margin: 0 0 var(--space-2); color: var(--text-primary); font-family: var(--font-sans); font-size: var(--text-xl); font-weight: var(--weight-semibold); line-height: var(--leading-snug); }
.pv-format__body > p { color: var(--text-secondary); font-size: var(--text-base); line-height: var(--leading-relaxed); }
.pv-review-required { display: inline-flex; align-items: center; gap: var(--space-1); margin-top: var(--space-3); color: var(--brand-blue-tint); font-size: var(--text-xs); }
.pv-shared-meta { justify-content: center; margin: var(--space-6) 0; color: var(--text-secondary); font-size: var(--text-sm); text-align: center; }
.pv-details {
  margin-top: var(--space-6);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-lg);
  background: var(--surface-low);
}
.pv-details > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  min-height: var(--space-18);
  padding: var(--space-5) var(--space-7);
  color: var(--text-primary);
  font-size: var(--text-md);
  font-weight: var(--weight-semibold);
  line-height: var(--leading-snug);
  list-style: none;
  cursor: pointer;
}
.pv-details > summary::-webkit-details-marker { display: none; }
.pv-details > summary::after {
  content: '+';
  display: grid;
  place-items: center;
  flex-shrink: 0;
  width: var(--space-8);
  height: var(--space-8);
  border-radius: var(--radius-full);
  background: var(--surface-high);
  color: var(--brand-blue-tint);
  font-size: var(--text-xl);
}
.pv-details[open] > summary { border-bottom: 1px solid var(--border-subtle); }
.pv-details[open] > summary::after { content: '\2212'; }
.pv-details > summary:hover { color: var(--brand-blue-soft); }
.pv-details__body { padding: 0 var(--space-7) var(--space-7); }
.pv-details__overview,
.pv-explanation__row,
.pv-details__note {
  display: grid;
  grid-template-columns: minmax(180px, 0.8fr) minmax(0, 2.2fr);
  align-items: baseline;
  column-gap: var(--space-10);
  row-gap: var(--space-3);
  padding: var(--space-6) 0;
}
.pv-details__overview { border-bottom: 1px solid var(--border-subtle); }
.pv-explanation__row + .pv-explanation__row { border-top: 1px solid var(--border-subtle); }
.pv-details__body h3 {
  margin: 0;
  color: var(--text-primary);
  font-family: var(--font-sans);
  font-size: var(--text-md);
  font-weight: var(--weight-semibold);
  line-height: var(--leading-normal);
}
.pv-details__body p {
  min-width: 0;
  max-width: 76ch;
  margin: 0;
  color: var(--text-secondary);
  font-size: var(--text-base);
  line-height: var(--leading-relaxed);
  overflow-wrap: break-word;
}
.pv-details__overview h3,
.pv-details__note h3 { color: var(--brand-blue-tint); font-size: var(--text-sm); }
.pv-details__note { border-top: 1px solid var(--border-brand); padding-bottom: 0; }
.pv-flow { display: grid; grid-template-columns: 1fr 1.1fr 0.8fr; gap: var(--space-16); align-items: stretch; padding: var(--space-6) 0; }
.pv-flow__node { position: relative; min-width: 0; }
.pv-flow__node:not(:last-child)::after { content: '\2192'; position: absolute; right: calc(-1 * var(--space-11)); top: 52%; color: var(--brand-blue-tint); font-size: var(--text-2xl); }
.pv-flow h3 { margin-bottom: var(--space-5); color: var(--text-primary); font-size: var(--text-md); font-weight: var(--weight-semibold); text-align: center; }
.pv-source__row { display: flex; align-items: center; gap: var(--space-4); min-height: 104px; padding: var(--space-3); border: 1px solid var(--border-subtle); border-radius: var(--radius-md); background: var(--surface-low); }
.pv-source__row + .pv-source__row { margin-top: var(--space-3); }
.pv-source__images { display: flex; flex: 0 0 104px; height: 76px; }
.pv-source__images .pv-bottle { width: 60px; height: 76px; background: var(--pv-paper); border: 2px solid var(--surface-low); border-radius: var(--radius-sm); }
.pv-source__images .pv-bottle + .pv-bottle { margin-left: calc(-1 * var(--space-4)); transform: rotate(9deg); }
.pv-source__row--buyers .pv-source__images .pv-bottle { background: color-mix(in srgb, var(--status-warning) 15%, var(--text-secondary)); transform: rotate(-8deg); }
.pv-source__row--buyers .pv-source__images .pv-bottle + .pv-bottle { background: color-mix(in srgb, var(--status-success) 12%, var(--text-secondary)); transform: rotate(6deg); }
.pv-source__row > span { display: grid; gap: var(--space-2); color: var(--text-secondary); font-size: var(--text-sm); line-height: var(--leading-snug); }
.pv-source__row .material-symbols-outlined { color: var(--brand-blue-tint); }
.pv-script__sheet { min-height: 220px; padding: var(--space-5); border: 1px solid var(--border-brand); border-radius: var(--radius-md); background: linear-gradient(150deg, var(--surface-high), var(--surface-low)); }
.pv-script__mark { color: var(--brand-blue-soft); font-size: var(--text-xl); font-weight: var(--weight-semibold); }
.pv-script__sheet p { margin-top: var(--space-3); color: var(--text-primary); font-size: var(--text-md); line-height: var(--leading-relaxed); }
.pv-waveform { display: flex; align-items: center; justify-content: space-between; gap: 1%; height: var(--space-12); margin-top: var(--space-5); }
.pv-waveform i {
  display: block;
  flex: 1;
  max-width: var(--space-1);
  height: var(--wave-height, 30%);
  border-radius: var(--radius-full);
  background: var(--brand-blue-tint);
  transform-origin: center;
  animation: pv-waveform-pulse var(--dur-ambient-slow) ease-in-out infinite;
}
.pv-waveform i:nth-child(2n) { animation-delay: calc(-1 * var(--dur-base)); }
.pv-waveform i:nth-child(3n) { animation-delay: calc(-1 * var(--dur-entrance)); }
.pv-waveform i:nth-child(4n) { animation-duration: var(--dur-ambient); }
.pv-waveform i:nth-child(5n) { animation-delay: calc(-1 * var(--dur-ambient)); }

@keyframes pv-waveform-pulse {
  0%, 100% { transform: scaleY(0.6); }
  30% { transform: scaleY(0.95); }
  55% { transform: scaleY(0.7); }
  80% { transform: scaleY(1); }
}
.pv-flow__caption { justify-content: center; margin-top: var(--space-4); color: var(--text-secondary); font-size: var(--text-xs); line-height: var(--leading-relaxed); text-align: center; }
.pv-phone { position: relative; isolation: isolate; width: 132px; aspect-ratio: 9 / 16; margin: 0 auto; overflow: hidden; border: var(--space-1) solid var(--surface-highest); border-radius: var(--radius-card); background: var(--pv-paper); box-shadow: var(--shadow-2); }
.pv-phone > .pv-bottle { width: 100%; height: 86%; transform: rotate(12deg); }
.pv-phone__camera { position: absolute; z-index: 1; top: var(--space-2); left: 38%; width: 24%; height: var(--space-1); border-radius: var(--radius-full); background: var(--surface-highest); }
.pv-phone__caption { position: absolute; inset: auto var(--space-2) var(--space-6); padding: var(--space-1); color: var(--pv-ink); background: var(--pv-paper); font-size: var(--text-2xs); font-weight: var(--weight-semibold); text-align: center; line-height: var(--leading-tight); }
.pv-phone__timeline { position: absolute; display: flex; gap: var(--space-1); inset: auto var(--space-3) var(--space-3); }
.pv-phone__timeline i { height: 2px; flex: 1; background: color-mix(in srgb, var(--pv-ink) 25%, transparent); }
.pv-phone__timeline i:first-child { background: var(--pv-ink); }
.pv-presenter { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-5); margin-top: var(--space-7); padding: var(--space-5) var(--space-6); border: 1px solid var(--border-subtle); border-radius: var(--radius-lg); background: linear-gradient(100deg, var(--surface-high), var(--surface-low)); }
.pv-presenter__avatar { display: grid; place-items: center; width: var(--space-14); height: var(--space-14); flex-shrink: 0; color: var(--brand-blue-soft); border: 1px dashed var(--border-brand); border-radius: var(--radius-full); }
.pv-presenter__avatar svg { width: var(--space-10); height: var(--space-10); }
.pv-presenter__copy { flex: 1 1 250px; }
.pv-presenter h3 { color: var(--text-primary); font-size: var(--text-md); font-weight: var(--weight-semibold); }
.pv-presenter p { margin-top: var(--space-1); color: var(--text-secondary); font-size: var(--text-sm); line-height: var(--leading-relaxed); }
.pv-presenter__price { color: var(--text-primary); font-size: var(--text-sm); font-weight: var(--weight-medium); }
.pv-presenter__off { display: flex; align-items: center; gap: var(--space-2); color: var(--text-secondary); font-size: var(--text-xs); }
.pv-presenter__off > span { width: var(--space-2); height: var(--space-2); border: 1px solid currentColor; border-radius: var(--radius-full); }

@media (max-width: 1023px) {
  .pv-formats { gap: var(--space-3); }
  .pv-format__body { padding: var(--space-4); }
  .pv-preview { aspect-ratio: 1.15; }
  .pv-preview__heading { top: var(--space-4); left: var(--space-4); right: var(--space-4); }
  .pv-preview__heading > strong { font-size: var(--text-md); }
  .pv-preview > .pv-bottle { height: 85%; width: 55%; bottom: -8%; }
  .pv-flow { grid-template-columns: 1fr 1fr 0.7fr; gap: var(--space-9); }
  .pv-flow__node:not(:last-child)::after { right: calc(-1 * var(--space-7)); }
  .pv-source__row { flex-direction: column; align-items: flex-start; gap: var(--space-2); }
  .pv-source__images { flex-basis: auto; }
  .pv-source__row > span { display: flex; align-items: center; }
  .pv-script__sheet { min-height: 0; }
}
@media (max-width: 767px) {
  .product-visual-section .product-section__lead { font-size: var(--text-md); }
  .pv-formats { grid-template-columns: minmax(0, 1fr); gap: var(--space-5); }
  .pv-format { width: 100%; max-width: 440px; margin: 0 auto; }
  .pv-preview { aspect-ratio: 8 / 5; }
  .pv-preview__heading > strong { font-size: var(--text-xl); }
  .pv-preview > .pv-bottle { height: 96%; width: 47%; bottom: -5%; }
  .pv-preview--1 > .pv-bottle { bottom: -12%; }
  .pv-format__body { padding: var(--space-5); }
  .pv-context { flex-wrap: wrap; }
  .pv-shared-meta { font-size: var(--text-xs); }
  .pv-details > summary { padding: var(--space-4) var(--space-5); font-size: var(--text-base); }
  .pv-details__body { padding: 0 var(--space-5) var(--space-5); }
  .pv-details__overview,
  .pv-explanation__row,
  .pv-details__note { grid-template-columns: minmax(0, 1fr); padding-top: var(--space-5); }
  .pv-details__overview,
  .pv-explanation__row { padding-bottom: var(--space-5); }
  .pv-flow { grid-template-columns: minmax(0, 1fr); gap: var(--space-14); max-width: 440px; margin: 0 auto; }
  .pv-flow__node:not(:last-child)::after { content: '\2193'; top: auto; bottom: calc(-1 * var(--space-11)); left: 0; right: 0; text-align: center; }
  .pv-source__row { flex-direction: row; align-items: center; gap: var(--space-4); }
  .pv-source__row > span { display: grid; }
  .pv-source__images { flex-basis: 104px; }
  .pv-script__sheet { padding: var(--space-6); }
  .pv-phone { width: 150px; }
  .pv-presenter { gap: var(--space-3); padding: var(--space-5); }
  .pv-presenter__copy { flex-basis: calc(100% - var(--space-18)); }
  .pv-presenter__price { margin-right: auto; }
}

@media (prefers-reduced-motion: reduce) {
  .pv-waveform i { animation: none; transform: none; }
}
