/* Representative hull silhouettes used on the public quote flow.
   The source sprite contains 16 purpose-drawn naval-profile illustrations,
   ordered exactly like HULLS in src/lib/calculator.js. */
.hull-option .hull-art { display:none; }
.hull-option::before {
  content:"";
  display:block;
  grid-row:1;
  width:100%;
  max-width:180px;
  aspect-ratio:180 / 96;
  justify-self:center;
  align-self:center;
  background-image:url('/hull-profiles.svg');
  background-repeat:no-repeat;
  background-size:100% 1600%;
  background-position-x:center;
  transition:transform .2s ease,filter .2s ease;
}
.hull-option:hover::before { transform:translateY(-1px) scale(1.015); }
.hull-option.selected::before { filter:saturate(1.16) contrast(1.04); }
.hull-option:nth-child(1)::before  { background-position-y:0%; }
.hull-option:nth-child(2)::before  { background-position-y:6.666667%; }
.hull-option:nth-child(3)::before  { background-position-y:13.333333%; }
.hull-option:nth-child(4)::before  { background-position-y:20%; }
.hull-option:nth-child(5)::before  { background-position-y:26.666667%; }
.hull-option:nth-child(6)::before  { background-position-y:33.333333%; }
.hull-option:nth-child(7)::before  { background-position-y:40%; }
.hull-option:nth-child(8)::before  { background-position-y:46.666667%; }
.hull-option:nth-child(9)::before  { background-position-y:53.333333%; }
.hull-option:nth-child(10)::before { background-position-y:60%; }
.hull-option:nth-child(11)::before { background-position-y:66.666667%; }
.hull-option:nth-child(12)::before { background-position-y:73.333333%; }
.hull-option:nth-child(13)::before { background-position-y:80%; }
.hull-option:nth-child(14)::before { background-position-y:86.666667%; }
.hull-option:nth-child(15)::before { background-position-y:93.333333%; }
.hull-option:nth-child(16)::before { background-position-y:100%; }

@media (max-width:520px) {
  .hull-option { min-height:132px; padding-top:8px; }
  .hull-option::before { max-width:150px; }
}
