/* Product imagery and finish selection. */
.products .product-card { color: var(--ink); }
.hero { height: calc(100vw * 941 / 1672 + 78px); min-height: 740px; background: #061927; }
.brand-logo { position: relative; overflow: hidden; background: #fff; border-color: #d8a142; }
.brand-logo img { position: absolute; width: 250%; height: 250%; max-width: none; left: -75%; top: -45%; object-fit: cover; }
.hero-image { top: 78px; height: calc(100% - 78px); object-fit: contain; object-position: center; }
.hero-shade { background: linear-gradient(90deg, rgba(2,17,29,.88) 0%, rgba(2,22,37,.62) 32%, rgba(2,22,37,.08) 57%, transparent 76%), linear-gradient(0deg, rgba(2,20,32,.45), transparent 28%); }
.hero-copy { width: 40%; max-width: 670px; }
.hero h1 { font-size: clamp(3rem, 5.1vw, 6.3rem); line-height: 1.01; }
.hero-copy > p:not(.eyebrow) { font-size: clamp(1rem, 1.2vw, 1.25rem); }
.product-card.render-card { display: flex; flex-direction: column; min-width: 0; }
.render-card .product-content { flex: 1; }
.product-visual.render-visual { min-height: 0; aspect-ratio: 4 / 3; background: #08263a; }
.render-visual::before, .render-visual::after { content: none; }
.render-visual img { display: block; width: 100%; height: 100%; object-fit: contain; background: #08263a; }
.render-visual img[hidden] { display: none; }
.product-visual.rope-scene { aspect-ratio: 4 / 3; min-height: 0; }
.rope-scene img { object-fit: contain; object-position: center; }
.variant-picker { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 18px; }
.variant-choice { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 9px 12px; border: 1px solid var(--line); border-radius: 3px; background: #fff; color: var(--ink); font-size: .875rem; font-weight: 650; cursor: pointer; }
.variant-choice:hover { border-color: var(--blue); background: #f1fafa; }
.variant-choice[aria-pressed="true"] { color: #fff; background: var(--navy); border-color: var(--navy); }
.variant-choice:focus-visible { outline: 3px solid var(--blue); outline-offset: 3px; }
.finish-swatch { flex: 0 0 18px; width: 18px; height: 18px; border-radius: 50%; border: 1px solid rgba(8,38,58,.2); }
.finish-swatch.south-beach { background: linear-gradient(150deg, #1daeb8, #c6bdd7 50%, #ed5c9d); }
.finish-swatch.red-white { background: linear-gradient(135deg, #cd172c 42%, #f6f6f1 42%); }
.finish-swatch.gold-white { background: linear-gradient(135deg, #e2ac22 42%, #f6f6f1 42%); }
.product-content .finish-description { font-size: .875rem; margin-bottom: 25px; }
.product-content .status { font-size: .75rem; }
.image-note { font-size: .875rem; }
@media (max-width: 1000px) {
  .hero { display: block; height: auto; min-height: 0; padding: 78px 0 0; background: #061927; }
  .hero-image { position: relative; top: auto; height: auto; aspect-ratio: 16 / 9; object-fit: contain; }
  .hero-shade { display: none; }
  .hero-copy { width: 100%; max-width: 760px; padding: 36px clamp(22px, 7vw, 65px) 24px; }
  .hero h1 { font-size: clamp(2.6rem, 6.5vw, 4.4rem); }
  .hero-copy > p:not(.eyebrow) { font-size: 1.0625rem; }
  .hero-actions { margin-top: 24px; }
  .scroll-cue { position: relative; display: inline-block; bottom: auto; padding: 8px clamp(22px, 7vw, 65px) 32px; }
}
@media (max-width: 560px) {
  .hero { padding-top: 68px; }
  #site-nav { top: 67px; }
  .hero-copy { padding: 28px 22px 24px; }
  .hero h1 { font-size: clamp(2.5rem, 10.5vw, 3.35rem); }
  .hero-actions { flex-direction: column; }
  .hero-actions .button { width: 100%; }
  .product-visual.rope-scene { min-height: 0; }
  .product-visual.render-visual { aspect-ratio: 4 / 3; }
  .variant-choice { flex: 1 1 auto; justify-content: center; padding-inline: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}
